CezaryDanielNowak / React-dotdotdot

Multiline text ellipsis for react. Demo:
https://nowak.click/react-dotdotdot/
MIT License
401 stars 54 forks source link

TypeError: Cannot read property 'length' of null #14

Closed VeeteshJain closed 6 years ago

VeeteshJain commented 7 years ago

getting this error as react Dotdotdot not able to access container ref in case of snapshot testing this.dotdotdot(ReactDOM.findDOMNode(this.refs.container));.

 FAIL  src/scripts/Plp/tests/snapshot/Product.jsx
  ● Component: Product snapshot tests › renders correctly.

    TypeError: Cannot read property 'length' of null

      at ReactComponent.Object.<anonymous>.Dotdotdot.dotdotdot (node_modules/react-dotdotdot/src/index.js:29:18)
      at ReactComponent.Object.<anonymous>.Dotdotdot.componentDidMount (node_modules/react-dotdotdot/src/index.js:17:8)
      at node_modules/react-test-renderer/lib/ReactCompositeComponent.js:265:25
      at measureLifeCyclePerf (node_modules/react-test-renderer/lib/ReactCompositeComponent.js:75:12)
      at node_modules/react-test-renderer/lib/ReactCompositeComponent.js:264:11
      at CallbackQueue.notifyAll (node_modules/react-test-renderer/lib/CallbackQueue.js:76:22)
      at ReactTestReconcileTransaction.close (node_modules/react-test-renderer/lib/ReactTestReconcileTransaction.js:36:26)
      at ReactTestReconcileTransaction.closeAll (node_modules/react-test-renderer/lib/Transaction.js:206:25)
      at ReactTestReconcileTransaction.perform (node_modules/react-test-renderer/lib/Transaction.js:153:16)
      at batchedMountComponentIntoNode (node_modules/react-test-renderer/lib/ReactTestMount.js:69:27)
      at ReactDefaultBatchingStrategyTransaction.perform (node_modules/react-test-renderer/lib/Transaction.js:140:20)
      at Object.batchedUpdates (node_modules/react-test-renderer/lib/ReactDefaultBatchingStrategy.js:62:26)
      at Object.batchedUpdates (node_modules/react-test-renderer/lib/ReactUpdates.js:97:27)
      at Object.render (node_modules/react-test-renderer/lib/ReactTestMount.js:125:18)
      at getComponent (src/scripts/Plp/tests/snapshot/Product.jsx:27:71)
      at Object.<anonymous> (src/scripts/Plp/tests/snapshot/Product.jsx:41:16)
      at process._tickCallback (internal/process/next_tick.js:103:7)

some of my finding:- 1> https://facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html#mocking-refs-for-snapshot-testing 2> https://github.com/facebook/react/issues/7371

JoshuaHuber commented 7 years ago

@VeeteshJain running into the same issue did you find a fix?

yantakus commented 6 years ago

adding

jest.mock('react-dotdotdot', () => 'div');

resolved the issue for me.

CezaryDanielNowak commented 6 years ago

I'm closing it for now. Please reopen if problem occurs again.

lensisle commented 6 years ago

I'm having this same issue and @yantakus fix did not work for me.

my implementation is

const component = create(
      <StoryDetailsCTARow
        {...fakeProps}
      />
    );

    let tree = component.toJSON();
    expect(tree).toMatchSnapshot();

stack trace

TypeError: Cannot read property 'length' of null

      23 |         {...fakeProps}
      24 |       />
    > 25 |     );
      26 | 
      27 |     console.log(component);
      28 | 

      at Dotdotdot.Object.<anonymous>.Dotdotdot.dotdotdot (node_modules/react-dotdotdot/src/index.js:37:19)
      at Dotdotdot.Object.<anonymous>.Dotdotdot.componentDidMount (node_modules/react-dotdotdot/src/index.js:25:8)
      at commitLifeCycles (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:5347:26)
      at commitAllLifeCycles (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7018:9)
      at HTMLUnknownElement.callCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:906:14)
      at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:193:27)
      at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:119:9)
      at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:82:17)
      at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/nodes/HTMLElement-impl.js:30:27)
      at HTMLUnknownElement.dispatchEvent (node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:157:21)
      at Object.invokeGuardedCallbackDev (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:944:16)
      at invokeGuardedCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:993:29)
      at commitRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7157:9)
      at completeRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8065:36)
      at performWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8015:11)
      at performWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7933:9)
      at performSyncWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7910:5)
      at requestWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7810:7)
      at scheduleWorkImpl (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7685:13)
      at scheduleWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7645:12)
      at scheduleRootUpdate (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8273:5)
      at updateContainerAtExpirationTime (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8301:12)
      at Object.updateContainer (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8328:14)
      at Object.create (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9009:18)
      at Object.<anonymous> (src/__tests__/StoryDetailsCTARow/StoryDetailsCTARow.test.tsx:25:47)