eligrey / eligrey/FileSaver.js
Jest/Enzyme throwing an error on download a file test
- Dominant language
- JavaScript
- Stars
- 22k
- Forks
- 4.3k
- PR merge metrics
- No merged PRs in 30d
Description
I am using [file-saver][1] library in order to download a file.
And I am getting this error on the test:
```javascript
FAIL src/client/pages/Shipments/__tests__/components/DownloadCSVItem-test.js
DownloadCSVItem component
✓ renders DownloadCSVItem and check if classes exists (41ms)
✕ triggers DownloadCSVItem button onClick method (74ms)
● DownloadCSVItem component › triggers DownloadCSVItem button onClick method
TypeError: (0 , _fileSaver.default) is not a function
39 | });
40 |
> 41 | saveAs(blob, `${accountGuid}-summary.txt`);
| ^
42 | };
43 |
44 | return (
at saveAs (src/client/pages/Shipments/DownloadCSVItem.js:41:5)
```
And this is how the component looks:
```javascript
import React from 'react';
import PropTypes from 'prop-types';
import saveAs from 'file-saver';
import { OverflowMenuItem } from 'carbon-components-react';
import { compose } from 'redux';
import { connect } from 'react-redux';
import { translate } from 'react-i18next';
import { formatAddresses, momentDateFormatter } from '../../utils/formatters';
const DownloadCSVItem = ({ t, shipmentsCSV, accountGuid }) => {
const formatCSV = () => {
const shipmentsCount = shipmentsCSV.itemsCount;
const shipmentsData = shipmentsCSV.shipments;
const replacer = value => (value === null ? '— —' : value);
const CSV = {
Count: shipmentsCount,
data: shipmentsData.map(row => ({
Courier: replacer(row.courierName),
Status: replacer(row.status.name),
Type: replacer(row.type.name),
From: momentDateFormatter(row.originationDate),
})),
};
return JSON.stringify(CSV, null, 1).replace(
/"data":|[!"@#$^&%*()+=[\]{}|<>?,.\\-]/g,
'',
);
};
const downloadFile = () => {
const blob = new Blob([formatCSV()], {
type: 'text/csv;charset=UTF-8',
});
saveAs(blob, `${accountGuid}-summary.txt`);
};
return (
);
};
DownloadCSVItem.propTypes = {
t: PropTypes.func.isRequired,
accountGuid: PropTypes.string.isRequired,
shipmentsCSV: PropTypes.shape({
totalCount: PropTypes.number,
shipments: PropTypes.array,
}).isRequired,
};
export default compose(
connect(store => ({
accountGuid: store.global.accountGuid,
shipmentsCSV: store.shipments.shipmentsCSV,
})),
translate(),
)(DownloadCSVItem);
```
And here the test:
```javascript
it('triggers DownloadCSVItem button onClick method', () => {
expect.assertions(1);
const wrapper = mount();
expect(wrapper.find('button')).toHaveLength(1);
wrapper
.find('button')
.first()
.simulate('click');
});
```
What am I missing?
[1]: https://www.npmjs.com/package/file-saver/v/1.3.2
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.