2

我试图找到解决方案如何避免 Jest 快照中的整个主题对象。

例如，我得到了这个简单的测试。

test("render", () => {
  const wrapper = shallow(<Result item={item} />);
  expect(wrapper).toMatchSnapshot();
});

结果.js

const Title = styled.h3`
  background-color: ${({ theme }) => theme.colors['primary']};    
`

Title.defaultProps = {
  theme: defautlTheme,
};


export default ({ item }) => (
 <div>
   <Title>{item.title}</Title>
   <p>{item.info}</p>
 </div>
);

快照看起来像： 

  exports[`render 1`] = `
       <div>
         <Result__Title
           theme={
             Object {
               "colors": Object {
                 "accent-100": "#000000",
                  "accent-200": "#000000",
                  "accent-300": "#000000",
                  "accent-400": "#000000",
                  "accent-500": "#f1c933",
                  "accent-600": "#000000",
                  "accent-700": "#ebbd10",
                  "accent-800": "#000000",
                  "accent-900": "#000000",
                  "black": "#000",
                  ....

有可能以某种方式避免在快照中使用shallow. 因为如果我在主题中更改一些颜色会很烦人，所以在许多其他地方测试会失败。

4

0 回答 0