Question

我想测试一个在其中一个方法中使用filesaver.js的组件，但是当我运行测试时，我收到以下错误：

TypeError: Cannot read property 'document' of undefined

      at node_modules\filesaver.js\FileSaver.js:22:15
      at Object.<anonymous> (node_modules\filesaver.js\FileSaver.js:241:2)
      at Object.<anonymous> (src\components\MyComponent.js:3:44)

我的测试看起来像：

import React from 'react';
import { shallow } from 'enzyme';
import MyComponent from '../MyComponent';

describe('<MyComponent /> test suite', function () {

   it('Smoke Test (Renders without crashing', () => {
       shallow(<MyComponent />)
   })
})

该组件如下所示：

import React, { PropTypes } from 'react';

import { saveAs } from 'filesaver.js';

class MyComponent extends React.Component {
    constructor(props) {
        super(props)
    }

    handleFileDownload = (attachment) => {
        saveAs(attachment.blob, attachment.file_name)
    }

    render() {
        return (
            <button className="btn btn-default" aria-label="Download" onClick={() => this.handleFileDownload(this.props.attachment)}>
                <i className="icon icon-save" style={{ margin: '0' }} />
            </button>
    }
}

export default MyComponent;

我如何能够在我的组件中使用filesaver.js编写浅层测试，或者是否有办法模拟filesaver的导入，因为这是错误发生的地方？

Answer 1

好的，显然我没有使用正确的文件保护程序库。我使用this filesaver.js项目而不是原始且维护良好的filesaver.js from eligrey。使用后面的库，一切都运行良好，也可以进行浅层单元测试，没有任何问题。

用filesaver.js实现浅渲染单元测试

1 个答案: