ResponsiveContainer warning broken in test environment

Do you want to request a feature or report a bug?

Bug report

What is the current behavior?

Even if a proper size is defined in the ResponsiveContainer, the ResponsiveContainer component will log a warning in tests thinking the calculated size is 0 while displaying the right values: Example for minWidth(200) & minHeight(100):

WARN: 'The width(0) and height(0) of chart should be greater than 0,
       please check the style of container, or the props width(100%) and height(100%),
       or add a minWidth(200) or minHeight(100) or use aspect(undefined) to control the
       height and width.'

The calculatedWidth / calculatedHeight in ResponsiveContainer don’t take the minWidth & minHeight into account.

steps to reproduce:

• clone recharts repo
• run npm run test
• test is passing but still displaying the warning

What is the expected behavior?

No warning when the right value is passed. Even when a minWidth / minHeight / aspect is passed, the calculated width or height is still 0. It renders properly in the browser, this only happens in tests.

Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?

Tested on 1.0.0-alpha.0, on macOS 10.12.4 running tests with Mocha & Enzyme. Same thing with version 0.22.1.

[gilamran]

A fast solution would be to define some mock value for the clientWidth and clientHeight on the beforeAll

beforeAll(() => {
  jest.spyOn(HTMLElement.prototype, 'clientHeight', 'get').mockReturnValue(100);
  jest.spyOn(HTMLElement.prototype, 'clientWidth', 'get').mockReturnValue(100);
});

[anujparikh]

same with me, whenever I am using Responsive Container. I am getting same error while unit testing the code