Я пытаюсь написать ферментный тест, чтобы щелкнуть по переключателю, а другой - вручную вызвать функцию, подключенную к этому переключателю. Эта функция обновляет состояние. Я не могу заставить ни один тест на работу.
В Интернете так много разных примеров, что это стало очень запутанным.
Интересно, что до того, как я использовал createShallow в MUI, у wrapper.instance () было состояние, а не обертка.
Компонент
import React, { Component } from 'react';
import scss from './scss.module.scss';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import FormGroup from '@material-ui/core/FormGroup';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import Switch from '@material-ui/core/Switch';
import Drawer from '@material-ui/core/Drawer';
let styles = inlineStyles;
class Layout extends Component {
state = {
edit: false,
};
render () {
const { classes } = this.props;
return (
<div id="LayoutId" className={scss.layout}>
<Drawer>
</Drawer>
<AppBar>
<Toolbar>
<FormGroup row className={classes.EditSwitch}>
<FormControlLabel
control={
<Switch
id={'editSwitchId'}
checked={this.state.edit}
onChange={this.handleChange('edit')}
value="edit"
color="primary"
/>
}
label="Edit"
/>
</FormGroup>
</Toolbar>
</AppBar>
</div>
)
}
Мелкий тест
describe('Invoking "handleChange" method', () => {
let shallow;
beforeAll(() => {
shallow = createShallow({ dive: true });
});
it('renders Landing Page', (done) => {
const wrapper = shallow(<Layout />);
const instance = wrapper.instance();
instance.handleChange('adminEdit',{target:{checked:true}});
wrapper.update();
expect(instance.state.adminEdit).toBe(true);
done();
});
});
Испытание на крепление
describe('indirectly testing "handleChange" through click simulation', () => {
it('should update the edit state', () => {
const wrapper = mount(<Layout />);
wrapper.setState({
edit: true,
});
expect(wrapper.state('edit')).toBe(true);
let AllFoundSwitchIds = wrapper.find('#editSwitchId').hostNodes();
const event = {target: {checked: !wrapper.state().edit}};
AllFoundSwitchIds.props().val = false;
AllFoundSwitchIds.simulate('change', event);
wrapper.update();
expect(wrapper.state('edit')).toBe(false);
});
});