Merge pull request #8934 from storybookjs/storyshot-puppeteer-general…

…isation Feature: use storyshot-puppeteer for things other than image snapshots
storybookjs · Nov 28, 2019 · 39388b1 · 39388b1
2 parents 8561e7b + 2b41cb5
commit 39388b1
Show file tree

Hide file tree

Showing 33 changed files with 594 additions and 316 deletions.
diff --git a/.github/workflows/tests-puppeteer.yml b/.github/workflows/tests-puppeteer.yml
@@ -0,0 +1,32 @@
+name: Puppeteer & A11y tests
+
+on: [push]
+
+jobs:
+  build:
+
+    name: Puppeteer & A11y tests
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/setup-node@v1
+      with:
+        node-version: '10.x'
+    - uses: actions/checkout@v1
+    - name: Cache node modules
+      uses: actions/cache@v1
+      with:
+        path: node_modules
+        key: ${{ runner.OS }}-build-${{ hashFiles('**/yarn.lock') }}
+        restore-keys: |
+          ${{ runner.OS }}-build-${{ env.cache-name }}-
+          ${{ runner.OS }}-build-
+          ${{ runner.OS }}-
+    - name: install, bootstrap
+      run: |
+        yarn bootstrap --core
+    - name: build storybook
+      run: |
+        yarn --cwd examples/official-storybook build-storybook
+    - name: test
+      run: |
+        yarn test --puppeteer
diff --git a/addons/a11y/README.md b/addons/a11y/README.md
@@ -47,6 +47,8 @@ export const inaccessible = () => (
 );
 ```
 
+## Parameters
+
 For more customizability use parameters to configure [aXe options](https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#api-name-axeconfigure).
 You can override these options [at story level too](https://storybook.js.org/docs/configurations/options-parameter/#per-story-options).
 

diff --git a/addons/a11y/src/components/__snapshots__/A11YPanel.test.js.snap b/addons/a11y/src/components/__snapshots__/A11YPanel.test.js.snap
@@ -952,6 +952,11 @@ exports[`A11YPanel should render report 1`] = `
         >
           <l
             className="emotion-0"
+            scrollableNodeProps={
+              Object {
+                "tabIndex": 0,
+              }
+            }
           >
             <div
               className="emotion-0"
@@ -975,6 +980,7 @@ exports[`A11YPanel should render report 1`] = `
                   >
                     <div
                       className="simplebar-content-wrapper"
+                      tabIndex={0}
                     >
                       <div
                         className="simplebar-content"

diff --git a/addons/info/src/__snapshots__/index.test.js.snap b/addons/info/src/__snapshots__/index.test.js.snap
@@ -2627,6 +2627,11 @@ exports[`addon Info should render component description if story kind matches co
                           >
                             <l
                               className="emotion-2"
+                              scrollableNodeProps={
+                                Object {
+                                  "tabIndex": 0,
+                                }
+                              }
                             >
                               <div
                                 className="emotion-2"
@@ -2650,6 +2655,7 @@ exports[`addon Info should render component description if story kind matches co
                                     >
                                       <div
                                         className="simplebar-content-wrapper"
+                                        tabIndex={0}
                                       >
                                         <div
                                           className="simplebar-content"
@@ -4412,6 +4418,11 @@ exports[`addon Info should render component description if story kind matches co
                           >
                             <l
                               className="emotion-2"
+                              scrollableNodeProps={
+                                Object {
+                                  "tabIndex": 0,
+                                }
+                              }
                             >
                               <div
                                 className="emotion-2"
@@ -4435,6 +4446,7 @@ exports[`addon Info should render component description if story kind matches co
                                     >
                                       <div
                                         className="simplebar-content-wrapper"
+                                        tabIndex={0}
                                       >
                                         <div
                                           className="simplebar-content"
@@ -7416,6 +7428,11 @@ exports[`addon Info should render component description if story name matches co
                           >
                             <l
                               className="emotion-2"
+                              scrollableNodeProps={
+                                Object {
+                                  "tabIndex": 0,
+                                }
+                              }
                             >
                               <div
                                 className="emotion-2"
@@ -7439,6 +7456,7 @@ exports[`addon Info should render component description if story name matches co
                                     >
                                       <div
                                         className="simplebar-content-wrapper"
+                                        tabIndex={0}
                                       >
                                         <div
                                           className="simplebar-content"
@@ -9429,6 +9447,11 @@ exports[`addon Info should render component description if story name matches co
                           >
                             <l
                               className="emotion-2"
+                              scrollableNodeProps={
+                                Object {
+                                  "tabIndex": 0,
+                                }
+                              }
                             >
                               <div
                                 className="emotion-2"
@@ -9452,6 +9475,7 @@ exports[`addon Info should render component description if story name matches co
                                     >
                                       <div
                                         className="simplebar-content-wrapper"
+                                        tabIndex={0}
                                       >
                                         <div
                                           className="simplebar-content"

diff --git a/addons/storyshots/README.md b/addons/storyshots/README.md
@@ -1,4 +1,4 @@
 # StoryShots
 
 - [addon-storyshots](storyshots-core) - Basic StoryShots api
-- [addon-storyshots-puppeteer](storyshots-puppeteer) - Image Snapshots addition to StoryShots based on [puppeteer](https://github.com/GoogleChrome/puppeteer)
+- [addon-storyshots-puppeteer](storyshots-puppeteer) - Integration of StoryShots with [puppeteer](https://github.com/GoogleChrome/puppeteer)