Question

我正在尝试编写与酶反应的单元测试。您可以在下面看到测试代码。

describe("When list page is opened", () => {
    let wrapper;
    beforeAll(() => {
      wrapper = mount(<PersonList {...data}/>);
    });

    it('should have grey background color', () => {
      console.log(wrapper.find('div.profile-card').props().style);
      expect(wrapper.find('div.profile-card').props().style.backgroundColor).toBe('red');
    });

我已经为HTML元素设置了背景色，并且我正在尝试验证该元素具有正确的颜色。但是样式值是不确定的，我无法到达背景。

错误消息：

TypeError：无法读取未定义的属性'backgroundColor'

我不明白哪里出了问题。当我使用chrome开发人员工具检查元素的backgroundColor时，我看到有一个背景值。

什么可能导致此问题？如果您分享您的评论，我将不胜感激！

提前谢谢！

P.S。：我意识到当我使用内联样式时，它可以工作！所以我很好奇如何在css文件中测试样式！如果无法在css文件中进行测试，也许我应该避免在单独的css文件中定义样式。什么是管理样式的最佳实践是React？

在反应酶单元测试中获取HTML元素样式

0 个答案: