Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/aaronwatters/vite-lib-e2e
Test of e2e testing for a js library built using Vite.
https://github.com/aaronwatters/vite-lib-e2e
Last synced: about 1 month ago
JSON representation
Test of e2e testing for a js library built using Vite.
- Host: GitHub
- URL: https://github.com/aaronwatters/vite-lib-e2e
- Owner: AaronWatters
- License: bsd-2-clause
- Created: 2024-08-05T15:21:49.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-08-23T18:39:12.000Z (4 months ago)
- Last Synced: 2024-10-14T06:24:46.524Z (2 months ago)
- Language: JavaScript
- Homepage:
- Size: 13.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vite-lib-e2e
Test of e2e testing for a js library built using Vite.
The following link explains how to build a properly modularized
Javascript library using Vite
https://andrewwalpole.com/blog/use-vite-for-javascript-libraries/
but the presentation doesn't explain how to implement automated testing for the library.
This repository implements a Javascript library following the
pattern described in the link above and also adds unit tests with coverage
and end-to-end (e2e) tests (without coverage -- I gave up on that).
The implementation uses `vitest` for unit tests and `playwright` for e2e tests.
I hope this provides a useful working reference for adding testing
to Javascript libraries.
# Running the tests
After installing the package
```
npm install
```
Run the unit tests like this:
```
npm run test
```
And run the end-to-end tests (which make use of a headless browser) like this
```
npm run test:e2e
```
To run the unit tests and generate a coverage report:
```
npm run test:coverage
```
The full HTML coverage report will appear
in the `coverage` folder rooted at `coverage/index.html`.
# The files
Here is an explanation of some of the structure and content
of the repository:
```
./index.html -- An html file used to bootstrap e2e tests.
./LICENSE -- legaleze.
./dist/.. -- bundled library distributions.
./tests/unit/utils.test.js -- an example unit test suite.
./tests/e2e/example.spec.js -- an example e2e test suite.
./playwright.config.js -- Playwright configuration for e2e tests.
./vite.config.js -- vite configuration including vitest and coverage configuration.
./README.md -- this readme.
./package.json -- npm package config.
./lib/main.js -- library entry point.
./lib/utils.js -- library implementation code.
./test-results -- folder generated with unit test artifacts.
./coverage/.. -- folder generated with unit test coverage reports.
./coverage/index.html -- top level index for HTML coverage reports.
```
# The scripts
Here are some of the `npm` scripts defined for the project:
```
npm install # install the package.
npm run build # build the bundled distributions.
npm run dev # run the dev server (reloads automatically when files change)
npm run test # run unit tests (reloads automatically when files change)
npm run test:e2e # run e2e tests (no reload)
npm run test:coverage # run unit tests and generate coverage reports.
npm run preview # run the preview server using the production bundles.
```