I am trying to test a component which renders the basic example of react-data-grid component (http://adazzle.github.io/react-data-grid/examples.html#/basic).
The test code looks like this:
import React from 'react';
import renderer from 'react-test-renderer';
import ExampleGrid from './ExampleGrid';
it('renders correctly', () => {
const tree = renderer.create(<ExampleGrid />);
expect(tree).toMatchSnapshot();
});
When I run the test I get the message:
TypeError: Cannot read property 'offsetWidth' of undefined
Any ideas about what is causing this problem?
Edit: The content of ExampleGrid is:
const ReactDataGrid = require('react-data-grid');
const React = require('react');
class ExampleGrid extends React.Component {
constructor(props, context) {
super(props, context);
this.createRows();
this._columns = [
{ key: 'id', name: 'ID' },
{ key: 'title', name: 'Title' },
{ key: 'count', name: 'Count' } ];
this.state = null;
}
createRows = () => {
let rows = [];
for (let i = 1; i < 4; i++) {
rows.push({
id: i,
title: 'Title ' + i,
count: i * 1000
});
}
this._rows = rows;
};
rowGetter = (i) => {
return this._rows[i];
};
render() {
return (
<ReactDataGrid
columns={this._columns}
rowGetter={this.rowGetter}
rowsCount={this._rows.length}
minHeight={500} />);
}
}
export default ExampleGrid;
This problem arises when 'react' and 'react-test-renderer' versions aren't the same.
Change them to the same version numbers and it will work.
Cheers
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With