As part of transition to Vue 3.0 and Vite (#230), this commit facilitates the shift towards building rest of the application using Vite. By doing so, it eliminates reliance on outdated Electron building system that offered limited control, blocking desktop builds (#233). Changes include: - Introduce Vite with Vue 2.0 plugin for test execution. - Remove `mocha`, `chai` and other related dependencies. - Adjust test to Vitest syntax. - Revise and update `tests.md` to document the changes. - Add `@modyfi/vite-plugin-yaml` plugin to be able to use yaml file depended logic on test files, replacing previous webpack behavior. - Fix failing tests that are revealed by Vitest due to unhandled errors and lack of assertments. - Remove the test that depends on Vue CLI populating `process.env`. - Use `jsdom` for unit test environment, adding it to dependency to `package.json` as project now depends on it and it was not specified even though `package-lock.json` included it.
3.8 KiB
3.8 KiB
Tests
There are different types of tests executed:
Unit and integration tests
- They utilize Vitest.
- Test files are suffixed with
.spec.ts.
Act, arrange, assert
- Tests implement the act, arrange, and assert (AAA) pattern.
- Arrange
- Sets up the test scenario and environment.
- Begins with comment line
// arrange.
- Act
- Executes the actual test.
- Begins with comment line
// act.
- Assert
- Sets an expectation for the test's outcome.
- Begins with comment line
// assert.
Unit tests
- Evaluate individual components in isolation.
- Located in
./tests/unit. - Achieve isolation using stubs.
- Include Vue component tests, enabled by
@vue/test-utils.
Unit tests naming
- Test suites start with a description of the component or system under test.
- E.g., tests for
Application.tsare contained inApplication.spec.ts.
- E.g., tests for
- Whenever possible,
describeblocks group tests of the same function.- E.g., tests for
run()are insidedescribe('run', () => ...).
- E.g., tests for
Integration tests
- Assess the combined functionality of components.
- They verify that third-party dependencies function as anticipated.
E2E tests
- Examine the live web application's functionality and performance.
- Configured with the Vue CLI plugin
e2e-cypress.
Automated checks
These checks validate various qualities like runtime execution, building process, security testing, etc.
- Use various tools and scripts.
- Are automatically executed as GitHub workflows.
Tests structure
package.json: Defines test commands and includes tools used in tests.vite.config.ts: Configuresvitestfor unit and integration tests../src/: Contains the source code subject to testing../tests/bootstrap/setup.ts: Initializes tests../tests/unit/- Stores unit test code.
- The directory structure mirrors
./src/.- E.g., tests for
./src/application/ApplicationFactory.tsreside in./tests/unit/application/ApplicationFactory.spec.ts.
- E.g., tests for
shared/- Contains shared unit test functionalities.
Assertions/: Contains common assertion functions, prefixed withexpect.TestCases/- Shared test cases.
- Functions that calls
it()from Vitest should haveitprefix.
Stubs/: Maintains stubs for component isolation, equipped with basic functionalities and, when necessary, spying or mocking capabilities.
./tests/integration/: Contains integration test files../tests/e2e/cypress.config.ts: Cypress configuration file../tests/e2e/: Base Cypress folder./specs/: Test files named with.spec.jsextension./plugins/index.js: Plugin file executed before loading project./support/index.js: Support file, runs before every single spec file.- (Ignored)
/videos: Asset folder for videos taken during tests. - (Ignored)
/screenshots: Asset folder for Screenshots taken during tests.