Skip to content

Cannot be used with storyshots #2050

@ekros

Description

@ekros

I have Storybook configured in my project alongside storyshots addon. I already have some stories and I can execute storybooks without problems. But when I run tests I see the following error:

 TypeError: Cannot read property 'scrollTop' of null

      at t.getScroll (node_modules/@dorna-its/react-blueprintjs-toolkit/node_modules/react-data-grid/dist/react-data-grid.js:1:115316)
      at t.getScroll (node_modules/@dorna-its/react-blueprintjs-toolkit/node_modules/react-data-grid/dist/react-data-grid.js:1:105102)
      at t.e (node_modules/@dorna-its/react-blueprintjs-toolkit/node_modules/react-data-grid/dist/react-data-grid.js:1:81789)
      at commitLifeCycles (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10428:22)
      at commitLayoutEffects (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13295:7)
      at HTMLUnknownElement.callCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9972: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:10021:16)
      at invokeGuardedCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10073:31)
      at commitRootImpl (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13033:9)
      at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:653:12)
      at runWithPriority (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1775:10)
      at commitRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12873:3)
      at finishSyncRender (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12384:3)
      at performSyncWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12370:7)
      at node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1825:24
      at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:653:12)
      at runWithPriority (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1775:10)
      at flushSyncCallbackQueueImpl (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1820:7)
      at flushSyncCallbackQueue (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1808:3)
      at scheduleUpdateOnFiber (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11776:9)
      at updateContainer (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14747:3)
      at create (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15455:5)
      at getRenderedTree (node_modules/@storybook/addon-storyshots/dist/frameworks/react/renderTree.js:23:16)
      at node_modules/@storybook/addon-storyshots/dist/test-bodies.js:10:22
      at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/snapshotsTestsTemplate.js:42:20)

The story code (this is not the actual code, but it does not work anyway):

const columns = [{ key: "id", name: "ID" }, { key: "title", name: "Title" }, { key: "count", name: "Count" }];

const rows = [
  { id: 0, title: "row1", count: 20 },
  { id: 1, title: "row1", count: 40 },
  { id: 2, title: "row1", count: 60 }
];

storiesOf("Infractions", module)
  .addDecorator(storybook.withDarkTheme)
  .add("Infractions", () => <ReactDataGrid columns={columns} rowGetter={i => rows[i]} rowsCount={3} minHeight={150} />);

Packages:

    "@storybook/addon-actions": "^5.3.18",
    "@storybook/addon-centered": "^5.3.18",
    "@storybook/addon-links": "^5.3.18",
    "@storybook/addon-storyshots": "^5.3.18",
    "@storybook/addon-storysource": "^5.3.18",
    "@storybook/addons": "^5.3.18",
    "@storybook/react": "^5.3.18",
    "@storybook/react-komposer": "^2.0.5",
    "react": "^16.13.1",
    "react-data-grid": "^6.1.0",
    "react-data-grid-addons": "^6.1.0",
    "react-dom": "^16.13.1"

Any idea? Thanks.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions