Ref issues with jest snapshot testing

[GR34SE]

I'm using storybook's storyshots addon to run jest snapshot tests in my app.

I have an issue with refs during my test runtime, it's definitely related to: https://reactjs.org/blog/2016/11/16/react-v15.4.0.html#mocking-refs-for-snapshot-testing

shiitake/dist/index.js:91 -> testChildrenEl ref is null

var contentHeight = testChildrenEl.current.offsetHeight;

Stack trace:

    TypeError: Cannot read property 'offsetHeight' of null

      at checkHeight (node_modules/shiitake/dist/index.js:91:48)
      at node_modules/shiitake/dist/index.js:152:7
      at commitHookEffectListMount (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10345:26)
      at commitPassiveHookEffects (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10383:11)
      at HTMLUnknownElement.callCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9972:14)

shiitake version: 3.0.2

Could you help with creating node mock for this case?

[bsidelinger912]

Hey @GR34SE, I'm a little surprised that this is an issue. If you're using storyshots I assume then you're rendering the component with storybook in a separate process then using story shots to load that in a headless browser and take a screenshot? Is that correct? Or are you using something like Enzyme shallow rendering?

[GR34SE]

Hey, sorry for delayed response

story shots to load that in a headless browser

no, storyshots takes rendered dom nodes snapshot which is then checked if the structure has changed. The issue isn't related directly to storyshots, but to renderer whick lacks ref at runtime. This ref can be mocked