以下我在React中编写的代码已在测试用例中进行了介绍,但是当我进行代码覆盖时,这两个设置状态没有被覆盖。我尝试了不同的方法,从酶库中更新状态变化,并且还在模拟响应中的硬编码值,以使其满足当前输出。
let arr = this.state.chats;
console.log(arr);
arr.splice(-1, 1);
this.setState(
{
chats: arr,
},
() => {
this.setState({
// hide: false,
chats: this.state.chats.concat([
{
timestamp: time.toLocaleString(
'en-US',
{ hour: 'numeric', minute: 'numeric', hour12: true },
),
username: 'Alice Chen', //bot usernmae
content: content,
buttons: content1 || [],
img: botavatar,
},
]),
});
},
);
我的测试用例:
//expect change state on message array
it('should change state of chats array with response messages', () => {
const wrapper = mount(<Chatroom />);
const chats = [];
const newchatsArrayAfterResponse = [
{
timestamp: '1530103502304',
username: 'Alice Chen', //bot usernmae
content: 'Hi',
buttons: ['hi'],
img: 'Dummy Image',
},
];
expect(wrapper.find('.chats div li').length).toEqual(0);
wrapper.setState({ chats: newchatsArrayAfterResponse });
expect(wrapper.find('.chats div li').length).toEqual(1);
});
//expect change state of loader after response has come
it('expect change state of loader after response has come', () => {
const wrapper = mount(<Chatroom />);
const chats = [];
const arr = [
{
content: 'change service level',
timestamp: '6:38 PM', //bot usernmae
username: 'Kevin Hsu',
},
];
console.log(wrapper.find('.loader-image').length);
expect(wrapper.find('.loader-image').length).toEqual(1);
wrapper.setState({ chats: arr });
console.log(wrapper.find('.loader-image').length);
expect(wrapper.find('.loader-image').length).toEqual(0);
});