The Bloom Works employee handbook, with our policies and norms.
This requires Docker to be installed and running
- Build the container:
docker build -t bloom-works/handbook .
- Start the server:
docker run -it --rm -p "8080:8080" bloom-works/handbook
- View the site in your browser at http://localhost:8080
This sets up the site with a consistent runtime environment, and requires Docker to be installed and running.
- Navigate to the base of this repo
- Build the container:
docker build -t bloom-works/handbook .
- Start a terminal inside the container:
docker run -it --rm -p "8080:8080" -v "$PWD:/app" bloom-works/handbook bash
- Install dependencies (first time only or when
package.json
changes):npm install
- Start server:
npm run serve
- View the site in your browser at http://localhost:8080
From here, changes to files locally will rebuild the site.
This uses whatever NPM and Node version you have installed on your machine, and might use fewer system resources than the Docker install (i.e. better for lower powered machines). If something is not working using this setup, use the Docker version to see if the problem exists there.
- Navigate to the base of this repo
- Install dependencies (first time only or when
package.json
changes):npm install
- Start server:
npm run serve
- View the site in your browser at http://localhost:8080
From here, changes to files will rebuild the site.
To add a new section to the site:
- Add a new Markdown file to the
sections
folder (example:sections/my-new-section.md
) - At the top of the file, add two lines with
---
and between those two lines put:layout: layouts/section
title: My New Section's Title
- Add content below the second
---
- Add the base of the file name into the
_data/table_of_contents.json
file in the desired order. For example, if you section is calledsuper-important.md
, then you would add the"super-important"
(no.md
) into the_data/table_of_contents.json
.
Feel free to look at any of the existing sections as a starting point.
If you need to embed an image in a Handbook page, put the image file in the /img
folder. The resulting URL pattern will be: /img/FILENAME.suffix
.
- Navigate to the base of this repo
- Run
sh ./ci/linter.sh
CSS -- Stylelint Docs
- If there are errors,
npx stylelint --fix "**/*.css"
will perform a dry-run of fixing all errors and those errors will not be saved. Thennpx eslint --ext .js --fix [file or directory here]
will fix and save all errors.
JS -- ESLint Docs
- If there are errors,
npx eslint --ext .js --fix-dry-run [file or directory here]
will perform a dry-run of fixing all errors and those errors will not be saved. Thennpx eslint --ext .js --fix [file or directory here]
will fix and save all errors.
Nunjucks -- djLint Docs
- From the base of this repo run
djlint ./ -e .njk --profile=nunjucks
to only run djlint. Manually fix errors.
We are using Playwright Tests to accomodate our testing needs for this project on destop and mobile.
- From the base of this repo run
npx playwright test
for the command line output ornpx playwright test --ui
to open the tests in UI mode.
We are using Cypress and Axe core as our testing framework and engine for our accessibility tests.
- Start your local server and make sure it's running at http://localhost:8080
- Navigate to the base of this repo and run
npx cypress run
for tests to execute in the command line. To execute tests in Cypress' UI window, runnpx cypress open
and select E2E testing. - We have added functionality that will print an error table in the command line on test execution. This table includes the name and description of the error along with a
helpUrl
containing a URL where more information on how to fix that particular error can be found. Additionally, you can visit the official axe-core rules github to view the different axe-core rule descriptions. - Cypress captures snapshots at the time of test execution, these can be viewed by navigating to the
cypress/screenshots
folder.
- During local development, it is important to restart your server if you're making code or package changes while http://localhost:8080 is still running. This will ensure the Cypress tests are running and passing correctly in your local environment.
- If you are running Cypress tests in Docker and/or on a virtual machine, there are additional dependencies you will need to install depending on what type of environment you have.
- If you are running Docker on your machine and get an error that
Cypress is not installed
and that it cannot find the cypress file at/root/.cache/Cypress/12.17.1/Cypress
, this could be a permissions issue and you would runnode_modules/.bin/cypress install
inside of the Docker container to install Cypress.