Merge release/1.32.3 into main branch (#688)

* update build schedule for Chromatic (#681) * Remove percy and cypress (#682) * chromatic build change on push develop (#686) * add ToggleInput (#672)
user-interviews · Jul 29, 2022 · a3e81b0 · a3e81b0
1 parent 5777eff
commit a3e81b0
Show file tree

Hide file tree

Showing 44 changed files with 517 additions and 3,294 deletions.
diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
@@ -1,10 +1,13 @@
 # .github/workflows/chromatic.yml
 
 # Workflow name
-name: 'Chromatic'
+name: 'Chromatic build on develop'
 
 # Event for the workflow
-on: push
+on:
+  push:
+    branches:
+      - develop
 
 # List of jobs
 jobs:

diff --git a/.github/workflows/percy-nightly-tests.yml b/.github/workflows/percy-nightly-tests.yml
diff --git a/README.md b/README.md
@@ -121,15 +121,6 @@ Runs the jest test suite
 ### `yarn lint`
 
 Runs ESLint to report on any style violations
-### Visual testing
-
-  1. Join BrowserStack (ask Brian for link)
-  1. Navigate to this project in percy [here](https://percy.io/f38ae9b9/ui-design-system)
-  1. Define `PERCY_TOKEN` in shell (the one from ui-design-system project)
-  1. `npx percy exec -- cypress run`
-  1. View results in percy.io / console
-
-> Note- we are on the free plan (5k images/month) so be mindful of the limit
 
 ### `yarn rs:link`
 
@@ -142,18 +133,18 @@ Trigger a production build when files are changed.
 ### `yarn rs:unlink`
 
 Remove symlinked packages.
-### Visual testing
 
-  1. Join BrowserStack team (ask Brian/Bob for link)
-  1. Navigate to this project in [Percy](https://percy.io/f38ae9b9/ui-design-system)
+## Chromatic visual testing & live feedback
+We use [Chromatic](https://www.chromatic.com/) for visual testing and gathering UI feedback. 
+
+To join Chromatic for 'ui-design-system', ask Jason for the join link.
 
-  ## Local setup
-  1. Define `PERCY_TOKEN` ENV (the one from ui-design-system project found above)
-  1. Run `yarn storybook` in one tab
-  1. Run `npx percy exec -- cypress run` in another
-  1. View results in percy.io & console
+If you are a Product Designer or wanting to view changes on a particular feature branch, a developer can provide a link to that specific Chromatic build. 
 
-> Note- we are running this once a day via github actions.
+If you are a Developer and want to trigger a Chromatic build,
+  1. Join Chromatic for the 'ui-design-system' (ask Jason for the join link).
+  2. Go to the Manage tab for 'ui-design-system' > Configure > Find the project token.
+  3. In your terminal, run `npx chromatic --project-token <projectToken>`. Use this command when you want to create a build and share with a stakeholder to gather UI feedback. You will be able to find the build on the Chromatic builds dashboard. We currently run automatic nightly builds for Chromatic via Github Actions. 
 
 ## Pull requests
 

diff --git a/cypress.json b/cypress.json
diff --git a/cypress/integration/accordion_spec.js b/cypress/integration/accordion_spec.js
diff --git a/cypress/integration/alert_spec.js b/cypress/integration/alert_spec.js
diff --git a/cypress/integration/avatar_spec.js b/cypress/integration/avatar_spec.js
diff --git a/cypress/integration/button_spec.js b/cypress/integration/button_spec.js
diff --git a/cypress/integration/card_spec.js b/cypress/integration/card_spec.js
diff --git a/cypress/integration/checkbox_button_spec.js b/cypress/integration/checkbox_button_spec.js
diff --git a/cypress/integration/copy_to_clipboard_button_spec.js b/cypress/integration/copy_to_clipboard_button_spec.js
diff --git a/cypress/integration/copy_to_clipboard_spec.js b/cypress/integration/copy_to_clipboard_spec.js
diff --git a/cypress/integration/dropdown_spec.js b/cypress/integration/dropdown_spec.js