嗨,我对 Enzyme 有疑问,如何在父组件上进行测试,其中子组件仅在 status = 'visible' 时才会显示。
这是带有子组件的父组件:
function TableInfo(): ReactElement {
const [status, setStatus] = useState('')
const [data, setData] = useState()
return (
<div className="d-flex justify-content-end mx-5 my-3">
<h1>All Users</h1>
{status !== 'None' ? (
'No Data!') : (
<Table data-testid="table-info" data={data}></Table>
)}
</div>
)
}
并且在 TableInfo 的测试中:
import React from 'react'
import { render, screen, act } from '@testing-library/react'
import { findByTestDataId } from '../../../../../testUtil/getById'
import { shallow } from 'enzyme';
const setup = (props = {}) => {
return shallow(<TableInfo {...props} />)
describe('table information', () => {
it('render table', () => {
const wrapper = setup({status: 'test'})
const component = findByTestDataId(wrapper, 'table-info')
expect(component.length).toBe(1)
})
}
})