如何用Jest和React测试库测试某个Emotion js css

rsl1atfo  于 2022-12-08  发布在  Jest
关注(0)|答案(1)|浏览(237)

如何使用Jest和React测试库测试这个css样式color: #FF8800

it('should render styles correctly', async () => {
    const { container } = mount(
      <MyComponent
        theme="my-theme"
      />
    );
    expect(container).toHaveStyleRule('color', '#FF8800');
  });

这样不行吗?
从这张笑话快照中我得到:

exports[`MyComponent should render styles correctly 1`] = `
.emotion-0 {
  font-size: 60px;
  font-weight: 500;
  font-style: italic;
  margin: 0;
  color: #FF8800;
}

<div>
  <div
    class="emotion-0"
  >
    <blockquote>
      <p
        class="emotion-1"
        data-testid="block-quote-paragraph"
      >
        Text
      </p>
    </blockquote>
  </div>
</div>
`;

我怎么才能让它工作?

dxpyg8gm

dxpyg8gm1#

按索引检查元素

const styles = container.get(0).style;
expect(styles).to.have.property('color', '#FF8800');

相关问题