diff --git a/app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/SetupLabwareList.test.tsx b/app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/SetupLabwareList.test.tsx index 32abc2f92eb..34b8412f536 100644 --- a/app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/SetupLabwareList.test.tsx +++ b/app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/SetupLabwareList.test.tsx @@ -1,7 +1,11 @@ import * as React from 'react' import { StaticRouter } from 'react-router-dom' -import _uncastedProtocolWithTC from '@opentrons/shared-data/protocol/fixtures/6/multipleTipracksWithTC.json' -import { renderWithProviders } from '@opentrons/components' +import { describe, it, beforeEach, vi, expect } from 'vitest' +import { screen } from '@testing-library/react' + +import { multiple_tipacks_with_tc } from '@opentrons/shared-data' + +import { renderWithProviders } from '../../../../../__testing-utils__' import { i18n } from '../../../../../i18n' import { mockDefinition } from '../../../../../redux/custom-labware/__fixtures__' import { SetupLabwareList } from '../SetupLabwareList' @@ -11,13 +15,9 @@ import type { RunTimeCommand, } from '@opentrons/shared-data' -jest.mock('../LabwareListItem') - -const protocolWithTC = (_uncastedProtocolWithTC as unknown) as CompletedProtocolAnalysis +vi.mock('../LabwareListItem') -const mockLabwareListItem = LabwareListItem as jest.MockedFunction< - typeof LabwareListItem -> +const protocolWithTC = (multiple_tipacks_with_tc as unknown) as CompletedProtocolAnalysis const render = (props: React.ComponentProps) => { return renderWithProviders( @@ -165,10 +165,12 @@ const mockOffDeckCommands = ([ describe('SetupLabwareList', () => { beforeEach(() => { - mockLabwareListItem.mockReturnValue(
mock labware list item
) + vi.mocked(LabwareListItem).mockReturnValue( +
mock labware list item
+ ) }) it('renders the correct headers and labware list items', () => { - const { getAllByText, getByText } = render({ + render({ commands: protocolWithTC.commands, extraAttentionModules: [], attachedModuleInfo: { @@ -181,13 +183,13 @@ describe('SetupLabwareList', () => { isFlex: false, }) - getAllByText('mock labware list item') - getByText('Labware name') - getByText('Location') - getByText('Placement') + screen.getAllByText('mock labware list item') + screen.getByText('Labware name') + screen.getByText('Location') + screen.getByText('Placement') }) it('renders null for the offdeck labware list when there are none', () => { - const { queryByText } = render({ + render({ commands: protocolWithTC.commands, extraAttentionModules: [], attachedModuleInfo: { @@ -199,17 +201,19 @@ describe('SetupLabwareList', () => { } as any, isFlex: false, }) - expect(queryByText('Additional Off-Deck Labware')).not.toBeInTheDocument() + expect( + screen.queryByText('Additional Off-Deck Labware') + ).not.toBeInTheDocument() }) it('renders offdeck labware list when there are additional offdeck labwares', () => { - const { getAllByText, getByText } = render({ + render({ commands: mockOffDeckCommands, extraAttentionModules: [], attachedModuleInfo: {} as any, isFlex: false, }) - getByText('Additional Off-Deck Labware') - getAllByText('mock labware list item') + screen.getByText('Additional Off-Deck Labware') + screen.getAllByText('mock labware list item') }) }) diff --git a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/CurrentOffsetsTable.test.tsx b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/CurrentOffsetsTable.test.tsx index 0e672f4852c..7eac060cca5 100644 --- a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/CurrentOffsetsTable.test.tsx +++ b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/CurrentOffsetsTable.test.tsx @@ -1,49 +1,42 @@ import * as React from 'react' -import { renderWithProviders } from '@opentrons/components' -import _uncastedProtocolWithTC from '@opentrons/shared-data/protocol/fixtures/6/multipleTipracksWithTC.json' -import { getLoadedLabwareDefinitionsByUri } from '@opentrons/shared-data' +import { describe, it, beforeEach, vi, expect, afterEach } from 'vitest' +import { screen } from '@testing-library/react' + +import { + getLoadedLabwareDefinitionsByUri, + multiple_tipacks_with_tc, +} from '@opentrons/shared-data' + +import { renderWithProviders } from '../../../../../__testing-utils__' import { i18n } from '../../../../../i18n' import { getIsLabwareOffsetCodeSnippetsOn } from '../../../../../redux/config' import { LabwarePositionCheck } from '../../../../LabwarePositionCheck' import { useLPCDisabledReason } from '../../../hooks' -import { CurrentOffsetsTable } from '../CurrentOffsetsTable' import { getLatestCurrentOffsets } from '../utils' +import { CurrentOffsetsTable } from '../CurrentOffsetsTable' + import type { CompletedProtocolAnalysis } from '@opentrons/shared-data' import type { LabwareOffset } from '@opentrons/api-client' -jest.mock('../../../hooks') -jest.mock('../../../../LabwarePositionCheck') -jest.mock('../../../../../redux/config') -jest.mock('../utils') -jest.mock('@opentrons/shared-data', () => { - const actualComponents = jest.requireActual('@opentrons/shared-data') +vi.mock('../../../hooks') +vi.mock('../../../../LabwarePositionCheck') +vi.mock('../../../../../redux/config') +vi.mock('../utils') + +vi.mock('@opentrons/shared-data', async importOriginal => { + const actual = await importOriginal() return { - ...actualComponents, - getLoadedLabwareDefinitionsByUri: jest.fn(), + ...actual, + getLoadedLabwareDefinitionsByUri: vi.fn(), // or whatever you want to override the export with } }) -const mockGetLoadedLabwareDefinitionsByUri = getLoadedLabwareDefinitionsByUri as jest.MockedFunction< - typeof getLoadedLabwareDefinitionsByUri -> -const mockGetIsLabwareOffsetCodeSnippetsOn = getIsLabwareOffsetCodeSnippetsOn as jest.MockedFunction< - typeof getIsLabwareOffsetCodeSnippetsOn -> -const mockGetLatestCurrentOffsets = getLatestCurrentOffsets as jest.MockedFunction< - typeof getLatestCurrentOffsets -> -const mockLabwarePositionCheck = LabwarePositionCheck as jest.MockedFunction< - typeof LabwarePositionCheck -> -const mockUseLPCDisabledReason = useLPCDisabledReason as jest.MockedFunction< - typeof useLPCDisabledReason -> const render = (props: React.ComponentProps) => { return renderWithProviders(, { i18nInstance: i18n, })[0] } -const protocolWithTC = (_uncastedProtocolWithTC as unknown) as CompletedProtocolAnalysis +const protocolWithTC = (multiple_tipacks_with_tc as unknown) as CompletedProtocolAnalysis const mockCurrentOffsets: LabwareOffset[] = [ { createdAt: '2022-12-20T14:06:23.562082+00:00', @@ -95,8 +88,8 @@ describe('CurrentOffsetsTable', () => { }, ], } - mockUseLPCDisabledReason.mockReturnValue(null) - mockGetLoadedLabwareDefinitionsByUri.mockReturnValue({ + vi.mocked(useLPCDisabledReason).mockReturnValue(null) + vi.mocked(getLoadedLabwareDefinitionsByUri).mockReturnValue({ fixedTrash: { displayName: 'Trash', definitionId: 'opentrons/opentrons_1_trash_1100ml_fixed/1', @@ -118,11 +111,11 @@ describe('CurrentOffsetsTable', () => { definitionId: 'opentrons/nest_96_wellplate_100ul_pcr_full_skirt/1', }, } as any) - mockLabwarePositionCheck.mockReturnValue( + vi.mocked(LabwarePositionCheck).mockReturnValue(
mock labware position check
) - mockGetIsLabwareOffsetCodeSnippetsOn.mockReturnValue(false) - mockGetLatestCurrentOffsets.mockReturnValue([ + vi.mocked(getIsLabwareOffsetCodeSnippetsOn).mockReturnValue(false) + vi.mocked(getLatestCurrentOffsets).mockReturnValue([ { createdAt: '2022-12-20T14:06:23.562082+00:00', definitionUri: 'opentrons/opentrons_96_tiprack_10ul/1', @@ -132,25 +125,30 @@ describe('CurrentOffsetsTable', () => { }, ]) }) + + afterEach(() => { + vi.resetAllMocks() + }) + it('renders the correct text', () => { - const { getByText } = render(props) - getByText('APPLIED LABWARE OFFSET DATA') - getByText('location') - getByText('labware') - getByText('labware offset data') + render(props) + screen.getByText('APPLIED LABWARE OFFSET DATA') + screen.getByText('location') + screen.getByText('labware') + screen.getByText('labware offset data') }) it('renders 1 offset with the correct information', () => { - const { getByText } = render(props) - getByText('opentrons/opentrons_96_tiprack_10ul/1') - getByText('Slot 2') + render(props) + screen.getByText('opentrons/opentrons_96_tiprack_10ul/1') + screen.getByText('Slot 2') }) it('renders tabbed offset data with snippets when config option is selected', () => { - mockGetIsLabwareOffsetCodeSnippetsOn.mockReturnValue(true) - const { getByText } = render(props) - expect(getByText('Table View')).toBeTruthy() - expect(getByText('Jupyter Notebook')).toBeTruthy() - expect(getByText('Command Line Interface (SSH)')).toBeTruthy() + vi.mocked(getIsLabwareOffsetCodeSnippetsOn).mockReturnValue(true) + render(props) + expect(screen.getByText('Table View')).toBeTruthy() + expect(screen.getByText('Jupyter Notebook')).toBeTruthy() + expect(screen.getByText('Command Line Interface (SSH)')).toBeTruthy() }) }) diff --git a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/HowLPCWorksModal.test.tsx b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/HowLPCWorksModal.test.tsx index 5306a6ce30a..dce830873e3 100644 --- a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/HowLPCWorksModal.test.tsx +++ b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/HowLPCWorksModal.test.tsx @@ -1,6 +1,8 @@ import * as React from 'react' -import { fireEvent } from '@testing-library/react' -import { renderWithProviders } from '@opentrons/components' +import { fireEvent, screen } from '@testing-library/react' +import { describe, it, vi, beforeEach, expect } from 'vitest' + +import { renderWithProviders } from '../../../../../__testing-utils__' import { i18n } from '../../../../../i18n' import { HowLPCWorksModal } from '../HowLPCWorksModal' @@ -13,47 +15,51 @@ const render = (props: React.ComponentProps) => { describe('HowLPCWorksModal', () => { let props: React.ComponentProps beforeEach(() => { - props = { onCloseClick: jest.fn() } + props = { onCloseClick: vi.fn() } }) it('should render the correct header', () => { - const { getByRole } = render(props) - getByRole('heading', { name: 'How labware offsets work' }) + render(props) + screen.getByRole('heading', { name: 'How labware offsets work' }) }) it('should render the correct body', () => { - const { getByText } = render(props) - getByText( + render(props) + screen.getByText( 'A Labware Offset is a type of positional adjustment that accounts for small, real-world variances in the overall position of the labware on a robot’s deck. Labware Offset data is unique to a specific combination of labware definition, deck slot, and robot.' ) - getByText( + screen.getByText( 'Labware Position Check is intended to correct for minor variances. Opentrons does not recommend using Labware Position Check to compensate for large positional adjustments. Needing to set large labware offsets could indicate a problem with robot calibration.' ) }) it('should render a link to robot cal', () => { - const { getByRole } = render(props) + render(props) expect( - getByRole('link', { - name: 'Learn more about Robot Calibration', - }).getAttribute('href') + screen + .getByRole('link', { + name: 'Learn more about Robot Calibration', + }) + .getAttribute('href') ).toBe( 'https://support.opentrons.com/s/article/How-positional-calibration-works-on-the-OT-2' ) }) it('should render a link to the learn more page', () => { - const { getByRole } = render(props) + render(props) expect( - getByRole('link', { - name: 'Learn more about Labware Offset Data', - }).getAttribute('href') + screen + .getByRole('link', { + name: 'Learn more about Labware Offset Data', + }) + .getAttribute('href') ).toBe( 'https://support.opentrons.com/s/article/How-Labware-Offsets-work-on-the-OT-2' ) }) it('should call onCloseClick when the close button is pressed', () => { - const { getByRole } = render(props) + render(props) expect(props.onCloseClick).not.toHaveBeenCalled() - const closeButton = getByRole('button', { name: 'close' }) + const closeButton = screen.getByRole('button', { name: 'close' }) fireEvent.click(closeButton) expect(props.onCloseClick).toHaveBeenCalled() }) diff --git a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/SetupLabwarePositionCheck.test.tsx b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/SetupLabwarePositionCheck.test.tsx index d805e561250..ca2fbe7b930 100644 --- a/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/SetupLabwarePositionCheck.test.tsx +++ b/app/src/organisms/Devices/ProtocolRun/SetupLabwarePositionCheck/__tests__/SetupLabwarePositionCheck.test.tsx @@ -1,14 +1,17 @@ import * as React from 'react' -import { when, resetAllWhenMocks } from 'jest-when' +import { when } from 'vitest-when' import { StaticRouter } from 'react-router-dom' import { screen, fireEvent } from '@testing-library/react' +import { describe, it, beforeEach, vi, expect, afterEach } from 'vitest' -import { renderWithProviders } from '@opentrons/components' -import { i18n } from '../../../../../i18n' import { useProtocolQuery, useProtocolAnalysisAsDocumentQuery, } from '@opentrons/react-api-client' +import { FLEX_ROBOT_TYPE } from '@opentrons/shared-data' + +import { renderWithProviders } from '../../../../../__testing-utils__' +import { i18n } from '../../../../../i18n' import { useLPCSuccessToast } from '../../../hooks/useLPCSuccessToast' import { getModuleTypesThatRequireExtraAttention } from '../../utils/getModuleTypesThatRequireExtraAttention' import { useLaunchLPC } from '../../../../LabwarePositionCheck/useLaunchLPC' @@ -21,54 +24,19 @@ import { useRobotType, } from '../../../hooks' import { SetupLabwarePositionCheck } from '..' -import { FLEX_ROBOT_TYPE } from '@opentrons/shared-data' import { useNotifyRunQuery } from '../../../../../resources/runs/useNotifyRunQuery' -jest.mock('../../../../LabwarePositionCheck/useLaunchLPC') -jest.mock('../../utils/getModuleTypesThatRequireExtraAttention') -jest.mock('../../../../RunTimeControl/hooks') -jest.mock('../../../../../redux/config') -jest.mock('../../../hooks') -jest.mock('../../../hooks/useLPCSuccessToast') -jest.mock('@opentrons/react-api-client') -jest.mock('../../../../../resources/runs/useNotifyRunQuery') +import type { Mock } from 'vitest' + +vi.mock('../../../../LabwarePositionCheck/useLaunchLPC') +vi.mock('../../utils/getModuleTypesThatRequireExtraAttention') +vi.mock('../../../../RunTimeControl/hooks') +vi.mock('../../../../../redux/config') +vi.mock('../../../hooks') +vi.mock('../../../hooks/useLPCSuccessToast') +vi.mock('@opentrons/react-api-client') +vi.mock('../../../../../resources/runs/useNotifyRunQuery') -const mockGetModuleTypesThatRequireExtraAttention = getModuleTypesThatRequireExtraAttention as jest.MockedFunction< - typeof getModuleTypesThatRequireExtraAttention -> -const mockUseRunHasStarted = useRunHasStarted as jest.MockedFunction< - typeof useRunHasStarted -> -const mockUseUnmatchedModulesForProtocol = useUnmatchedModulesForProtocol as jest.MockedFunction< - typeof useUnmatchedModulesForProtocol -> -const mockUseRunCalibrationStatus = useRunCalibrationStatus as jest.MockedFunction< - typeof useRunCalibrationStatus -> -const mockGetIsLabwareOffsetCodeSnippetsOn = getIsLabwareOffsetCodeSnippetsOn as jest.MockedFunction< - typeof getIsLabwareOffsetCodeSnippetsOn -> -const mockUseLPCSuccessToast = useLPCSuccessToast as jest.MockedFunction< - typeof useLPCSuccessToast -> -const mockUseLPCDisabledReason = useLPCDisabledReason as jest.MockedFunction< - typeof useLPCDisabledReason -> -const mockUseLaunchLPC = useLaunchLPC as jest.MockedFunction< - typeof useLaunchLPC -> -const mockUseRobotType = useRobotType as jest.MockedFunction< - typeof useRobotType -> -const mockUseNotifyRunQuery = useNotifyRunQuery as jest.MockedFunction< - typeof useNotifyRunQuery -> -const mockUseProtocolQuery = useProtocolQuery as jest.MockedFunction< - typeof useProtocolQuery -> -const mockUseProtocolAnalysisAsDocumentQuery = useProtocolAnalysisAsDocumentQuery as jest.MockedFunction< - typeof useProtocolAnalysisAsDocumentQuery -> const DISABLED_REASON = 'MOCK_DISABLED_REASON' const ROBOT_NAME = 'otie' const RUN_ID = '1' @@ -77,7 +45,7 @@ const render = () => { return renderWithProviders( @@ -89,57 +57,57 @@ const render = () => { } describe('SetupLabwarePositionCheck', () => { - let mockLaunchLPC: jest.Mock + let mockLaunchLPC: Mock beforeEach(() => { - mockLaunchLPC = jest.fn() - when(mockGetModuleTypesThatRequireExtraAttention) + mockLaunchLPC = vi.fn() + when(vi.mocked(getModuleTypesThatRequireExtraAttention)) .calledWith(expect.anything()) - .mockReturnValue([]) + .thenReturn([]) - when(mockUseUnmatchedModulesForProtocol) + when(vi.mocked(useUnmatchedModulesForProtocol)) .calledWith(ROBOT_NAME, RUN_ID) - .mockReturnValue({ + .thenReturn({ missingModuleIds: [], remainingAttachedModules: [], }) - when(mockUseLPCSuccessToast) + when(vi.mocked(useLPCSuccessToast)) .calledWith() - .mockReturnValue({ setIsShowingLPCSuccessToast: jest.fn() }) + .thenReturn({ setIsShowingLPCSuccessToast: vi.fn() }) - when(mockUseRunCalibrationStatus) + when(vi.mocked(useRunCalibrationStatus)) .calledWith(ROBOT_NAME, RUN_ID) - .mockReturnValue({ + .thenReturn({ complete: true, }) - when(mockUseRunHasStarted).calledWith(RUN_ID).mockReturnValue(false) - when(mockGetIsLabwareOffsetCodeSnippetsOn).mockReturnValue(false) - when(mockUseLPCDisabledReason).mockReturnValue(null) - when(mockUseRobotType) + when(vi.mocked(useRunHasStarted)).calledWith(RUN_ID).thenReturn(false) + vi.mocked(getIsLabwareOffsetCodeSnippetsOn).mockReturnValue(false) + vi.mocked(useLPCDisabledReason).mockReturnValue(null) + when(vi.mocked(useRobotType)) .calledWith(ROBOT_NAME) - .mockReturnValue(FLEX_ROBOT_TYPE) - when(mockUseLaunchLPC) + .thenReturn(FLEX_ROBOT_TYPE) + when(vi.mocked(useLaunchLPC)) .calledWith(RUN_ID, FLEX_ROBOT_TYPE, 'test protocol') - .mockReturnValue({ + .thenReturn({ launchLPC: mockLaunchLPC, LPCWizard:
mock LPC Wizard
, }) - when(mockUseNotifyRunQuery).mockReturnValue({ + vi.mocked(useNotifyRunQuery).mockReturnValue({ data: { data: { protocolId: 'fakeProtocolId' }, }, } as any) - when(mockUseProtocolQuery).mockReturnValue({ + vi.mocked(useProtocolQuery).mockReturnValue({ data: { data: { metadata: { protocolName: 'test protocol' } } }, } as any) - when(mockUseProtocolAnalysisAsDocumentQuery).mockReturnValue({ + vi.mocked(useProtocolAnalysisAsDocumentQuery).mockReturnValue({ data: null, } as any) }) afterEach(() => { - resetAllWhenMocks() + vi.resetAllMocks() }) it('should render LPC button and clicking should launch modal', () => { @@ -152,8 +120,10 @@ describe('SetupLabwarePositionCheck', () => { expect(mockLaunchLPC).toHaveBeenCalled() }) it('should render a disabled LPC button when disabled LPC reason exists', () => { - when(mockUseRunHasStarted).calledWith(RUN_ID).mockReturnValue(true) - when(mockUseLPCDisabledReason).mockReturnValue(DISABLED_REASON) + when(vi.mocked(useUnmatchedModulesForProtocol)) + .calledWith(RUN_ID) + .thenReturn(true) + vi.mocked(useLPCDisabledReason).mockReturnValue(DISABLED_REASON) render() const button = screen.getByRole('button', { name: 'run labware position check', @@ -164,8 +134,8 @@ describe('SetupLabwarePositionCheck', () => { }) it('should close Labware Offset Success toast when LPC is launched', () => { - const mockSetIsShowingLPCSuccessToast = jest.fn() - when(mockUseLPCSuccessToast).calledWith().mockReturnValue({ + const mockSetIsShowingLPCSuccessToast = vi.fn() + when(vi.mocked(useLPCSuccessToast)).calledWith().thenReturn({ setIsShowingLPCSuccessToast: mockSetIsShowingLPCSuccessToast, }) render() diff --git a/app/src/organisms/Devices/ProtocolRun/SetupLiquids/__tests__/SetupLiquids.test.tsx b/app/src/organisms/Devices/ProtocolRun/SetupLiquids/__tests__/SetupLiquids.test.tsx index 9387d27e2e7..a04edd21e4c 100644 --- a/app/src/organisms/Devices/ProtocolRun/SetupLiquids/__tests__/SetupLiquids.test.tsx +++ b/app/src/organisms/Devices/ProtocolRun/SetupLiquids/__tests__/SetupLiquids.test.tsx @@ -1,19 +1,19 @@ import * as React from 'react' +import { describe, it, beforeEach, vi } from 'vitest' +import { screen } from '@testing-library/react' + +import { renderWithProviders } from '../../../../../__testing-utils__' import { i18n } from '../../../../../i18n' -import { renderWithProviders } from '@opentrons/components' import { SetupLiquids } from '../index' import { SetupLiquidsList } from '../SetupLiquidsList' import { SetupLiquidsMap } from '../SetupLiquidsMap' import { BackToTopButton } from '../../BackToTopButton' import { fireEvent } from '@testing-library/react' -jest.mock('../SetupLiquidsList') -jest.mock('../SetupLiquidsMap') -jest.mock('../../BackToTopButton') +vi.mock('../SetupLiquidsList') +vi.mock('../SetupLiquidsMap') +vi.mock('../../BackToTopButton') -const mockSetupLiquidsList = SetupLiquidsList as jest.MockedFunction< - typeof SetupLiquidsList -> const mockSetupLiquidsMap = SetupLiquidsMap as jest.MockedFunction< typeof SetupLiquidsMap > @@ -38,27 +38,29 @@ const render = (props: React.ComponentProps) => { describe('SetupLiquids', () => { let props: React.ComponentProps beforeEach(() => { - mockSetupLiquidsList.mockReturnValue(
Mock setup liquids list
) + vi.mocked(SetupLiquidsList).mockReturnValue( +
Mock setup liquids list
+ ) mockSetupLiquidsMap.mockReturnValue(
Mock setup liquids map
) mockBackToTopButton.mockReturnValue() }) it('renders the list and map view buttons and proceed button', () => { - const [{ getByRole }] = render(props) - getByRole('button', { name: 'List View' }) - getByRole('button', { name: 'Map View' }) - getByRole('button', { name: 'Mock BackToTopButton' }) + render(props) + screen.getByRole('button', { name: 'List View' }) + screen.getByRole('button', { name: 'Map View' }) + screen.getByRole('button', { name: 'Mock BackToTopButton' }) }) it('renders the map view when you press that toggle button', () => { - const [{ getByRole, getByText }] = render(props) - const mapViewButton = getByRole('button', { name: 'Map View' }) + render(props) + const mapViewButton = screen.getByRole('button', { name: 'Map View' }) fireEvent.click(mapViewButton) - getByText('Mock setup liquids map') + screen.getByText('Mock setup liquids map') }) it('renders the list view when you press that toggle button', () => { - const [{ getByRole, getByText }] = render(props) - const mapViewButton = getByRole('button', { name: 'List View' }) + render(props) + const mapViewButton = screen.getByRole('button', { name: 'List View' }) fireEvent.click(mapViewButton) - getByText('Mock setup liquids list') + screen.getByText('Mock setup liquids list') }) })