Website

Upstand FM landing page.

• Parcel bundler
• Tests
• CI/CD

Parcel bundler

This project uses Parcel to bundle all assets.

• Available scripts
• Code formatting

Available scripts

In the project directory, you can run:

npm start

Runs the website in development mode.
Open http://localhost:1234 to view it in the browser.

The page will reload if you make edits.

npm run build

Builds the website for production to the build folder.
It correctly bundles and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.

npm run cy

Runs end-to-end tests locally using Cypress.

Caveats:

• The local dev server must be running (use npm start), before the end-to-end tests can run.
• The watch-and-reload plugin is used to rerun tests on source code change. But according to this issue, this functionality will be native in the future. When that's the case, remove the plugin.

Code formatting

Code is automatically formatted on commit with Prettier.

Tests

Integration & end-to-end

Cypress is used to run integration- & end-to-end tests, and records them.

The recorded test runs can be viewed here. The logs are public, but you need a Cypress account view them.. 🤣

Test files can be found in /cypress/integration.

CI/CD

CircleCI is used to:

• Run integration/end-to-end tests (Cypress).
• Build the website.
• Deploy the website via Netlify:
  • Preview the website when pushing a branch.
  • Release to prod when pushing to master.

Testing

CircleCI requires a Cypress token to record tests and store screenshots.

The token can be found in the Cypress dashboard under "Record Keys". It is configured in CircleCI as an environment variable named CYPRESS_RECORD_KEY, and used in the .circleci/config.yml file.

Netlify

CircleCI requires a Netlify access token, site ID and publish directory to deploy the built files. These are configured as environment variables:

Token

The Netlify access token can be found in the 1Password "Upstand FM" vault under "Netlify access token for CircleCI".

The token is configured in CircleCI as an environment variable named NETLIFY_ACCESS_TOKEN.

Site ID

The site ID is configured as an env var named NETLIFY_SITE_ID.
Its value can be found in upstand-fm-website/settings.

Note that the Netlify site ID is named "API ID" in the Netlify web app. And can be found under Settings > General > Site Details > Site Information.

Publish directory

The publish directory is configured as an env var named NETLIFY_PUBLISH_DIR.
The publish directory is named build, and is created after running the command npm run build. This directory contains the files that Netlify must deploy.