Console Frontend

The Frontend for manage.crossref.org, which houses our greenfield user interface. Built with Vue.js, using the Vuetify UI library.

Targetted Browsers

We support browsers that implement the es2022 JavaScript standard. See decision record DR-0455: Browser version support.

Coding Style

Code should be written in typescript and should adhere to the Prettier Style Guide with automatic formatting done by Prettier. The default ESLint config in the repo does this out of the box.

If existing Javascript code or libraries need to be used, they should at least have strongly typed interfaces.

Vue components should be built as Single File Components.

The frontend is compiled using Vite, with a build target of es2022. This means you can use new language features, and ones that aren’t supported will be transpiled on build.

Linting

Code is linted with ESLint, using the .eslintrc config in the repo.

Testing

Unit tests should be written for Vitest.

Intergration and component tests should be written with Playwright.

Mocking endpoints

Under unit test, use Vitest’s mocking functionality.

Under integration & component tests, use Playwright’s mocking functions.

Under live local develpment, use Mock Service Worker.

Environment-specific configuration

Environment config is parsed with env.ts which takes into account injected from the environment or .env.