search

reaviz / reaflow

🎯 React library for building workflow editors, flow charts and diagrams. Maintained by @goodcodeus.
https://reaflow.dev
Apache License 2.0
2.09k stars 120 forks source link

TypeError: _a.scrollTo is not a function (in tests) #79

Open C0DK opened 3 years ago

C0DK commented 3 years ago

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Other... Please describe:

Current behavior

When creating any Canvas in tests i get an error of TypeError: _a.scrollTo is not a function

For ref here is my code that works just fine in non-test cases:

      <Canvas
        nodes={graph.nodes.map(toReaflowNode(formatNodeLabel))}
        edges={graph.edges.map(toReaflowEdge)}
      />

Full stacktrace

   Error: Uncaught [TypeError: _a.scrollTo is not a function]
        at reportException (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:62:24)
        at innerInvokeEventListeners (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:333:9)
        at invokeEventListeners (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
        at HTMLUnknownElementImpl._dispatch (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
        at HTMLUnknownElementImpl.dispatchEvent (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
        at HTMLUnknownElement.dispatchEvent (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
        at Object.invokeGuardedCallbackDev (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
        at invokeGuardedCallback (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
        at flushPassiveEffectsImpl (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:23574:9)
        at unstable_runWithPriority (/home/cdk/dev/codoc-webapp/node_modules/scheduler/cjs/scheduler.development.js:646:12) TypeError: _a.scrollTo is not a function
        at /home/cdk/dev/codoc-webapp/node_modules/reaflow/dist/index.cjs.js:442:110
        at invokePassiveEffectCreate (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:23487:20)
        at HTMLUnknownElement.callCallback (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:3945:14)
        at HTMLUnknownElement.callTheUserObjectsOperation (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
        at innerInvokeEventListeners (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:318:25)
        at invokeEventListeners (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
        at HTMLUnknownElementImpl._dispatch (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
        at HTMLUnknownElementImpl.dispatchEvent (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
        at HTMLUnknownElement.dispatchEvent (/home/cdk/dev/codoc-webapp/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
        at Object.invokeGuardedCallbackDev (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
        at invokeGuardedCallback (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
        at flushPassiveEffectsImpl (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:23574:9)
        at unstable_runWithPriority (/home/cdk/dev/codoc-webapp/node_modules/scheduler/cjs/scheduler.development.js:646:12)
        at runWithPriority$1 (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:11276:10)
        at flushPassiveEffects (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom.development.js:23447:14)
        at Object.<anonymous>.flushWork (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom-test-utils.development.js:992:10)
        at act (/home/cdk/dev/codoc-webapp/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1107:9)
        at render (/home/cdk/dev/codoc-webapp/node_modules/@testing-library/react/dist/pure.js:95:26)
        at render (/home/cdk/dev/codoc-webapp/src/_test/react.jsx:21:8)
        at Object.<anonymous> (/home/cdk/dev/codoc-webapp/src/components/GraphWrapper.test.jsx:41:39)
        at Promise.then.completed (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/utils.js:276:28)
        at new Promise (<anonymous>)
        at callAsyncCircusFn (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/utils.js:216:10)
        at _callCircusTest (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/run.js:212:40)
        at processTicksAndRejections (node:internal/process/task_queues:94:5)
        at _runTest (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/run.js:149:3)
        at _runTestsForDescribeBlock (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/run.js:63:9)
        at _runTestsForDescribeBlock (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/run.js:57:9)
        at run (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/run.js:25:3)
        at runAndTransformResultsToJestFormat (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:176:21)
        at jestAdapter (/home/cdk/dev/codoc-webapp/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:109:19)
        at runTestInternal (/home/cdk/dev/codoc-webapp/node_modules/jest-runner/build/runTest.js:380:16)
        at runTest (/home/cdk/dev/codoc-webapp/node_modules/jest-runner/build/runTest.js:472:34)
        at Object.worker (/home/cdk/dev/codoc-webapp/node_modules/jest-runner/build/testWorker.js:133:12)

Expected behavior

That something would load for my tests :)

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Environment


Libs:
- react version: 17.0.1
- realayers version: 3.0.14


Browser:
- [ ] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX

For Tooling issues:
- Node version: XX  
- Platform:  linux

Others:
amcdnl commented 3 years ago

I think this is related to scrollTo and the test driver.what testing library are you using?

Nerevar123 commented 3 years ago

Also have this problem with "@testing-library/react": "^11.1.0"

Nerevar123 commented 3 years ago

With this passed the tests successfully:

import { ResizeObserver } from '@juggle/resize-observer';

window.ResizeObserver = ResizeObserver; Element.prototype.scrollTo = jest.fn();

but still, have a console.error:

console.error 💡 react-cool-dimensions: the browser doesn't support Resize Observer, please use polyfill: https://github.com/wellyshen/react-cool-dimensions#resizeobserver-polyfill

  at node_modules/react-cool-dimensions/dist/index.js:1:2420
  at invokePassiveEffectCreate (node_modules/react-dom/cjs/react-dom.development.js:23487:20)
  at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:3945:14)
  at HTMLUnknownElement.callTheUserObjectsOperation (node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
  at innerInvokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:338:25)
  at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
  at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
  at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
amcdnl commented 3 years ago

@Nerevar123 - Maybe we should log and reference this ticket in that lib?

Nerevar123 commented 3 years ago

@amcdnl https://github.com/wellyshen/react-cool-dimensions/issues/558 done Maybe the problem with the version of this package, the current is 2.0.7, reaflow uses 1.3.4

amcdnl commented 3 years ago

Got it. The resizer is locked at that version because various libraries in reaviz org all use it. I will need to update them all and test to make sure new version works. I will make a item to do that.

Nerevar123 commented 3 years ago

Adding this line to setupTests.ts fixed the problem:

window.ResizeObserverEntry = jest.fn();

amcdnl commented 3 years ago

Can any of you retry on latest? I think I solved it but not sure.