search

chrisvxd / story2sketch

Convert Storybook into Sketch symbols 💎
Other
402 stars 32 forks source link

'WARNING: No matching node' Error #80

Open s10wen opened 5 years ago

s10wen commented 5 years ago 
story2sketch --url http://localhost:6006/iframe.html?id=button--all --output stories.asketch.json

Here's the full log, if it's useful:

        ,,,,,,,,,,,,,...,,,,,,,,,,,,,
             **,,,,,,,,,,.......,,,,,,,,,,**
            ***,,,,,,,,...........,,,,,,,,***
          ****,,,,,,, ............. ,,,,,,,****
         *****.,,,, .               . ,,,,.*****
       *******.,,..                   ..,,.*******
      ******** ,.                      .., ********
     (((((////,***************************,////(((((
      ((///////,*************************,///////((
        ////////,***********************,////////
          ///////,*********************,///////
           ///////,*******************,///////
             //////,******,,,,,******,//////
               /////,*,,,,,,,,,,,,,*,/////
                 ////,,,,,,,,,,,,,,,////
                  ////,,,,,,,,,,,,,////
                    ///,,,,,,,,,,,///
                      //,,,,,,,,,//
                       //*,,,,,*//
                         /,,,,,/
                           *,*

                    story2sketch

Processing 12 stories...
 WARNING: No matching node for "Button/All" using querySelector #root on viewport narrow
 WARNING: No matching node for "Button/Primary" using querySelector #root on viewport narrow
 WARNING: No matching node for "Colour/Primary" using querySelector #root on viewport narrow
 WARNING: No matching node for "Button/All" using querySelector #root on viewport standard
[#-----------] 8% (1/12) 0.0s remaining WARNING: No matching node for "Button/Primary" using querySelector #root on viewport standard
 WARNING: No matching node for "Colour/Primary" using querySelector #root on viewport standard
 WARNING: No matching node for "Button/Secondary" using querySelector #root on viewport narrow
 WARNING: No matching node for "Button/Secondary" using querySelector #root on viewport standard
TimeoutError: Navigation Timeout Exceeded: 30000ms exceeded
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/LifecycleWatcher.js:142:21
  -- ASYNC --
    at Frame.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Page.goto (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/Page.js:674:49)
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:112:23)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
  -- ASYNC --
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12) {
  name: 'TimeoutError'
}
TypeError: Cannot read property 'goto' of undefined
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12)
    at Story2sketch.getSymbolsForStory (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:683:23)
TypeError: Cannot read property 'goto' of undefined
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12)
    at Story2sketch.getSymbolsForStory (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:683:23)
TypeError: Cannot read property 'goto' of undefined
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12)
    at Story2sketch.getSymbolsForStory (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:683:23)
TypeError: Cannot read property 'goto' of undefined
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12)
    at Story2sketch.getSymbolsForStory (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:683:23)
TimeoutError: Navigation Timeout Exceeded: 30000ms exceeded
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/LifecycleWatcher.js:142:21
    at runNextTicks (internal/process/task_queues.js:55:5)
    at listOnTimeout (internal/timers.js:501:9)
    at processTimers (internal/timers.js:475:7)
  -- ASYNC --
    at Frame.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Page.goto (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/Page.js:674:49)
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:112:23)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
  -- ASYNC --
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12) {
  name: 'TimeoutError'
}
TimeoutError: Navigation Timeout Exceeded: 30000ms exceeded
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/LifecycleWatcher.js:142:21
    at runNextTicks (internal/process/task_queues.js:55:5)
    at listOnTimeout (internal/timers.js:501:9)
    at processTimers (internal/timers.js:475:7)
  -- ASYNC --
    at Frame.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Page.goto (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/Page.js:674:49)
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:112:23)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
  -- ASYNC --
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12) {
  name: 'TimeoutError'
}
TimeoutError: Navigation Timeout Exceeded: 30000ms exceeded
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/LifecycleWatcher.js:142:21
  -- ASYNC --
    at Frame.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Page.goto (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/Page.js:674:49)
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:112:23)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
  -- ASYNC --
    at Page.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/puppeteer/lib/helper.js:111:15)
    at Story2sketch._callee5$ (…/.npm-packages/lib/node_modules/story2sketch/lib/server/Story2sketch.js:569:29)
    at tryCatch (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (…/.npm-packages/lib/node_modules/story2sketch/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at …/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:35:14
    at new Promise (<anonymous>)
    at new F (…/.npm-packages/lib/node_modules/story2sketch/node_modules/core-js/library/modules/_export.js:36:28)
    at Story2sketch.<anonymous> (…/.npm-packages/lib/node_modules/story2sketch/node_modules/babel-runtime/helpers/asyncToGenerator.js:14:12) {
  name: 'TimeoutError'
}
Success! 4 stories written to /…/stories.asketch.json
s10wen commented 5 years ago

the stories.asketch.json came out as:

{"_class":"page","do_objectID":"6aee0e46-8214-4481-b963-3c1b63af0a2b","exportOptions":{"_class":"exportOptions","exportFormats":[],"includedLayerIds":[],"layerOptions":0,"shouldTrim":false},"isFlippedHorizontal":false,"isFlippedVertical":false,"isLocked":false,"isVisible":true,"layerListExpandedType":0,"name":"Stories","nameIsFixed":false,"resizingConstraint":63,"resizingType":0,"rotation":0,"shouldBreakMaskChain":false,"layers":[],"clippingMaskMode":0,"hasClippingMask":false,"frame":{"_class":"rect","constrainProportions":false,"height":5000,"width":1920,"x":0,"y":0},"style":{"_class":"style","endDecorationType":0,"miterLimit":10,"startDecorationType":0},"horizontalRulerData":{"_class":"rulerData","base":0,"guides":[]},"verticalRulerData":{"_class":"rulerData","base":0,"guides":[]},"hasClickThrough":true,"includeInCloudUpload":true}

Importing to Sketch, I can see a 'Stories' page, but doesn't look to have any content in.

s10wen commented 5 years ago

Using Storybook 5.1.10

s10wen commented 5 years ago

I noticed in the README.md example the link is https://localhost:9001/iframe.html.

I can see individual stories e.g. at http://localhost:6006/iframe.html?id=button--all, but at http://localhost:6006/iframe.html I see 'No Preview'.

I'm wondering if there is an extra step I'm missing where I should see content at http://localhost:6006/iframe.html, or is the 'No Preview' expected behaviour?

EDIT: Using http://localhost:6006/iframe.html appeared to still run ok, despite the 'No Preview'.

s10wen commented 5 years ago

Made some progress 😍

Instead of running the cli command, I setup a story2sketch.config.js in the root:

module.exports = {
  output: "dist/great-ui.asketch.json",
  stories: "all",
  url: "http://localhost:6006/iframe.html"
};

Then ran story2sketch from the project root path. Doing so I had the error:

(node:32440) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, open '…/dist/great-ui.asketch.json'

I created the file and ran again and it worked (sort of) :)

s10wen commented 5 years ago

Storybook View:

Storybook

Sketch View:

Sketch

Not sure if there's an issue with the way I've got multiple components in a story, but looks to just be pulling in the first one.

s10wen commented 5 years ago

Example Button.stories.js code 'All' appears to be causing an issue and errors:

import React from 'react';
import { storiesOf } from '@storybook/react';
import Button from './Button';

storiesOf('Button', module)
  .add('All', () => (
    <React.Fragment>
      <Button
        style="primary"
        text="Primary Button"
      />
      <Button
        style="secondary"
        text="Secondary Button"
      />
    </React.Fragment>
  ))
  .add('Primary', () => (
    <Button
      style="primary"
      text="Primary Button"
    />
  ))
  .add('Secondary', () => (
    <Button
      style="secondary"
      text="Secondary Button"
    />
  ));

Remove the 'All', using the following code, seems to work:

import React from 'react';
import { storiesOf } from '@storybook/react';
import Button from './Button';

storiesOf('Button', module)
  .add('Primary', () => (
    <Button
      style="primary"
      text="Primary Button"
    />
  ))
  .add('Secondary', () => (
    <Button
      style="secondary"
      text="Secondary Button"
    />
  ));
s10wen commented 5 years ago

Hope that helps, apologies it's a bit scattered. Great project, I hope it continues to improve 👍🏻💫

chrisvxd commented 4 years ago

Hi @s10wen thanks for the all the info. Apologies for taking a while to respond.

So AFAIK storybook won't play well with multiple components per story since it assumes a 1 to 1 mapping between stories and symbols. You could try playing around with the querySelector param, but I haven't tried myself.

s10wen commented 4 years ago

Ah, good to know, I'm working on a large Storybook component library, so multiple would have been nice, can always split up. Cheers!

bitfactory-lasse-vandenboschchristensen commented 4 years ago

@chrisvxd @s10wen same issue here. As a test case i'm using a official Storybook demo storybook example:

module.exports = {
    output: "test.asketch.json",
    stories: "all",
    url:
        "https://airbnb.io/react-dates/iframe.html?id=daterangepicker-drp--default"
};

I get 


              ,,,,,,,,,,,,,...,,,,,,,,,,,,,
             **,,,,,,,,,,.......,,,,,,,,,,**
            ***,,,,,,,,...........,,,,,,,,***
          ****,,,,,,, ............. ,,,,,,,****
         *****.,,,, .               . ,,,,.*****
       *******.,,..                   ..,,.*******
      ******** ,.                      .., ********
     (((((////,***************************,////(((((
      ((///////,*************************,///////((
        ////////,***********************,////////
          ///////,*********************,///////
           ///////,*******************,///////
             //////,******,,,,,******,//////
               /////,*,,,,,,,,,,,,,*,/////
                 ////,,,,,,,,,,,,,,,////
                  ////,,,,,,,,,,,,,////
                    ///,,,,,,,,,,,///
                      //,,,,,,,,,//
                       //*,,,,,*//
                         /,,,,,/
                           *,*

                    story2sketch

Processing 204 stories...
 WARNING: No matching node for "DateRangePicker (DRP)/hidden with display: none" using querySelector #root on viewport narrow
 WARNING: No matching node for "DateRangePicker (DRP)/hidden with display: none" using querySelector #root on viewport standard
[#--------------------------------------------------------------------------------------------------------] 0% (1/204) 0.0s remaining WARNING: No matching node for "DateRangePicker (DRP)/default" using querySelector #root on viewport narrow
 WARNING: No matching node for "DateRangePicker (DRP)/non-english locale" using querySelector #root on viewport narrow
 WARNING: No matching node for "DateRangePicker (DRP)/default" using querySelector #root on viewport standard
 WARNING: No matching node for "DateRangePicker (DRP)/non-english locale" using querySelector #root on viewport standard
 WARNING: No matching node for "DateRangePicker (DRP)/with navigation blocked (minDate and maxDate)" using querySelector #root on viewport narrow
 WARNING: No matching node for "DateRangePicker (DRP)/with navigation blocked (minDate and maxDate)" using querySelector #root on viewport standard
...

Playing around with querySelector does not seem to work. For example setting it to querySelector: "body" will generate a result but not with the right content. Setting querySelector to querySelector: "#root" of course does not work but it seems to be the right selector.