快照测试带Jest的ChartJS组件

Question

我正在为使用ChartJS v2的反应组件编写一些快速测试快照测试。我的Customer组件测试看起来像这样

import React from 'react'; 
import renderer from 'react-test-renderer'; 

import CustomerComponent from '../src/components/customer/Customer'; 

describe('Customer',() => { 
    it('renders customer',() => { 
    const tree = renderer.create(
     <Customer customerId={291}/> 
    ).toJSON(); 
    expect(tree).toMatchSnapshot(); 
    }); 
}); 

当我开玩笑运行它，我得到这个

FAIL tests/Customer.test.js 
    ● Test suite failed to run 

    ReferenceError: window is not defined 

     at node_modules/chart.js/src/core/core.helpers.js:672:10 
     at Object.<anonymous>.module.exports (node_modules/chart.js/src/core/core.helpers.js:680:3) 
     at Object.<anonymous> (node_modules/chart.js/src/chart.js:6:31) 
     at Object.<anonymous> (node_modules/react-chartjs-2/lib/index.js:20:14) 

看来ChartJS希望定义一个窗口对象，它是不可用，因为这是没有在浏览器中运行。有没有办法让快照测试与ChartJS一起工作？

Answer 1

只是模拟出从chartsjs

jest.mock('react-chartjs2',() => 'Chart') 

这个图表组件将取代与转储一个，将只呈现在你的快照<Chart prop="prop">原始的组件。