Question

以下是我对按钮组件的测试文件

import React from 'react';
import ds from 'path-to-ds';
import Button from '../Button';

afterEach(cleanup);

/* ------------------------ RENDERING TESTS -------------------------- */
test('render with theme prop', () => {
  const { firstChild } = render(<Button theme={ds}/>).container;
  expect(firstChild).toMatchSnapshot();
});

test('render without theme prop', () => {
  const { firstChild } = render(<Button />).container;
  expect(firstChild).toMatchSnapshot();
});


test('passing a different theme object', () => {
  const { firstChild } = render(<Button theme='' />).container;
  expect(firstChild).toMatchSnapshot();
});

现在，如果我在第一个测试中添加道具，就像这样：

test('render with theme prop', () => {
  const { firstChild } = render(<Button someProp theme={ds}/>).container;
  expect(firstChild).toMatchSnapshot();
});

快照中未检测到没有差异（没有错误）。

我假设jest-emotion随附的序列化程序不会检查属性更改（如果我错了，请纠正我）。有没有一种方法可以序列化输出，以便也可以突出显示道具差异？

用于测试的堆栈：

开玩笑
开玩笑
反应测试库

在玩笑中添加道具时，快照不变

0 个答案: