Merge pull request #67 from happo/fix-storybook-v5

Add linting and fix issues

.eslintignore

@@ -0,0 +1 @@
+register.js

.eslintrc.js

@@ -0,0 +1,17 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  extends: ['eslint:recommended', 'plugin:react/recommended'],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 13,
+    sourceType: 'module',
+  },
+  plugins: ['react'],
+  rules: {},
+};

.github/workflows/test.yml

@@ -26,4 +26,5 @@ jobs:
         node-version: 14
     - run: yarn install --frozen-lockfile
     - run: yarn add @storybook/addons@${{ matrix.storybook-version }} @storybook/react@${{ matrix.storybook-version }} && rm -rf node_modules && yarn install && yarn build && yarn happo run
+    - run: yarn lint
     - run: HAPPO_USE_PREBUILT_PACKAGE=yes yarn build-storybook && yarn happo run

package.json

@@ -4,6 +4,7 @@
   "description": "A happo.io plugin for projects using Storybook",
   "main": "index.js",
   "scripts": {
+    "lint": "eslint .",
     "test": "jest",
     "happo": "happo",
     "build": "babel register.es6.js --out-file register.js",
@@ -50,6 +51,8 @@
     "@storybook/addons": "^6.0.13",
     "@storybook/react": "^6.0.13",
     "babel-loader": "^8.0.5",
+    "eslint": "^8.6.0",
+    "eslint-plugin-react": "^7.28.0",
     "file-loader": "^3.0.1",
     "happo.io": "^5.1.3",
     "raw-loader": "^1.0.0",

register.es6.js

@@ -39,7 +39,7 @@ async function waitForWaitFor(waitFor, start = time.originalDateNow()) {
 }
 
 function getExamples() {
-  const storyStore = __STORYBOOK_CLIENT_API__._storyStore;
+  const storyStore = window.__STORYBOOK_CLIENT_API__._storyStore;
   if (storyStore.extract) {
     return Object.values(storyStore.extract())
       .map(({ id, kind, story, parameters }) => {
@@ -77,14 +77,16 @@ function getExamples() {
 
   const result = [];
 
-  for (let story of __STORYBOOK_CLIENT_API__.getStorybook()) {
+  for (let story of window.__STORYBOOK_CLIENT_API__.getStorybook()) {
     const component = story.kind;
     for (let example of story.stories) {
       const { name: variant } = example;
       let delay = defaultDelay;
       let waitForContent;
       let waitFor;
       let targets;
+      let beforeScreenshot;
+      let afterScreenshot;
       if (storyStore.getStoryAndParameters) {
         const { parameters } = storyStore.getStoryAndParameters(
           story.kind,
@@ -185,7 +187,7 @@ window.happo.nextExample = async () => {
         console.error('Failed to invoke afterScreenshot hook', e);
       }
     }
-    __STORYBOOK_ADDONS_CHANNEL__.emit('setCurrentStory', {
+    window.__STORYBOOK_ADDONS_CHANNEL__.emit('setCurrentStory', {
       kind: component,
       story: variant,
       storyId,
@@ -195,7 +197,7 @@ window.happo.nextExample = async () => {
     if (/sb-show-errordisplay/.test(document.body.className)) {
       // It's possible that the error is from unmounting the previous story. We
       // can try re-rendering in this case.
-      __STORYBOOK_ADDONS_CHANNEL__.emit('forceReRender');
+      window.__STORYBOOK_ADDONS_CHANNEL__.emit('forceReRender');
       await waitForSomeContent(rootElement);
     }
     await new Promise(resolve => time.originalSetTimeout(resolve, delay));