I am trying to test a snapshot on a component and I get the error RangeError: Maximum call stack size exceeded
, though when I remove toMatchSnapshot
, the error is gone.
My project was created with Create React App and uses Jest + Enzyme
Stack call
FAIL src/components/Dashboard/Pipeline/Pipeline.test.js
● Pipeline Component › Pipeline Item › should render
RangeError: Maximum call stack size exceeded
at Object.it (src/components/Dashboard/Pipeline/Pipeline.test.js:20:181)
at new Promise (<anonymous>)
at Promise.resolve.then.el (node_modules/p-map/index.js:46:16)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
Here is the component I'm trying to test
import React from 'react';
import PropTypes from 'prop-types';
import { Circle } from 'rc-progress';
import Color from 'color';
import './PipelineItem.css';
const PipelineItem = ({ role, color, count, total, value }) => (
<div className="pipeline">
<span className="role" style=>
{role}
</span>
<div className="progress">
<Circle
percent={count / total * 100}
gapDegree={70}
gapPosition="bottom"
strokeWidth="6"
strokeLinecap="square"
strokeColor={color}
/>
<div className="completed">
<span className="count">
{count} / {total}
</span>
</div>
</div>
<div className="value" style=>
<div className="wrap" style=>
<span className="title">Value</span>
<span className="value">${value}</span>
</div>
</div>
</div>
);
PipelineItem.defaultProps = {
value: 0,
total: 0,
count: 0,
};
PipelineItem.propTypes = {
role: PropTypes.string,
color: PropTypes.string,
count: PropTypes.number,
total: PropTypes.number,
value: PropTypes.number
};
export default PipelineItem;
Here is the test
import React from 'react';
import Pipeline from './Pipeline';
import PipelineItem from './PipelineItem';
describe('Pipeline Component', () => {
describe('Pipeline Wrap', () => {
it('should render', () => {
expect(shallow(<Pipeline />)).toMatchSnapshot();
});
});
describe('Pipeline Item', () => {
const props = {
role: 'Loan Officer',
color: '#2ae',
count: 100,
total: 150,
value: 15000
};
it('should render', () => {
expect(shallow(<PipelineItem {...props}/>)).toMatchSnapshot();
});
});
});
The first test runs fine
Aucun commentaire:
Enregistrer un commentaire