在将@ test -library/jest-dom版本从4.0.0更新到4.2.0时，react测试用例失败了

Question

在将@testing/jest版本从4.0.0升级到4.2.0时，用于使用toHaveStyles检查样式的测试用例失败了。使用react的测试.测试.库：

test('renders component', () => {
const { getByTestId } = render(<Temp labels={labels} justify="end" />);
expect(getByTestId('temp')).toHaveStyle('justifyContent: end');

})；

上面的测试失败了，并引发了如下错误：

 ● Temp › renders component

expect(element).toHaveStyle()

- Expected

- justifyContent: end;
+ 

  24 |   test('renders component', () => {
  25 |     const { getByTestId } = render(<Temp labels={labels} justify="end" />);
> 26 |     expect(getByTestId('temp')).toHaveStyle('justifyContent: end');
     |                                   ^
  27 |   });
  28 | });
  29 | 

  at Object.toHaveStyle (src/components/Temp/tests/Temp.test.js:26:35)

有人知道这个问题的解决办法吗？

Answer 1

toHaveStyle使用呈现的样式，因此您的测试需要：

expect(getByTestId('temp')).toHaveStyle('justify-content: end')