test: extend testRender to return spy on dispatch

src/about/AboutDialog.test.tsx

@@ -10,7 +10,7 @@ import AboutDialog from './AboutDialog';
 it('should close when the button is clicked', () => {
     const close = jest.fn();
 
-    const dialog = testRender(<AboutDialog isOpen={true} onClose={() => close()} />);
+    const [dialog] = testRender(<AboutDialog isOpen={true} onClose={() => close()} />);
 
     userEvent.click(dialog.getByLabelText('Close'));
 
@@ -18,7 +18,9 @@ it('should close when the button is clicked', () => {
 });
 
 it('should manage license dialog open/close', async () => {
-    const dialog = testRender(<AboutDialog isOpen={true} onClose={() => undefined} />);
+    const [dialog] = testRender(
+        <AboutDialog isOpen={true} onClose={() => undefined} />,
+    );
 
     userEvent.click(dialog.getByText('Software Licenses'));
 

src/editor/Editor.test.tsx

@@ -19,14 +19,14 @@ function getTextArea(editor: RenderResult): HTMLTextAreaElement {
 }
 
 it('should focus the text area', () => {
-    const editor = testRender(<Editor />);
+    const [editor] = testRender(<Editor />);
 
     expect(getTextArea(editor)).toHaveFocus();
 });
 
 describe('context menu', () => {
     it('should show the context menu', async () => {
-        const editor = testRender(<Editor />);
+        const [editor] = testRender(<Editor />);
 
         fireEvent.contextMenu(editor.getByText('Write your program here...'));
 
@@ -36,7 +36,7 @@ describe('context menu', () => {
     });
 
     it('should hide the context menu when Escape is pressed', async () => {
-        const editor = testRender(<Editor />);
+        const [editor] = testRender(<Editor />);
 
         fireEvent.contextMenu(editor.getByText('Write your program here...'));
 

src/explorer/Explorer.test.tsx

@@ -8,7 +8,7 @@ import Explorer from './Explorer';
 
 describe('archive button', () => {
     it('should be enabled if there are files', () => {
-        const explorer = testRender(<Explorer />, {
+        const [explorer] = testRender(<Explorer />, {
             fileStorage: { fileNames: ['test.file'] },
         });
 
@@ -16,7 +16,7 @@ describe('archive button', () => {
     });
 
     it('should be disabled if there are no files', () => {
-        const explorer = testRender(<Explorer />, {
+        const [explorer] = testRender(<Explorer />, {
             fileStorage: { fileNames: [] },
         });
 
@@ -26,7 +26,7 @@ describe('archive button', () => {
 
 describe('list item', () => {
     it('should show/hide buttons on hover', () => {
-        const explorer = testRender(<Explorer />, {
+        const [explorer] = testRender(<Explorer />, {
             fileStorage: { fileNames: ['test.file'] },
         });
 
@@ -45,7 +45,7 @@ describe('list item', () => {
     });
 
     it('should not focus buttons on click', () => {
-        const explorer = testRender(<Explorer />, {
+        const [explorer] = testRender(<Explorer />, {
             fileStorage: { fileNames: ['test.file'] },
         });
 

src/status-bar/StatusBar.test.tsx

@@ -9,7 +9,7 @@ import { BleConnectionState } from '../ble/reducers';
 import StatusBar from './StatusBar';
 
 it('should prevent browser context menu', () => {
-    const statusBar = testRender(<StatusBar />, {
+    const [statusBar] = testRender(<StatusBar />, {
         ble: { connection: BleConnectionState.Disconnected, deviceName: '' },
     });
 
@@ -19,7 +19,7 @@ it('should prevent browser context menu', () => {
 it('should show popover when hub name is clicked', async () => {
     const testHubName = 'Test hub';
 
-    const statusBar = testRender(<StatusBar />, {
+    const [statusBar] = testRender(<StatusBar />, {
         ble: {
             connection: BleConnectionState.Connected,
             deviceName: testHubName,
@@ -38,7 +38,7 @@ it('should show popover when hub name is clicked', async () => {
 it('should show popover when battery is clicked', async () => {
     const testHubName = 'Test hub';
 
-    const statusBar = testRender(<StatusBar />, {
+    const [statusBar] = testRender(<StatusBar />, {
         ble: {
             connection: BleConnectionState.Connected,
             deviceName: testHubName,

test/index.tsx

@@ -132,19 +132,22 @@ export function lookup(obj: unknown, id: string): string | undefined {
  *
  * @param component The component to render.
  * @param state Any state required by the component.
- * @returns The render result.
+ * @returns The render result and a spy on the dispatch method.
  */
 export const testRender = (
     component: ReactElement,
     state?: PreloadedState<RootState>,
-): RenderResult => {
+): [RenderResult, jest.SpyInstance<AnyAction, [action: AnyAction]>] => {
     const store = createStore(rootReducer, state);
+    const dispatch = jest.spyOn(store, 'dispatch');
 
     const i18n = new I18nManager({ locale: 'en' });
 
-    return render(
+    const result = render(
         <Provider store={store}>
             <I18nContext.Provider value={i18n}>{component}</I18nContext.Provider>
         </Provider>,
     );
+
+    return [result, dispatch];
 };