fix: address remaining PR review feedback

- Add waitFor/act for pre-existing RTL tests that need them for MobX
  observer re-renders
- Remove 103 unnecessary (instance as any) casts; use typed instance
  from renderClassComponentWithInstanceRef. Remaining 17 casts are
  commented (private methods or Readonly<S> bypass).
- Fix no-op tests: bisect command tools, settings unknown page, dialogs
  settings — all now assert meaningful component output.
- Restore dropped coverage: button disabled states, radio ordering,
  file-selected render path, renderItem text verification.
- Remove 8 unnecessary act() wrappers around async methods that don't
  need synchronous state flush, matching rtl-spec/ convention.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: felixrieseberg

rtl-spec/components/commands-address-bar.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { render } from '@testing-library/react';
+import { render, waitFor } from '@testing-library/react';
 import { userEvent } from '@testing-library/user-event';
 import { runInAction } from 'mobx';
 import { beforeEach, describe, expect, it } from 'vitest';
@@ -76,7 +76,9 @@ describe('AddressBar component', () => {
     runInAction(() => {
       store.activeGistAction = action;
     });
-    const btn = getByRole('button');
-    expect(btn).toBeDisabled();
+    await waitFor(() => {
+      const btn = getByRole('button');
+      expect(btn).toBeDisabled();
+    });
   });
 });

rtl-spec/components/commands-publish-button.spec.tsx

@@ -1,4 +1,5 @@
 import { Octokit } from '@octokit/rest';
