From 6e1e07952891cd3afb0782e6bbf160eb440fe68e Mon Sep 17 00:00:00 2001 From: Erik Moura Date: Sun, 6 Aug 2023 16:04:22 -0300 Subject: [PATCH] test: use RTL in the version selector tests --- .../commands-version-chooser.spec.tsx | 35 +++++++ .../components/version-select.spec.tsx | 97 +++++++------------ rtl-spec/test-utils/versions.ts | 44 +++++++++ src/renderer/components/version-select.tsx | 1 + .../commands-version-chooser-spec.tsx.snap | 45 --------- .../version-select-spec.tsx.snap | 86 ---------------- .../commands-version-chooser-spec.tsx | 62 ------------ 7 files changed, 117 insertions(+), 253 deletions(-) create mode 100644 rtl-spec/components/commands-version-chooser.spec.tsx rename tests/renderer/components/version-select-spec.tsx => rtl-spec/components/version-select.spec.tsx (72%) create mode 100644 rtl-spec/test-utils/versions.ts delete mode 100644 tests/renderer/components/__snapshots__/commands-version-chooser-spec.tsx.snap delete mode 100644 tests/renderer/components/__snapshots__/version-select-spec.tsx.snap delete mode 100644 tests/renderer/components/commands-version-chooser-spec.tsx diff --git a/rtl-spec/components/commands-version-chooser.spec.tsx b/rtl-spec/components/commands-version-chooser.spec.tsx new file mode 100644 index 0000000000..510e53c1f5 --- /dev/null +++ b/rtl-spec/components/commands-version-chooser.spec.tsx @@ -0,0 +1,35 @@ +import * as React from 'react'; + +import { render, screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; + +import { VersionChooser } from '../../src/renderer/components/commands-version-chooser'; +import { AppState } from '../../src/renderer/state'; +import { mockVersion1, prepareAppState } from '../test-utils/versions'; + +describe('VersionSelect component', () => { + let appState: AppState; + + beforeEach(() => { + appState = prepareAppState(); + + // the version selector is disabled when bisecting + appState.Bisector = undefined; + }); + + it('selects a new version', async () => { + const { getByRole } = render(); + + const btnOpenVersionSelector = getByRole('button'); + + await userEvent.click(btnOpenVersionSelector); + + const versionButton = screen.getByText(mockVersion1.version); + + await userEvent.click(versionButton); + + expect(versionButton).not.toBeDisabled(); + + expect(appState.setVersion).toHaveBeenCalledWith(mockVersion1.version); + }); +}); diff --git a/tests/renderer/components/version-select-spec.tsx b/rtl-spec/components/version-select.spec.tsx similarity index 72% rename from tests/renderer/components/version-select-spec.tsx rename to rtl-spec/components/version-select.spec.tsx index cb91961d14..ecc2cc3f0f 100644 --- a/tests/renderer/components/version-select-spec.tsx +++ b/rtl-spec/components/version-select.spec.tsx @@ -1,85 +1,43 @@ import * as React from 'react'; -import { shallow } from 'enzyme'; +import { render } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; import { mocked } from 'jest-mock'; import { - ElectronReleaseChannel, InstallState, RunnableVersion, VersionSource, -} from '../../../src/interfaces'; +} from '../../src/interfaces'; import { VersionSelect, filterItems, getItemIcon, getItemLabel, renderItem, -} from '../../../src/renderer/components/version-select'; -import { AppState } from '../../../src/renderer/state'; -import { disableDownload } from '../../../src/renderer/utils/disable-download'; -import { StateMock, VersionsMock } from '../../mocks/mocks'; +} from '../../src/renderer/components/version-select'; +import { disableDownload } from '../../src/renderer/utils/disable-download'; +import { mockVersion1, prepareAppState } from '../test-utils/versions'; const { downloading, installed, missing, installing } = InstallState; -const { remote, local } = VersionSource; +const { local } = VersionSource; -jest.mock('../../../src/renderer/utils/disable-download.ts'); +jest.mock('../../src/renderer/utils/disable-download.ts'); describe('VersionSelect component', () => { - let store: AppState; - - const mockVersion1 = { - source: remote, - state: missing, - version: '1.0.0', - }; - - const mockVersion2 = { - source: remote, - state: missing, - version: '3.0.0-unsupported', - }; - - beforeEach(() => { - ({ state: store } = window.app); - - const { mockVersions } = new VersionsMock(); - (store as unknown as StateMock).initVersions('2.0.2', { - ...mockVersions, - '1.0.0': { ...mockVersion1 }, - '3.0.0-unsupported': { ...mockVersion2 }, - }); - store.channelsToShow = [ - ElectronReleaseChannel.stable, - ElectronReleaseChannel.beta, - ]; - }); - - const onVersionSelect = () => ({}); + function renderVersionSelect() { + const appState = prepareAppState(); - it('renders', () => { - const wrapper = shallow( + return render( , ); - expect(wrapper).toMatchSnapshot(); - }); + } describe('renderItem()', () => { - it('renders an item', () => { - const item = renderItem(mockVersion1, { - handleClick: () => ({}), - index: 0, - modifiers: { active: true, disabled: false, matchesPredicate: true }, - query: '', - }); - - expect(item).toMatchSnapshot(); - }); - it('returns null if it does not match predicate', () => { const item = renderItem(mockVersion1, { handleClick: () => ({}), @@ -103,9 +61,9 @@ describe('VersionSelect component', () => { query: '', })!; - const ItemWrapper = shallow(item); + const { getAllByTestId } = render(item); - expect(ItemWrapper.find('.disabled-menu-tooltip')).toHaveLength(1); + expect(getAllByTestId('disabled-menu-item')).toHaveLength(1); }); it('does not disable enabled download buttons when return value is false', () => { @@ -118,9 +76,9 @@ describe('VersionSelect component', () => { query: '', })!; - const ItemWrapper = shallow(item); + const { queryAllByTestId } = render(item); - expect(ItemWrapper.exists('.disabled-menu-tooltip')).toBe(false); + expect(queryAllByTestId('disabled-menu-item')).toHaveLength(0); }); }); @@ -222,4 +180,23 @@ describe('VersionSelect component', () => { expect(filterItems('nightly', versions)).toEqual(expected); }); }); + + describe('renderVersionContextMenu()', () => { + it('copies the current version number to the clipboard', async () => { + const spy = jest + .spyOn(navigator.clipboard, 'writeText') + .mockImplementationOnce(jest.fn()); + + const { getByRole, getByText } = renderVersionSelect(); + + await userEvent.pointer({ + keys: '[MouseRight]', + target: getByRole('button'), + }); + + await userEvent.click(getByText(/copy version number/i)); + + expect(spy).toHaveBeenCalledWith(mockVersion1.version); + }); + }); }); diff --git a/rtl-spec/test-utils/versions.ts b/rtl-spec/test-utils/versions.ts new file mode 100644 index 0000000000..2e79b8cf4b --- /dev/null +++ b/rtl-spec/test-utils/versions.ts @@ -0,0 +1,44 @@ +import { + ElectronReleaseChannel, + InstallState, + VersionSource, +} from '../../src/interfaces'; +import { VersionsMock } from '../../tests/mocks/electron-versions'; +import { StateMock } from '../../tests/mocks/state'; + +const { missing } = InstallState; +const { remote } = VersionSource; + +export const mockVersion1 = { + source: remote, + state: missing, + version: '1.0.0', +}; + +export const mockVersion2 = { + source: remote, + state: missing, + version: '3.0.0-unsupported', +}; + +/** + * Initializes the app state with our mock versions. + */ +export function prepareAppState() { + const { state: appState } = window.app; + + const { mockVersions } = new VersionsMock(); + + (appState as unknown as StateMock).initVersions('2.0.2', { + ...mockVersions, + '1.0.0': { ...mockVersion1 }, + '3.0.0-unsupported': { ...mockVersion2 }, + }); + + appState.channelsToShow = [ + ElectronReleaseChannel.stable, + ElectronReleaseChannel.beta, + ]; + + return appState; +} diff --git a/src/renderer/components/version-select.tsx b/src/renderer/components/version-select.tsx index dc16751add..da6be718bf 100644 --- a/src/renderer/components/version-select.tsx +++ b/src/renderer/components/version-select.tsx @@ -199,6 +199,7 @@ export const renderItem: ItemRenderer = ( > - - -`; diff --git a/tests/renderer/components/__snapshots__/version-select-spec.tsx.snap b/tests/renderer/components/__snapshots__/version-select-spec.tsx.snap deleted file mode 100644 index b3c9cba315..0000000000 --- a/tests/renderer/components/__snapshots__/version-select-spec.tsx.snap +++ /dev/null @@ -1,86 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`VersionSelect component renderItem() renders an item 1`] = ` - -`; - -exports[`VersionSelect component renders 1`] = ` - - } - onItemSelect={[Function]} -> - - -`; diff --git a/tests/renderer/components/commands-version-chooser-spec.tsx b/tests/renderer/components/commands-version-chooser-spec.tsx deleted file mode 100644 index a3f3555f1a..0000000000 --- a/tests/renderer/components/commands-version-chooser-spec.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import * as React from 'react'; - -import { mount, shallow } from 'enzyme'; - -import { - ElectronReleaseChannel, - InstallState, - VersionSource, -} from '../../../src/interfaces'; -import { VersionChooser } from '../../../src/renderer/components/commands-version-chooser'; -import { AppState } from '../../../src/renderer/state'; -import { StateMock, VersionsMock } from '../../mocks/mocks'; - -const { missing } = InstallState; -const { remote } = VersionSource; - -describe('VersionSelect component', () => { - let store: AppState; - - const mockVersion1 = { - source: remote, - state: missing, - version: '1.0.0', - }; - - const mockVersion2 = { - source: remote, - state: missing, - version: '3.0.0-unsupported', - }; - - beforeEach(() => { - ({ state: store } = window.app); - - const { mockVersions } = new VersionsMock(); - (store as unknown as StateMock).initVersions('2.0.2', { - ...mockVersions, - '1.0.0': { ...mockVersion1 }, - '3.0.0-unsupported': { ...mockVersion2 }, - }); - - store.channelsToShow = [ - ElectronReleaseChannel.stable, - ElectronReleaseChannel.beta, - ]; - }); - - it('renders', () => { - const wrapper = shallow(); - expect(wrapper).toMatchSnapshot(); - }); - - it('selects a new version', () => { - const wrapper = mount(); - - const onVersionSelect: any = wrapper - .find('VersionSelect') - .prop('onVersionSelect'); - onVersionSelect(mockVersion1); - expect(store.setVersion).toHaveBeenCalledWith(mockVersion1.version); - }); -});