Skip to content

Commit

Permalink
docs(): revise test section (fabricjs#9114)
Browse files Browse the repository at this point in the history
  • Loading branch information
@ShaMan123
ShaMan123 authored Jul 23, 2023
1 parent 73fa847 commit 1d3d80f
Show file tree
Hide file tree
Showing 3 changed files with 35 additions and 16 deletions.
9 changes: 9 additions & 0 deletions .github/ISSUE_TEMPLATE/config.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,15 @@ contact_links:
- name: GOTCHAS
url: http://fabricjs.com/fabric-gotchas
about: Refer to the list of known pitfalls before assuming a bug.
- name: Vanilla Demo
url: https://codesandbox.io/p/sandbox/fabric-vanillajs-sandbox-forked-e5r48u?file=%2FREADME.md
about: Vanilla demo.
- name: Next.js Demo
url: https://codesandbox.io/p/sandbox/fabric-nextjs-sandbox-forked-h6qdh3?file=%2FREADME.md
about: Next.js demo.
- name: Node Demo
url: https://codesandbox.io/p/sandbox/fabric-node-sandbox-forked-xewlhg?file=%2FREADME.md
about: Node demo.
- name: Security
url: ./Security.md
about: Please report security vulnerabilities here.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

## [next]

- docs(): revise test section [#9114](https://github.com/fabricjs/fabric.js/pull/9114)
- fix(): #8344 stroke projection [#8374](https://github.com/fabricjs/fabric.js/pull/8374)
- fix(Filters) Removing type from the options passed in the constructor [#9089](https://github.com/fabricjs/fabric.js/pull/9089)
- feat(InteractiveObject): add `getActiveControl()` to expose `__corner` [#9102](https://github.com/fabricjs/fabric.js/pull/9102)
Expand Down
41 changes: 25 additions & 16 deletions CONTRIBUTING.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,8 @@ Answering questions and addressing issues, as well as fixing and adding types (s

### 🎮 Adding a DEMO (currently not possible)

**New website is under construction. Contributions are welcome.**

Take a look at an existing [demo file][demo_file].\
Create a new file in the same directory (`posts/demos/_posts`) and follow [**developing the website**](#fabricjscom-deprecated).

Expand Down Expand Up @@ -104,11 +106,12 @@ Fabric is an open source project 🦄 and as such depends on the **genuine effor
Do not reorder imports. Irrelevant changes in a PR that are not created by prettier aren't needed nor welcome.
- **Tests** \
PRs must be backed with relevant tests, follow [TESTING](#-testing). If you never wrote a test or you find our tests unclear to extend, just ask for help.
Aim to cover 100% of the changes.
- **Docs** \
Add relevant comments to your code if necessary using [JSDoc 3][jsdoc] and update relevant guides.\
The generated documentation can be found at [fabricjs.com][docs], see [DOCS](#-improving-docs).
- **Changelog**\
Add a concise listing to the [**CHANGELOG**](CHANGELOG.md) describing what has changed.
Add a concise listing to the [**CHANGELOG**](CHANGELOG.md) describing what has changed or let github actions add the PR title for you.
- **1️⃣ PR per feature/bug** \
Create a new branch for every pull request.\
If you want to do more than one thing, create multiple pull requests 💪.
Expand All @@ -125,19 +128,33 @@ It is more than likely you will be requested to change stuff and refine your wor
[![🧪](../../actions/workflows/tests.yml/badge.svg)](../../actions/workflows/tests.yml)
[![CodeQL](../../actions/workflows/codeql-analysis.yml/badge.svg)](../../actions/workflows/codeql-analysis.yml)

Test suites use [`QUnit`][qunit] for assertions and [`testem`][testem] for serving the browser tests
| Suite | unit (node) | e2e (browser) |
| ------------------------------------------------------------------------ | :----------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Framework | [`jest`][jest] | [`playwright`][playwright] |
| Setup | | <pre>npm run build -- -f -w</pre> |
| Running Tests<br><br><br><br><br><pre>\<test cmd\> -- [filter] [watch]</pre> | <pre>npm run test:jest -- [filters] [-w]</pre><br><br><br>It is advised to use filters to save time.<br> | <pre>npm run test:e2e -- [filters] [--ui]</pre><br>In some machines babel is flaky and doesn't build the test files. In that is the case, try running the command using `npx` directly, see [`playwright.setup.ts`](./playwright.setup.ts). |
| Writing Tests | Add/update `src/*.(spec\|test).ts` files | - Update tests in `e2e/tests`<br>- Create a new test based on `e2e/template` |
| Test Gen | | <pre>npm start vanilla<br>npx playwright codegen http://localhost:1234</pre> |
| Test Spec | | - `index.ts`: built and loaded into the web app<br> - `index.spec.ts`: test spec<br> |
| Outputs | Snapshots next to the test file | - Snapshots next to the test file <br>- `e2e/test-report`<br>- `e2e/test-results` |

### Legacy Test Suite

We **discourage** writing new tests in the legacy suite and **encourage** migrating failing tests to the new suite.
However, it is not carved in stone.

The test suites use [`QUnit`][qunit] for assertions and [`testem`][testem] for serving the browser tests.

- `unit` tests: test logic and state
- `visual` tests: test visual outcome against image refs located at `test/visual/golden`
- `UI` tests: testing with playwright

### Getting Started
#### Getting Started

- Build and watch for changes
```bash
npm run build -- -f -w
```
- Run the entire test suite on `chrome` (many tests are skipped on `node`)
- Run the _legacy_ test suite on `chrome` (many tests are skipped on `node`)
```bash
npm test -- -a -c chrome
```
Expand Down Expand Up @@ -172,17 +189,7 @@ Test suites use [`QUnit`][qunit] for assertions and [`testem`][testem] for servi
npm test -- -h
```

## UI tests

Run UI tests with Playwright in parallel in Chrome (headed mode).

```bash
$ npm run test:e2e
```

### Adding Tests

Backing a PR with tests that cover the changes that were made is a **MUST**. Aim to cover 100% of the cases.
#### Adding Tests

Add tests to relevant files or add new files when necessary under `test/unit` or `test/visual`.

Expand Down Expand Up @@ -256,6 +263,8 @@ Don't forget to unlink the package once you're done.
[prettier_extension]: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
[eslint]: https://eslint.org/
[jsdoc]: https://jsdoc.app/
[playwright]: https://playwright.dev/
[jest]: https://jestjs.io/
[qunit]: https://qunitjs.com/
[testem]: https://github.com/testem/testem
[unit_test]: https://github.com/fabricjs/fabric.js/blob/93dd2dcca705a4b481fbc9982da4952ef5b4ed1d/test/unit/point.js#L227-L237
Expand Down

0 comments on commit 1d3d80f

Please sign in to comment.