[Tooltip] Invalid Value Calculated on Tooltip when Running Tests

[pvienneau]

Problem description

Tooltip component throws an invalid value error on the calculated left position when running in a test environment.

Seems that the offsetWidth is returned as undefined, which is being used to calculate the new value, which returned a calculated result of NaN. Not sure what is throwing this warning, but it can be addressed by setting a default value to the offsetWidth state to null.

Link to minimally-working code that reproduces the issue

See master...pvienneau:master for a code diff with a test that fails without the provided fix.

Versions

• Material-UI: 0.16.2
• React: 15.4.0
• Browser: N/A
• Node: 6.5.0

[Mythra]

I'm also running into this problem with jest (Same versions)

[joewalker]

The solution for me was here: https://facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html#mocking-refs-for-snapshot-testing

describe('TestComponent', function(): void {
  const mocks = {
    tooltip: { offsetWidth: 100 },
    ripple: { style: {} },
  };
  function createNodeMock(element: Element<>): ?Object {
    return mocks[element.ref];
  }

  it('should render', function(): void {
    const muiTheme = getMuiTheme();
    const element = (
      <MuiThemeProvider muiTheme={muiTheme}>
        <TestComponent/>
      </MuiThemeProvider>,
    );

    const tree = renderer.create(element, { createNodeMock }).toJSON();
    expect(tree).toMatchSnapshot();
  });
});

[oliviertassinari]

Closing for #2230