we have LogsList.js component
import React from 'react'
export default class LogsList extends React.Component {
constructor(props) {
super(props);
this.state = {
sortDate: -1,
};
this.reset = this.reset.bind(this);
}
reset() {
this.setState({sortDate: null});
};
render() {
return (
<div>
<Button onClick={() => this.reset()}>
Clear
</Button>
}
}
in LogsList.spec.js
import React from 'react';
import {mount} from 'enzyme';
import {expect} from 'chai';
import LogsList from '../src/components/page_components/logs/LogsList';
import {Router} from "react-router";
import {createBrowserHistory} from "history";
const history = createBrowserHistory();
//
const wrapper = mount(
<Router history={history}>
<LogsList/>
</Router>
);
describe('<LogsList/>', function () {
it('Click on button "button". state.sortDate should be changed ', function () {
// to get state from component with instance help
const componentInstance = wrapper
.childAt(0) // could also be .find(Foo)
.instance();
console.log('componentInstance before click', componentInstance.state);
// do testing with componentInstance.state.something or componentInstance.props.something
wrapper.find('button').simulate('click');
console.log('componentInstance after click', componentInstance.state);
//
expect(componentInstance.state.sortDate).to.equal(null);
});
});