diff --git a/rtl-spec/components/editors-non-ideal-state.spec.tsx b/rtl-spec/components/editors-non-ideal-state.spec.tsx
new file mode 100644
index 0000000000..29d5e84f1d
--- /dev/null
+++ b/rtl-spec/components/editors-non-ideal-state.spec.tsx
@@ -0,0 +1,33 @@
+import React from 'react';
+
+import { render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+import { RenderNonIdealState } from '../../src/renderer/components/editors-non-ideal-state';
+import { EditorMosaic } from '../../src/renderer/editor-mosaic';
+
+describe('RenderNonIdealState component', () => {
+  let editorMosaic: EditorMosaic;
+
+  beforeEach(() => {
+    ({ editorMosaic } = window.app.state);
+  });
+
+  it('renders a non-ideal state', () => {
+    const { getByText } = render(
+      <RenderNonIdealState editorMosaic={{} as EditorMosaic} />,
+    );
+
+    expect(getByText('Reset editors')).toBeInTheDocument();
+  });
+
+  it('handles a click', async () => {
+    const resetLayoutSpy = jest.spyOn(editorMosaic, 'resetLayout');
+    const { getByRole } = render(
+      <RenderNonIdealState editorMosaic={editorMosaic} />,
+    );
+    await userEvent.click(getByRole('button'));
+
+    expect(resetLayoutSpy).toHaveBeenCalledTimes(1);
+  });
+});
diff --git a/src/renderer/components/editors-non-ideal-state.tsx b/src/renderer/components/editors-non-ideal-state.tsx
index 386b6a8f6a..f58ba35081 100644
--- a/src/renderer/components/editors-non-ideal-state.tsx
+++ b/src/renderer/components/editors-non-ideal-state.tsx
@@ -4,7 +4,13 @@ import { Button, NonIdealState } from '@blueprintjs/core';
 
 import { EditorMosaic } from '../editor-mosaic';
 
-export function renderNonIdealState(editorMosaic: EditorMosaic) {
+type RenderNonIdealStateProps = {
+  editorMosaic: EditorMosaic;
+};
+
+export function RenderNonIdealState({
+  editorMosaic,
+}: RenderNonIdealStateProps) {
   const resolveButton = (
     <Button text="Reset editors" onClick={() => editorMosaic.resetLayout()} />
   );
diff --git a/src/renderer/components/editors.tsx b/src/renderer/components/editors.tsx
index 07be780a27..ee5efb325b 100644
--- a/src/renderer/components/editors.tsx
+++ b/src/renderer/components/editors.tsx
@@ -11,7 +11,7 @@ import {
 } from 'react-mosaic-component';
 
 import { Editor } from './editor';
-import { renderNonIdealState } from './editors-non-ideal-state';
+import { RenderNonIdealState } from './editors-non-ideal-state';
 import { MaximizeButton, RemoveButton } from './editors-toolbar-button';
 import { EditorId, SetFiddleOptions } from '../../interfaces';
 import { AppState } from '../state';
@@ -262,7 +262,7 @@ export const Editors = observer(
           className={`focused__${this.state.focused}`}
           onChange={this.onChange}
           value={editorMosaic.mosaic}
-          zeroStateView={renderNonIdealState(editorMosaic)}
+          zeroStateView={<RenderNonIdealState editorMosaic={editorMosaic} />}
           renderTile={this.renderTile}
         />
       );
diff --git a/tests/renderer/components/__snapshots__/editors-non-ideal-state-spec.tsx.snap b/tests/renderer/components/__snapshots__/editors-non-ideal-state-spec.tsx.snap
deleted file mode 100644
index c38ef9fc78..0000000000
--- a/tests/renderer/components/__snapshots__/editors-non-ideal-state-spec.tsx.snap
+++ /dev/null
@@ -1,14 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renderNonIdealState() renders a non-ideal state 1`] = `
-<Blueprint3.NonIdealState
-  action={
-    <Blueprint3.Button
-      onClick={[Function]}
-      text="Reset editors"
-    />
-  }
-  description="You have closed all editors. You can open them again with the button below or in the sidebar menu!"
-  icon="applications"
-/>
-`;
diff --git a/tests/renderer/components/editors-non-ideal-state-spec.tsx b/tests/renderer/components/editors-non-ideal-state-spec.tsx
deleted file mode 100644
index f599aa45f4..0000000000
--- a/tests/renderer/components/editors-non-ideal-state-spec.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { mount } from 'enzyme';
-
-import { renderNonIdealState } from '../../../src/renderer/components/editors-non-ideal-state';
-import { EditorMosaic } from '../../../src/renderer/editor-mosaic';
-
-describe('renderNonIdealState()', () => {
-  let editorMosaic: EditorMosaic;
-
-  beforeEach(() => {
-    ({ editorMosaic } = window.app.state);
-  });
-
-  it('renders a non-ideal state', () => {
-    expect(renderNonIdealState({} as EditorMosaic)).toMatchSnapshot();
-  });
-
-  it('handles a click', () => {
-    const resetLayoutSpy = jest.spyOn(editorMosaic, 'resetLayout');
-    const wrapper = mount(renderNonIdealState(editorMosaic));
-    wrapper.find('button').simulate('click');
-    expect(resetLayoutSpy).toHaveBeenCalledTimes(1);
-  });
-});