Skip to content

Commit

Permalink
Deploying to gh-pages from @ d930998 🚀
Browse files Browse the repository at this point in the history
  • Loading branch information
benjag committed Mar 1, 2024
1 parent 62470be commit 1b0be20
Showing 1 changed file with 6 additions and 39 deletions.
45 changes: 6 additions & 39 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,9 @@ and a set of themes that build on this scaffolding. We started this project in 2
The project has evolved into what it is today, and will continue to grow to fit our expanding needs. Feel free to watch
the Cedar grow and learn from what we are doing, or jump in and provide some recommendations.

### Vue 3 Migration Status

Cedar has been fully migrated to Vue 3 using the composition API and is using [vite](https://vitejs.dev/) for its build system. Additionally, [vitest](https://vitest.dev/) is now being used as our testing framework.

## Using Cedar

See the [Cedar docs](https://rei.github.io/rei-cedar-docs/) for usage instructions.
See the [Cedar docs](https://cedar.rei.com) for usage instructions.

## Getting Started

Expand All @@ -31,12 +27,6 @@ Clone the project.

Runs locally for development. Has hot reloading, and other nice things related to development.

Sometimes the liveReload server will hang in the background, do the following...

Works on MacOS:

`kill -9 $(lsof -ti tcp:35729)`

## Testing

### Code Tests
Expand All @@ -45,40 +35,17 @@ Works on MacOS:

Runs unit tests.

`npm run watch`

Runs unit tests in watch mode. This also allows you to inspect snapshot discrepancies and regenerate the snapshots if appropriate.

`npm run e2e`

Runs [Nightwatch](http://nightwatchjs.org/) end-to-end tests and Axe a11y tests.

`npm run test`

Runs both unit and e2e/accesibility tests.

### Visual Regression Testing

> [!NOTE]
> this has been temporarily disabled due to Vue3 compatibility issues.
Check [backstop](https://github.com/garris/BackstopJS) for general configuration questions.

Our visual regressions audits can be performed against all patterns documented within the project's component proving grounds. To do so, follow the steps below:

1. Run the project locally with `npm run dev`
2. `npm run reference` will create a base set of images providing coverage for all defined patterns. Ensure this is run against a clean build prior to any edits.
3. `npm run compare` after making changes to the markup or css. This will create another set of test images and compare them against those generated in the previous step.
4. Review the generated report that should open in your browser. Make sure all changes are what you expect.
5. `npm run approve` if everything looks good. This will promote the latest test images to be the new reference images that future tests will be compared against.

If you want to do backstop tests against a single scenario you can do `npm run compare -- --filter=<Label>`

The config (`backstop.js`) looks through `src/` for all __*.backstop.js__ and generates a proper backstop scenario object for each.

__*.backstop.js__ files will export an array of objects that are standard backstop scenario objects and support all the same options noted in the docs with the following exceptions:

- `responsive`: Boolean, configures whether or not the scenario runs against all 4 breakpoints. If not present or false it will only run against the largest breakpoint. Note that running responsive tests against specific selectors can often lead to incorrect screenshots, and it is better to set up a separate responsive scenario that targets the entire document, for example: `{ url: 'http://localhost:3000/#/EXAMPLE', label: 'EXAMPLE', responsive: true }`
- `focusSelectors`: Array, list of selectors that will have `focus` applied before screenshotting
- `hoverSelectors`: Array, list of selectors that will have `hover` applied before screenshotting
- `wait`: Number, if using `focusSelectors` or `hoverSelectors` this will insert a delay in milliseconds between the element interaction and the screenshot

Runs both unit and e2e/accessibility tests.

## Publishing Prerelease Components

Expand Down

0 comments on commit 1b0be20

Please sign in to comment.