Skip to content

Commit

Permalink
update the rest tests for vitest migration
Browse files Browse the repository at this point in the history
  • Loading branch information
@koji
koji committed Feb 29, 2024
1 parent 60d03ef commit c479d4a
Show file tree
Hide file tree
Showing 7 changed files with 203 additions and 234 deletions.
132 changes: 65 additions & 67 deletions app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/LabwareListItem.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,12 @@
import * as React from 'react'
import { fireEvent } from '@testing-library/react'
import { useCreateLiveCommandMutation } from '@opentrons/react-api-client'
import { fireEvent, screen } from '@testing-library/react'
import { describe, it, beforeEach, vi, expect } from 'vitest'
import { StaticRouter } from 'react-router-dom'
import { renderWithProviders } from '@opentrons/components'
import fixture_adapter from '@opentrons/shared-data/labware/definitions/2/opentrons_96_pcr_adapter/1.json'

import { opentrons96PcrAdapterV1 } from '@opentrons/shared-data'
import { useCreateLiveCommandMutation } from '@opentrons/react-api-client'

import { renderWithProviders } from '../../../../../__testing-utils__'
import { i18n } from '../../../../../i18n'
import {
mockHeaterShaker,
Expand All @@ -24,17 +27,10 @@ import type {
import type { AttachedModule } from '../../../../../redux/modules/types'
import type { ModuleRenderInfoForProtocol } from '../../../hooks'

jest.mock('../SecureLabwareModal')
jest.mock('@opentrons/react-api-client')

const mockSecureLabwareModal = SecureLabwareModal as jest.MockedFunction<
typeof SecureLabwareModal
>
const mockUseLiveCommandMutation = useCreateLiveCommandMutation as jest.MockedFunction<
typeof useCreateLiveCommandMutation
>
vi.mock('../SecureLabwareModal')
vi.mock('@opentrons/react-api-client')

const mockAdapterDef = fixture_adapter as LabwareDefinition2
const mockAdapterDef = opentrons96PcrAdapterV1 as LabwareDefinition2
const mockAdapterId = 'mockAdapterId'
const mockNestedLabwareDisplayName = 'nested labware display name'
const mockLocationInfo = {
Expand Down Expand Up @@ -82,17 +78,19 @@ const render = (props: React.ComponentProps<typeof LabwareListItem>) => {
}

describe('LabwareListItem', () => {
const mockCreateLiveCommand = jest.fn()
const mockCreateLiveCommand = vi.fn()
beforeEach(() => {
mockCreateLiveCommand.mockResolvedValue(null)
mockSecureLabwareModal.mockReturnValue(<div>mock secure labware modal</div>)
mockUseLiveCommandMutation.mockReturnValue({
vi.mocked(SecureLabwareModal).mockReturnValue(
<div>mock secure labware modal</div>
)
vi.mocked(useCreateLiveCommandMutation).mockReturnValue({
createLiveCommand: mockCreateLiveCommand,
} as any)
})

it('renders the correct info for a thermocycler (OT2), clicking on secure labware instructions opens the modal', () => {
const { getByText } = render({
render({
commands: [],
nickName: mockNickName,
definition: mockLabwareDef,
Expand All @@ -111,18 +109,18 @@ describe('LabwareListItem', () => {
isFlex: false,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByText('nickName')
getByText('Thermocycler Module GEN1')
getByText('7,8,10,11')
const button = getByText('Secure labware instructions')
screen.getByText('Mock Labware Definition')
screen.getByText('nickName')
screen.getByText('Thermocycler Module GEN1')
screen.getByText('7,8,10,11')
const button = screen.getByText('Secure labware instructions')
fireEvent.click(button)
getByText('mock secure labware modal')
getByText('nickName')
screen.getByText('mock secure labware modal')
screen.getByText('nickName')
})

it('renders the correct info for a thermocycler (OT3)', () => {
const { getByText } = render({
render({
commands: [],
nickName: mockNickName,
definition: mockLabwareDef,
Expand All @@ -141,13 +139,13 @@ describe('LabwareListItem', () => {
isFlex: true,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByText('A1+B1')
getByText('Thermocycler Module GEN1')
screen.getByText('Mock Labware Definition')
screen.getByText('A1+B1')
screen.getByText('Thermocycler Module GEN1')
})

it('renders the correct info for a labware on top of a magnetic module', () => {
const { getByText, getByTestId } = render({
render({
commands: [],
nickName: mockNickName,
definition: mockLabwareDef,
Expand All @@ -172,17 +170,17 @@ describe('LabwareListItem', () => {
isFlex: false,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByTestId('slot_info_7')
getByText('Magnetic Module GEN1')
const button = getByText('Secure labware instructions')
screen.getByText('Mock Labware Definition')
screen.getByTestId('slot_info_7')
screen.getByText('Magnetic Module GEN1')
const button = screen.getByText('Secure labware instructions')
fireEvent.click(button)
getByText('mock secure labware modal')
getByText('nickName')
screen.getByText('mock secure labware modal')
screen.getByText('nickName')
})

it('renders the correct info for a labware on top of a temperature module', () => {
const { getByText, getByTestId } = render({
render({
commands: [],
nickName: mockNickName,
definition: mockLabwareDef,
Expand All @@ -206,10 +204,10 @@ describe('LabwareListItem', () => {
isFlex: false,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByTestId('slot_info_7')
getByText('Temperature Module GEN1')
getByText('nickName')
screen.getByText('Mock Labware Definition')
screen.getByTestId('slot_info_7')
screen.getByText('Temperature Module GEN1')
screen.getByText('nickName')
})

it('renders the correct info for a labware on an adapter on top of a temperature module', () => {
Expand Down Expand Up @@ -240,7 +238,7 @@ describe('LabwareListItem', () => {
},
} as any

const { getByText, getAllByText } = render({
render({
commands: [mockAdapterLoadCommand, mockModuleLoadCommand],
nickName: mockNickName,
definition: mockLabwareDef,
Expand Down Expand Up @@ -269,12 +267,12 @@ describe('LabwareListItem', () => {
nestedLabwareDefinition: mockLabwareDef,
},
})
getByText('Mock Labware Definition')
getAllByText('7')
getByText('Temperature Module GEN2')
getByText('mock nested display name')
getByText('nestedLabwareNickName')
getByText('nickName')
screen.getByText('Mock Labware Definition')
screen.getAllByText('7')
screen.getByText('Temperature Module GEN2')
screen.getByText('mock nested display name')
screen.getByText('nestedLabwareNickName')
screen.getByText('nickName')
})

it('renders the correct info for a labware on an adapter on the deck', () => {
Expand All @@ -294,7 +292,7 @@ describe('LabwareListItem', () => {
},
} as any

const { getByText } = render({
render({
commands: [mockAdapterLoadCommand],
nickName: mockNickName,
definition: mockLabwareDef,
Expand All @@ -311,16 +309,16 @@ describe('LabwareListItem', () => {
nestedLabwareDefinition: mockLabwareDef,
},
})
getByText('Mock Labware Definition')
getByText('A2')
getByText('mock nested display name')
getByText('nestedLabwareNickName')
getByText('nickName')
getByText('On deck')
screen.getByText('Mock Labware Definition')
screen.getByText('A2')
screen.getByText('mock nested display name')
screen.getByText('nestedLabwareNickName')
screen.getByText('nickName')
screen.getByText('On deck')
})

it('renders the correct info for a labware on top of a heater shaker', () => {
const { getByText, getByLabelText, getByTestId } = render({
render({
nickName: mockNickName,
commands: [],
definition: mockLabwareDef,
Expand All @@ -344,14 +342,14 @@ describe('LabwareListItem', () => {
isFlex: false,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByTestId('slot_info_7')
getByText('Heater-Shaker Module GEN1')
getByText('nickName')
getByText('To add labware, use the toggle to control the latch')
getByText('Labware Latch')
getByText('Secure')
const button = getByLabelText('heater_shaker_7_latch_toggle')
screen.getByText('Mock Labware Definition')
screen.getByTestId('slot_info_7')
screen.getByText('Heater-Shaker Module GEN1')
screen.getByText('nickName')
screen.getByText('To add labware, use the toggle to control the latch')
screen.getByText('Labware Latch')
screen.getByText('Secure')
const button = screen.getByLabelText('heater_shaker_7_latch_toggle')
fireEvent.click(button)
expect(mockCreateLiveCommand).toHaveBeenCalledWith({
command: {
Expand All @@ -364,7 +362,7 @@ describe('LabwareListItem', () => {
})

it('renders the correct info for an off deck labware', () => {
const { getByText } = render({
render({
nickName: null,
definition: mockLabwareDef,
initialLocation: 'offDeck',
Expand All @@ -376,7 +374,7 @@ describe('LabwareListItem', () => {
isFlex: false,
nestedLabwareInfo: null,
})
getByText('Mock Labware Definition')
getByText('Off deck')
screen.getByText('Mock Labware Definition')
screen.getByText('Off deck')
})
})
21 changes: 11 additions & 10 deletions app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/OffDeckLabwareList.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
import * as React from 'react'
import { StaticRouter } from 'react-router-dom'
import { renderWithProviders } from '@opentrons/components'
import { screen } from '@testing-library/react'
import { describe, it, beforeEach, vi, expect } from 'vitest'

import { renderWithProviders } from '../../../../../__testing-utils__'
import { i18n } from '../../../../../i18n'
import { mockLabwareDef } from '../../../../LabwarePositionCheck/__fixtures__/mockLabwareDef'
import { LabwareListItem } from '../LabwareListItem'
import { OffDeckLabwareList } from '../OffDeckLabwareList'

jest.mock('../LabwareListItem')

const mockLabwareListItem = LabwareListItem as jest.MockedFunction<
typeof LabwareListItem
>
vi.mock('../LabwareListItem')

const render = (props: React.ComponentProps<typeof OffDeckLabwareList>) => {
return renderWithProviders(
Expand All @@ -25,7 +24,9 @@ const render = (props: React.ComponentProps<typeof OffDeckLabwareList>) => {

describe('OffDeckLabwareList', () => {
beforeEach(() => {
mockLabwareListItem.mockReturnValue(<div>mock labware list item</div>)
vi.mocked(LabwareListItem).mockReturnValue(
<div>mock labware list item</div>
)
})
it('renders null if labware items is null', () => {
const { container } = render({
Expand All @@ -36,7 +37,7 @@ describe('OffDeckLabwareList', () => {
expect(container.firstChild).toBeNull()
})
it('renders additional offdeck labware info if there is an offdeck labware', () => {
const { getByText } = render({
render({
labwareItems: [
{
nickName: 'nickName',
Expand All @@ -49,7 +50,7 @@ describe('OffDeckLabwareList', () => {
isFlex: false,
commands: [],
})
getByText('Additional Off-Deck Labware')
getByText('mock labware list item')
screen.getByText('Additional Off-Deck Labware')
screen.getByText('mock labware list item')
})
})
33 changes: 19 additions & 14 deletions app/src/organisms/Devices/ProtocolRun/SetupLabware/__tests__/SecureLabwareModal.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -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, beforeEach, vi, expect } from 'vitest'

import { renderWithProviders } from '../../../../../__testing-utils__'
import { i18n } from '../../../../../i18n'
import { SecureLabwareModal } from '../SecureLabwareModal'

Expand All @@ -15,15 +17,16 @@ const mockTypeTC = 'thermocyclerModuleType'
describe('SecureLabwareModal', () => {
let props: React.ComponentProps<typeof SecureLabwareModal>
beforeEach(() => {
props = { type: mockTypeMagDeck, onCloseClick: jest.fn() }
props = { type: mockTypeMagDeck, onCloseClick: vi.fn() }
})

it('should render the correct modal for magnetic module type', () => {
const { getByText } = render(props)
getByText('Securing labware to the Magnetic Module')
getByText(
render(props)
screen.getByText('Securing labware to the Magnetic Module')
screen.getByText(
'Opentrons recommends ensuring your labware locks to the Magnetic Module by adjusting the black plate bracket on top of the module.'
)
getByText(
screen.getByText(
'Please note there are two sizes of plate brackets supplied with your module: standard and deep well. These brackets can be removed and swapped by unscrewing the modules thumb screw (the silver knob on the front).'
)
})
Expand All @@ -34,19 +37,21 @@ describe('SecureLabwareModal', () => {
fireEvent.click(closeButton)
expect(props.onCloseClick).toHaveBeenCalled()
})

it('should render the correct modal for thermocycler module type', () => {
props = { type: mockTypeTC, onCloseClick: jest.fn() }
const { getByText } = render(props)
getByText('Securing labware to the Thermocycler')
getByText(
props = { type: mockTypeTC, onCloseClick: vi.fn() }
render(props)
screen.getByText('Securing labware to the Thermocycler')
screen.getByText(
'Opentrons recommends securing your labware to the Thermocycler module by closing its latch. Doing so ensures level and accurate plate placement for optimal results.'
)
})

it('should render tc module type modal and call onCloseClick when button is pressed', () => {
props = { type: mockTypeTC, onCloseClick: jest.fn() }
const { getByRole } = render(props)
props = { type: mockTypeTC, onCloseClick: vi.fn() }
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()
})
Expand Down
Loading

0 comments on commit c479d4a

Please sign in to comment.