bkrem/react-d3-tree

Unit testing error: Cannot read properties of undefined (reading 'baseVal')

pascalbe-dev opened this issue · 0 comments

Are you reporting a bug, or opening a feature request?

Feature request

I want to make use of react-d3-tree in my unit tests.

What is the actual behavior/output?

I have a unit test of a react component which uses the react-d3-tree under the hood.
The unit test is executed via vitest.
When I run the unit test, then I get this error in the console and assertions on the tree UI are not working:

TypeError: Cannot read properties of undefined (reading 'baseVal')
❯ SVGSVGElement.defaultExtent node_modules/d3-zoom/src/zoom.js:25:30
❯ new Gesture node_modules/d3-zoom/src/zoom.js:186:26
❯ gesture node_modules/d3-zoom/src/zoom.js:178:42
❯ SVGSVGElement. node_modules/d3-zoom/src/zoom.js:92:9
❯ Selection.default [as each] node_modules/d3-selection/src/selection/each.js:5:37
❯ zoom.transform node_modules/d3-zoom/src/zoom.js:91:29
❯ Selection.default [as call] node_modules/d3-selection/src/selection/call.js:4:12
❯ Tree.bindZoomListener node_modules/react-d3-tree/lib/esm/Tree/index.js:242:13
❯ Tree.componentDidMount node_modules/react-d3-tree/lib/esm/Tree/index.js:192:14
❯ commitLayoutEffectOnFiber node_modules/react-dom/cjs/react-dom.development.js:23310:28

What is the behavior/output you expect?

That I do not see any errors and the test can assert stuff inside the tree.

Any workaround is also welcome. I did not find a way to mock the not working part.

Can you consistently reproduce the issue/create a reproduction case (e.g. on https://codesandbox.io)?

Yes, but in a private codebase. Would take some effort to extract it. Therefore, I would wait for a response here first.

What version of react-d3-tree are you using?

3.5.0