percy / percy-storybook

Percy's Storybook SDK.
https://docs.percy.io/docs/storybook
MIT License
146 stars 45 forks source link

Storybook object not found on window. Open your storybook and check the console for errors. #230

Closed joegaudet closed 3 years ago

joegaudet commented 3 years ago

Running storybook + percy with ember-cli-storybook, the static site loads just fine (example here: https://s3.amazonaws.com/storybooks.food.ee/refs/pull/4720/merge/index.html?path=/story/examples-action--text)

However when I try and run snapshot, I see the following error:

yarn run percy-storybook --width=320,1280
yarn run v1.13.0
$ /Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/.bin/percy-storybook --width=320,1280
Error:  Error: Evaluation failed: Error: Storybook object not found on window. Open your storybook and check the console for errors.
    at checkStories (__puppeteer_evaluation_script__:23:16)
    at __puppeteer_evaluation_script__:20:11
    at ExecutionContext._evaluateInternal (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/ExecutionContext.js:81:15)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async ExecutionContext.evaluate (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/ExecutionContext.js:48:12)
  -- ASYNC --
    at ExecutionContext.<anonymous> (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/helper.js:111:15)
    at DOMWorld.evaluate (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/DOMWorld.js:112:20)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
  -- ASYNC --
    at Frame.<anonymous> (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/helper.js:111:15)
    at Page.evaluate (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/Page.js:833:43)
    at Page.<anonymous> (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/puppeteer/lib/helper.js:112:23)
    at _callee$ (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/@percy/storybook/lib/getStories.js:64:25)
    at tryCatch (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.<computed> [as next] (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (/Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/babel-runtime/helpers/asyncToGenerator.js:17:30)
    at /Users/joegaudet/foodee-dev/MasterFox/clients/swift-fox/node_modules/babel-runtime/helpers/asyncToGenerator.js:28:13
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Here are our deps

  "devDependencies": {
    "@babel/plugin-proposal-nullish-coalescing-operator": "7.10.4",
    "@babel/plugin-proposal-optional-chaining": "7.11.0",
    "@cypress/browserify-preprocessor": "3.0.1",
    "@ember/jquery": "^1.1.0",
    "@ember/optional-features": "^1.3.0",
    "@ember/render-modifiers": "^1.0.2",
    "@fortawesome/ember-fontawesome": "^0.2.1",
    "@fortawesome/free-solid-svg-icons": "5.14.0",
    "@glimmer/component": "1.0.1",
    "@glimmer/tracking": "1.0.1",
    "@percy/cypress": "^2.3.1",
    "@percy/storybook": "^3.3.1",
    "@storybook/addon-actions": "6.0.4",
    "@storybook/addon-docs": "6.0.4",
    "@storybook/addon-info": "6.0.0-alpha.2",
    "@storybook/addon-knobs": "6.0.4",
    "@storybook/addon-links": "6.0.4",
    "@storybook/addon-viewport": "6.0.4",
    "@storybook/addons": "6.0.4",
    "@storybook/ember": "6.0.4",
    "@storybook/ember-cli-storybook": "0.2.1",
    "array-flat-polyfill": "^1.0.1",
    "axios": "^0.19.2",
    "babel-eslint": "10.1.0",
    "babel-loader": "8.1.0",
    "bootstrap": "4.5.0",
    "broccoli-asset-rev": "^3.0.0",
    "broccoli-clean-css": "2.0.1",
    "broccoli-persistent-filter": "3.1.0",
    "chai-dom": "1.8.2",
    "cypress": "4.12.1",
    "cypress-wait-until": "^1.7.1",
    "element-remove": "^1.0.4",
    "ember-ajax": "^5.0.0",
    "ember-animated": "0.10.1",
    "ember-arg-types": "^0.2.1",
    "ember-attacher": "1.1.1",
    "ember-auto-import": "1.6.0",
    "ember-autofocus-modifier": "^1.0.1",
    "ember-body-class": "^1.1.4",
    "ember-chai-dom-helpers": "^0.0.4",
    "ember-cli": "3.20.0",
    "ember-cli-accounting": "2.0.2",
    "ember-cli-active-link-wrapper": "0.5.0",
    "ember-cli-app-version": "^3.2.0",
    "ember-cli-autoprefixer": "1.0.2",
    "ember-cli-babel": "7.22.1",
    "ember-cli-chai": "^0.5.0",
    "ember-cli-cjs-transform": "2.0.0",
    "ember-cli-clipboard": "0.15.0",
    "ember-cli-dependency-checker": "^3.2.0",
    "ember-cli-deploy": "1.0.2",
    "ember-cli-deploy-build": "2.0.0",
    "ember-cli-deploy-display-revisions": "2.0.0",
    "ember-cli-deploy-gzip": "1.0.1",
    "ember-cli-deploy-redis": "2.0.0",
    "ember-cli-deploy-s3": "2.0.0",
    "ember-cli-deploy-sentry": "^0.7.0",
    "ember-cli-deprecation-workflow": "^1.0.1",
    "ember-cli-file-saver": "2.0.0",
    "ember-cli-google-analytics": "1.5.0",
    "ember-cli-htmlbars": "5.3.1",
    "ember-cli-inject-live-reload": "^2.0.2",
    "ember-cli-link-tags": "^1.4.1",
    "ember-cli-mirage": "1.1.8",
    "ember-cli-moment-shim": "3.8.0",
    "ember-cli-nouislider": "1.2.1",
    "ember-cli-page-object": "1.17.3",
    "ember-cli-pagination": "3.1.5",
    "ember-cli-polyfill-importer": "^0.0.2",
    "ember-cli-sass": "10.0.1",
    "ember-cli-sentry": "^4.1.0",
    "ember-cli-shims": "^1.2.0",
    "ember-cli-sri": "^2.1.1",
    "ember-cli-string-helpers": "5.0.0",
    "ember-cli-string-utils": "^1.1.0",
    "ember-cli-stripe": "0.4.0",
    "ember-cli-test-loader": "3.0.0",
    "ember-cli-uglify": "^3.0.0",
    "ember-cli-webfontloader": "^0.4.0",
    "ember-click-outside": "^1.3.0",
    "ember-clock": "1.1.1",
    "ember-component-css": "0.7.4",
    "ember-composable-helpers": "4.2.2",
    "ember-concurrency": "1.2.1",
    "ember-concurrency-async": "^0.3.0",
    "ember-concurrency-decorators": "2.0.1",
    "ember-content-loader": "^0.1.3",
    "ember-cookies": "^0.5.2",
    "ember-credit-cards": "1.5.0",
    "ember-custom-actions": "3.3.0",
    "ember-data": "3.12.4",
    "ember-data-factory-guy": "3.9.7",
    "ember-data-has-many-query": "0.3.1",
    "ember-data-model-fragments": "4.0.0",
    "ember-data-url-templates": "^0.4.5",
    "ember-decorators": "^6.1.1",
    "ember-event-helpers": "0.1.1",
    "ember-exam": "5.0.1",
    "ember-export-application-global": "^2.0.1",
    "ember-fetch": "8.0.2",
    "ember-focus-trap": "^0.4.0",
    "ember-font-awesome": "^4.0.0-rc.4",
    "ember-foxy-forms": "2.4.1",
    "ember-in-viewport": "3.8.0",
    "ember-inflector": "3.0.1",
    "ember-inline-svg": "1.0.0",
    "ember-inputmask": "0.10.4",
    "ember-keyboard": "^6.0.0",
    "ember-link": "1.2.0",
    "ember-load-initializers": "^2.1.1",
    "ember-localstorage-adapter": "1.0.0",
    "ember-math-helpers": "2.15.0",
    "ember-maybe-import-regenerator": "^0.1.6",
    "ember-mocha": "^0.16.2",
    "ember-modal-dialog": "3.0.1",
    "ember-model-validator": "3.10.0",
    "ember-moment": "8.0.0",
    "ember-native-dom-helpers": "0.6.3",
    "ember-notify": "^6.0.0",
    "ember-page-title": "5.2.3",
    "ember-popper": "0.11.3",
    "ember-promise-helpers": "^1.0.9",
    "ember-pusher": "https://git@github.com/truecoach/ember-pusher",
    "ember-radio-button": "2.0.1",
    "ember-ref-modifier": "1.0.1",
    "ember-render-helpers": "^0.1.1",
    "ember-resize": "^0.3.4",
    "ember-resolver": "8.0.2",
    "ember-responsive": "4.0.0",
    "ember-router-helpers": "^0.4.0",
    "ember-set-body-class": "^0.4.2",
    "ember-simple-auth": "2.1.1",
    "ember-simple-set-helper": "0.1.2",
    "ember-source": "3.20.4",
    "ember-stripe-service": "7.1.0",
    "ember-svg-jar": "^2.2.3",
    "ember-template-lint": "2.10.0",
    "ember-template-lint-plugin-prettier": "^2.0.0",
    "ember-test-selectors": "4.1.0",
    "ember-tether": "2.0.0",
    "ember-tooltips": "3.4.3",
    "ember-transition-helper": "1.0.0",
    "ember-truth-helpers": "2.1.0",
    "ember-wormhole": "^0.5.5",
    "ember-yeti-table": "1.6.0",
    "emberx-select": "^4.0.0-beta.2",
    "eslint": "7.6.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-cypress": "^2.10.3",
    "eslint-plugin-ember": "8.10.1",
    "eslint-plugin-node": "11.1.0",
    "eslint-plugin-prettier": "^3.1.4",
    "faker": "^4.1.0",
    "font-awesome": "^4.7.0",
    "foundation-datepicker": "^1.5.6",
    "foundation-sites": "5.5.3",
    "inflection": "^1.12.0",
    "intl-tel-input": "17.0.3",
    "jquery-mask-plugin": "^1.14.16",
    "jquery-maskmoney": "^3.0.2",
    "jquery.payment": "^3.0.0",
    "le_js": "^0.0.1",
    "liquid-fire": "0.31.0",
    "loader.js": "^4.7.0",
    "logrocket": "1.0.10",
    "macro-decorators": "^0.1.2",
    "moment": "2.27.0",
    "moment-duration-format": "2.3.2",
    "moment-timezone": "0.5.31",
    "node-sass-globbing": "0.0.23",
    "nodelist-foreach-polyfill": "^1.2.0",
    "npm-run-all": "^4.1.5",
    "os": "^0.1.1",
    "pagination-pager": "^3.2.4",
    "path": "^0.12.7",
    "prettier": "^2.0.5",
    "prop-types": "^15.7.2",
    "resize-observer-polyfill": "^1.5.1",
    "sass": "1.26.10",
    "sinon": "9.0.3",
    "sinon-chai": "3.5.0",
    "sprintf-js": "^1.1.2",
    "timekeeper": "^2.2.0",
    "webfontloader": "^1.6.28"
  },
milesj commented 3 years ago

Running into this also.

@joegaudet Did you ever resolve it?

Robdel12 commented 3 years ago

Hey @milesj! What version of the SDK are you currently running?

This error means when we opened storybook, we weren't able to find any stories (window.__STORYBOOK_CLIENT_API__). For example, the official storybook: https://next--storybookjs.netlify.app/official-storybook/iframe.html?id=addons-a11y-image--without-alt&globals=measureEnabled:false&args=&viewMode=story

image

The first step to debugging is to open up the static directory you're passing to the Percy Storybook SDK and make sure you can access an isolated story (not the storybook UI, but the iframe.html?.. URL like linked above).

milesj commented 3 years ago

@Robdel12 I was able to get it working again by upgrading to @percy cli/storybook next versions.

Robdel12 commented 3 years ago

Woop, good to hear! v4.x is a big step forward.

Seeing this is likely less of an issue with 4.x, I'm going to close it out. Feel free to keep commenting if there's issues though!