+import { act, waitFor } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import {
@@ -273,7 +274,7 @@ describe('Action button component', () => {
       // create a button that's primed to update gistId
       state.gistId = gistId;
       ({ instance } = createActionButton());
-      instance.setState({ actionType: GistActionType.update });
+      act(() => instance.setState({ actionType: GistActionType.update }));
 
       mocktokit.gists.get.mockImplementation(() => {
         return {
@@ -316,7 +317,7 @@ describe('Action button component', () => {
 
       // create a button primed to delete gistId
       ({ instance } = createActionButton());
-      instance.setState({ actionType: GistActionType.delete });
+      act(() => instance.setState({ actionType: GistActionType.delete }));
     });
 
     it('attempts to delete an existing Gist', async () => {
@@ -350,10 +351,14 @@ describe('Action button component', () => {
       expect(container.querySelector('fieldset')).not.toBeDisabled();
 
       state.activeGistAction = gistActionState;
-      expect(container.querySelector('fieldset')).toBeDisabled();
+      await waitFor(() => {
+        expect(container.querySelector('fieldset')).toBeDisabled();
+      });
 
       state.activeGistAction = GistActionState.none;
-      expect(container.querySelector('fieldset')).not.toBeDisabled();
+      await waitFor(() => {
+        expect(container.querySelector('fieldset')).not.toBeDisabled();
+      });
     }
 
     it('while publishing', async () => {

tests/renderer/components/commands-spec.tsx

@@ -54,9 +54,11 @@ describe('Commands component', () => {
   it('can show the bisect command tools', () => {
     store.isBisectCommandShowing = true;
     render(<Commands appState={store} />);
-    // BisectHandler is not mocked, so it renders directly
-    // We check for a bisect-related element in the DOM
-    expect(document.querySelector('.commands')).toBeInTheDocument();
+    // BisectHandler is not mocked, so it renders directly.
+    // The mock store has Bisector set, so active bisect buttons appear.
+    expect(
+      screen.getByRole('button', { name: 'Cancel bisect' }),
+    ).toBeInTheDocument();
   });
 
   it('handleDoubleClick()', () => {
@@ -65,6 +67,7 @@ describe('Commands component', () => {
     });
 
     const tag = { tagName: 'DIV' };
+    // handleDoubleClick is private — cast needed to test it directly
     (instance as any).handleDoubleClick({ target: tag, currentTarget: tag });
 
     expect(window.ElectronFiddle.macTitlebarClicked).toHaveBeenCalled();
@@ -75,6 +78,7 @@ describe('Commands component', () => {
       appState: store,
     });
 
+    // handleDoubleClick is private — cast needed to test it directly
     (instance as any).handleDoubleClick({
       target: { tagName: 'INPUT' },
       currentTarget: { tagName: 'DIV' },

tests/renderer/components/dialog-add-theme-spec.tsx

@@ -40,14 +40,37 @@ describe('AddThemeDialog component', () => {
     ({ state: store } = window.app);
   });
 
-  // TODO(dsanders11): Update this test to be accurate
   it('renders', () => {
     store.isThemeDialogShowing = true;
     render(<AddThemeDialog appState={store} />);
 
     expect(screen.getByText('Add theme')).toBeInTheDocument();
     expect(screen.getByText('Add')).toBeInTheDocument();
     expect(screen.getByText('Cancel')).toBeInTheDocument();
+    // Add button should be disabled when no file is selected
+    expect(screen.getByRole('button', { name: 'Add' })).toBeDisabled();
+  });
+
+  it('renders with a file selected', () => {
+    store.isThemeDialogShowing = true;
+    const { instance } = renderClassComponentWithInstanceRef(AddThemeDialog, {
+      appState: store,
+    });
+
+    act(() => {
+      instance.setState({
+        file: new FileMock(
+          ['{}'],
+          'theme.json',
+          '/test/theme.json',
+          'application/json',
+        ),
+      });
+    });
+
+    // File name should be displayed and Add button should be enabled
+    expect(screen.getByText('theme.json')).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Add' })).not.toBeDisabled();
   });
 
   describe('createNewThemeFromMonaco()', () => {
@@ -58,10 +81,7 @@ describe('AddThemeDialog component', () => {
       });
 
       try {
-        await (instance as any).createNewThemeFromMonaco(
-          '',
-          {} as LoadedFiddleTheme,
-        );
+        await instance.createNewThemeFromMonaco('', {} as LoadedFiddleTheme);
       } catch (err: any) {
         expect(err.message).toEqual(`Filename  not found`);
         expect(window.ElectronFiddle.createThemeFile).toHaveBeenCalledTimes(0);
@@ -76,7 +96,7 @@ describe('AddThemeDialog component', () => {
       });
 
       act(() => {
-        (instance as any).setState({
+        instance.setState({
           file: new FileMock(
             [JSON.stringify(defaultLight.editor)],
             'file.json',
@@ -91,10 +111,7 @@ describe('AddThemeDialog component', () => {
         file: themePath,
       } as LoadedFiddleTheme);
 
-      await (instance as any).createNewThemeFromMonaco(
-        'testingLight',
-        defaultLight,
-      );
+      await instance.createNewThemeFromMonaco('testingLight', defaultLight);
 
       expect(window.ElectronFiddle.createThemeFile).toHaveBeenCalledWith(
         expect.objectContaining({
@@ -115,15 +132,13 @@ describe('AddThemeDialog component', () => {
         appState: store,
       });
 
-      (instance as any).createNewThemeFromMonaco = vi.fn();
-      (instance as any).onClose = vi.fn();
+      instance.createNewThemeFromMonaco = vi.fn();
+      instance.onClose = vi.fn();
 
-      await (instance as any).onSubmit();
+      await instance.onSubmit();
 
-      expect((instance as any).createNewThemeFromMonaco).toHaveBeenCalledTimes(
-        0,
-      );
-      expect((instance as any).onClose).toHaveBeenCalledTimes(0);
+      expect(instance.createNewThemeFromMonaco).toHaveBeenCalledTimes(0);
+      expect(instance.onClose).toHaveBeenCalledTimes(0);
     });
 
     it('loads a theme if a file is currently set', async () => {
@@ -140,19 +155,17 @@ describe('AddThemeDialog component', () => {
       );
       const spy = vi.spyOn(file, 'text');
       act(() => {
-        (instance as any).setState({ file });
+        instance.setState({ file });
       });
 
-      (instance as any).createNewThemeFromMonaco = vi.fn();
-      (instance as any).onClose = vi.fn();
+      instance.createNewThemeFromMonaco = vi.fn();
+      instance.onClose = vi.fn();
 
-      await (instance as any).onSubmit();
+      await instance.onSubmit();
 
       expect(spy).toHaveBeenCalledTimes(1);
-      expect((instance as any).createNewThemeFromMonaco).toHaveBeenCalledTimes(
-        1,
-      );
-      expect((instance as any).onClose).toHaveBeenCalledTimes(1);
+      expect(instance.createNewThemeFromMonaco).toHaveBeenCalledTimes(1);
+      expect(instance.onClose).toHaveBeenCalledTimes(1);
     });
 
     it('shows an error dialog for a malformed theme', async () => {
@@ -170,12 +183,12 @@ describe('AddThemeDialog component', () => {
       );
       const spy = vi.spyOn(file, 'text').mockResolvedValue('{}');
       act(() => {
-        (instance as any).setState({ file });
+        instance.setState({ file });
       });
 
-      (instance as any).onClose = vi.fn();
+      instance.onClose = vi.fn();
 
-      await (instance as any).onSubmit();
+      await instance.onSubmit();
 
       expect(spy).toHaveBeenCalledTimes(1);
       expect(store.showErrorDialog).toHaveBeenCalledWith(
@@ -193,11 +206,11 @@ describe('AddThemeDialog component', () => {
 
       const files = ['one', 'two'];
       act(() => {
-        (instance as any).onChangeFile({
+        instance.onChangeFile({
           target: { files } as unknown as EventTarget,
         } as React.FormEvent<HTMLInputElement>);
       });
-      expect((instance as any).state.file).toBe(files[0]);
+      expect(instance.state.file).toBe(files[0]);
     });
 
     it('handles no input', () => {
@@ -206,12 +219,10 @@ describe('AddThemeDialog component', () => {
         appState: store,
       });
 
-      act(() => {
-        (instance as any).onChangeFile({
-          target: { files: null } as unknown as EventTarget,
-        } as React.FormEvent<HTMLInputElement>);
-      });
-      expect((instance as any).state.file).toBeUndefined();
+      instance.onChangeFile({
+        target: { files: null } as unknown as EventTarget,
+      } as React.FormEvent<HTMLInputElement>);
+      expect(instance.state.file).toBeUndefined();
     });
   });
 });

tests/renderer/components/dialog-add-version-spec.tsx

@@ -28,7 +28,7 @@ describe('AddVersionDialog component', () => {
     });
 
     act(() => {
-      (instance as any).setState({
+      instance.setState({
         isValidVersion: true,
         isValidElectron: true,
         folderPath: mockFile,
@@ -40,18 +40,19 @@ describe('AddVersionDialog component', () => {
     expect(screen.getByText('Cancel')).toBeInTheDocument();
 
     act(() => {
-      (instance as any).setState({
+      instance.setState({
         isValidVersion: false,
         isValidElectron: true,
         folderPath: mockFile,
       });
     });
 
-    // Still renders the dialog
+    // Still renders the dialog, but Add button should be disabled
     expect(screen.getByText('Add local Electron build')).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Add' })).toBeDisabled();
 
     act(() => {
-      (instance as any).setState({
+      instance.setState({
         isValidVersion: true,
         isValidElectron: true,
         existingLocalVersion: {
@@ -99,13 +100,11 @@ describe('AddVersionDialog component', () => {
         isValidElectron: true,
         localName: 'Test',
       });
-      await act(async () => {
-        await (instance as any).selectLocalVersion();
-      });
+      await instance.selectLocalVersion();
 
-      expect((instance as any).state.isValidElectron).toBe(true);
-      expect((instance as any).state.folderPath).toBe('/test/');
-      expect((instance as any).state.localName).toBe('Test');
+      expect(instance.state.isValidElectron).toBe(true);
+      expect(instance.state.folderPath).toBe('/test/');
+      expect(instance.state.localName).toBe('Test');
     });
   });
 
@@ -118,12 +117,12 @@ describe('AddVersionDialog component', () => {
       );
 
       act(() => {
-        (instance as any).onChangeVersion({
+        instance.onChangeVersion({
           target: { value: '3.3.3' },
-        });
+        } as any);
       });
-      expect((instance as any).state.isValidVersion).toBe(true);
-      expect((instance as any).state.version).toBe('3.3.3');
+      expect(instance.state.isValidVersion).toBe(true);
+      expect(instance.state.version).toBe('3.3.3');
     });
 
     it('handles invalid input', () => {
@@ -134,16 +133,16 @@ describe('AddVersionDialog component', () => {
       );
 
       act(() => {
-        (instance as any).onChangeVersion({ target: { value: 'foo' } });
+        instance.onChangeVersion({ target: { value: 'foo' } } as any);
       });
-      expect((instance as any).state.isValidVersion).toBe(false);
-      expect((instance as any).state.version).toBe('foo');
+      expect(instance.state.isValidVersion).toBe(false);
+      expect(instance.state.version).toBe('foo');
 
       act(() => {
-        (instance as any).onChangeVersion({ target: {} });
+        instance.onChangeVersion({ target: {} } as any);
       });
-      expect((instance as any).state.isValidVersion).toBe(false);
-      expect((instance as any).state.version).toBe('');
+      expect(instance.state.isValidVersion).toBe(false);
+      expect(instance.state.version).toBe('');
     });
   });
 
@@ -155,9 +154,7 @@ describe('AddVersionDialog component', () => {
         { appState: store },
       );
 
-      await act(async () => {
-        await (instance as any).onSubmit();
-      });
+      await instance.onSubmit();
 
       expect(store.addLocalVersion).toHaveBeenCalledTimes(0);
     });
@@ -170,15 +167,13 @@ describe('AddVersionDialog component', () => {
       );
 
       act(() => {
-        (instance as any).setState({
+        instance.setState({
           version: '3.3.3',
           folderPath: '/test/path',
         });
       });
 
-      await act(async () => {
-        await (instance as any).onSubmit();
-      });
+      await instance.onSubmit();
 
       expect(store.addLocalVersion).toHaveBeenCalledTimes(1);
       expect(store.addLocalVersion).toHaveBeenCalledWith(
@@ -197,7 +192,7 @@ describe('AddVersionDialog component', () => {
       );
 
       act(() => {
-        (instance as any).setState({
+        instance.setState({
           isValidElectron: true,
           folderPath: '/test/path',
           version: '3.3.3',