[CI][FRONT] Storybook tests sharding (#9448)

# Introduction
The idea here is to improve perf nor fluidity of both storybook build
and tests execution duration.

## Levers:
- Storybook tests
[shards](https://storybook.js.org/docs/writing-tests/test-runner)
- Refactored storybook's build caching using `actions/cache/restore` and
`actions/cache/save` to avoid useless computation with we wanna just
write or retrieve it
- Running storybook build with --test
[flag](https://storybook.js.org/docs/api/main-config/main-config-build)
( please note that we only disable docs addons in order to keep coverage
up and running )

closes https://github.com/twentyhq/core-team-issues/issues/49
This commit is contained in:
Paul Rastoin
2025-01-10 18:40:03 +01:00
committed by GitHub
parent b40f58a512
commit 873f20bc0e
3 changed files with 101 additions and 46 deletions

19
nx.json
View File

@ -116,7 +116,7 @@
"outputs": ["{projectRoot}/{options.output-dir}"],
"options": {
"cwd": "{projectRoot}",
"command": "VITE_DISABLE_TYPESCRIPT_CHECKER=true VITE_DISABLE_ESLINT_CHECKER=true storybook build",
"command": "VITE_DISABLE_TYPESCRIPT_CHECKER=true VITE_DISABLE_ESLINT_CHECKER=true storybook build --test",
"output-dir": "storybook-static",
"config-dir": ".storybook"
},
@ -152,12 +152,14 @@
"options": {
"cwd": "{projectRoot}",
"commands": [
"test-storybook --url http://localhost:{args.port} --maxWorkers=3 --coverage --coverageDirectory={args.coverageDir}",
"nx storybook:coverage {projectName} --coverageDir={args.coverageDir}"
"test-storybook --url http://localhost:{args.port} --maxWorkers=3 --coverage --coverageDirectory={args.coverageDir} --shard={args.shard}",
"nx storybook:coverage {projectName} --coverageDir={args.coverageDir} --checkCoverage={args.checkCoverage}"
],
"shard": "1/1",
"parallel": false,
"coverageDir": "coverage/storybook",
"port": 6006
"port": 6006,
"checkCoverage": true
}
},
"storybook:test:no-coverage": {
@ -184,9 +186,10 @@
"!{projectRoot}/coverage/storybook/coverage-storybook.json"
],
"options": {
"command": "npx nyc report --reporter={args.reporter} --reporter=text-summary -t {args.coverageDir} --report-dir {args.coverageDir} --check-coverage --cwd={projectRoot}",
"command": "npx nyc report --reporter={args.reporter} --reporter=text-summary -t {args.coverageDir} --report-dir {args.coverageDir} --check-coverage={args.checkCoverage} --cwd={projectRoot}",
"coverageDir": "coverage/storybook",
"reporter": "lcov"
"reporter": "lcov",
"checkCoverage": true
},
"configurations": {
"text": { "reporter": "text" }
@ -196,8 +199,10 @@
"executor": "nx:run-commands",
"options": {
"commands": [
"npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:serve:static {projectName} --port={args.port} --configuration={args.performance}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --port={args.port} --configuration={args.scope}'"
"npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:serve:static {projectName} --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --shard={args.shard} --checkCoverage={args.checkCoverage} --port={args.port} --configuration={args.scope}'"
],
"shard": "1/1",
"checkCoverage": true,
"port": 6006
}
},