From fd76b206a91bca0e3b8e9dc4a4a74f7a35848b4e Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 18 Oct 2023 17:44:20 +0200 Subject: [PATCH] remove docs and dependencies of storyshots --- code/package.json | 1 - code/yarn.lock | 70 +---------- docs/toc.js | 5 - docs/writing-tests/snapshot-test.png | Bin 14131 -> 0 bytes docs/writing-tests/snapshot-testing.md | 168 ------------------------- scripts/package.json | 1 - scripts/yarn.lock | 81 +----------- 7 files changed, 2 insertions(+), 324 deletions(-) delete mode 100644 docs/writing-tests/snapshot-test.png delete mode 100644 docs/writing-tests/snapshot-testing.md diff --git a/code/package.json b/code/package.json index 45dbc0513fa2..6364b6eb3220 100644 --- a/code/package.json +++ b/code/package.json @@ -235,7 +235,6 @@ "husky": "^4.3.7", "jest": "^29.5.0", "jest-environment-jsdom": "^29.5.0", - "jest-image-snapshot": "^6.0.0", "jest-junit": "^16.0.0", "jest-os-detection": "^1.3.1", "jest-serializer-html": "^7.1.0", diff --git a/code/yarn.lock b/code/yarn.lock index 7b0995c2621c..b7ac09c53d66 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -7295,7 +7295,6 @@ __metadata: husky: ^4.3.7 jest: ^29.5.0 jest-environment-jsdom: ^29.5.0 - jest-image-snapshot: ^6.0.0 jest-junit: ^16.0.0 jest-os-detection: ^1.3.1 jest-serializer-html: ^7.1.0 @@ -16963,13 +16962,6 @@ __metadata: languageName: node linkType: hard -"get-stdin@npm:^5.0.1": - version: 5.0.1 - resolution: "get-stdin@npm:5.0.1" - checksum: 309f933f08a4d6783681674451027802299124e596324cd628c5e5138bbc5de843bbaa345a8ce0fc72304869f9de3b50086407aca551e292b13f7cb02351479e - languageName: node - linkType: hard - "get-stdin@npm:^6.0.0": version: 6.0.0 resolution: "get-stdin@npm:6.0.0" @@ -17353,13 +17345,6 @@ __metadata: languageName: node linkType: hard -"glur@npm:^1.1.2": - version: 1.1.2 - resolution: "glur@npm:1.1.2" - checksum: 756fcbc7f1a8576755811e31367feeaffbd13b7f20d788672bccbd65956839065e256621a7576f4ab321352b28a0aea442d64567bca23882526b891767ffbe3e - languageName: node - linkType: hard - "google-auth-library@npm:^7.14.0": version: 7.14.1 resolution: "google-auth-library@npm:7.14.1" @@ -19578,27 +19563,6 @@ __metadata: languageName: node linkType: hard -"jest-image-snapshot@npm:^6.0.0": - version: 6.2.0 - resolution: "jest-image-snapshot@npm:6.2.0" - dependencies: - chalk: ^4.0.0 - get-stdin: ^5.0.1 - glur: ^1.1.2 - lodash: ^4.17.4 - pixelmatch: ^5.1.0 - pngjs: ^3.4.0 - rimraf: ^2.6.2 - ssim.js: ^3.1.1 - peerDependencies: - jest: ">=20 <=29" - peerDependenciesMeta: - jest: - optional: true - checksum: 62e415f86f2bed30fe126520519014beed61a38a678285de44c6544d10eed7381b28958d3406f131a60c05715f42ab7bf7ea4ecfdab4f55946cec6739de23924 - languageName: node - linkType: hard - "jest-junit@npm:^16.0.0": version: 16.0.0 resolution: "jest-junit@npm:16.0.0" @@ -21155,7 +21119,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4, lodash@npm:^4.7.0": +"lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.7.0": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: d8cbea072bb08655bb4c989da418994b073a608dffa608b09ac04b43a791b12aeae7cd7ad919aa4c925f33b48490b5cfe6c1f71d827956071dae2e7bb3a6b74c @@ -24790,17 +24754,6 @@ __metadata: languageName: node linkType: hard -"pixelmatch@npm:^5.1.0": - version: 5.3.0 - resolution: "pixelmatch@npm:5.3.0" - dependencies: - pngjs: ^6.0.0 - bin: - pixelmatch: bin/pixelmatch - checksum: 30850661db29b57cefbe6cf36e930b7517aea4e0ed129e85fcc8ec04a7e6e7648a822a972f8e01d2d3db268ca3c735555caf6b8099a164d8b64d105986d682d2 - languageName: node - linkType: hard - "pkg-dir@npm:^3.0.0": version: 3.0.0 resolution: "pkg-dir@npm:3.0.0" @@ -24882,20 +24835,6 @@ __metadata: languageName: node linkType: hard -"pngjs@npm:^3.4.0": - version: 3.4.0 - resolution: "pngjs@npm:3.4.0" - checksum: 88ee73e2ad3f736e0b2573722309eb80bd2aa28916f0862379b4fd0f904751b4f61bb6bd1ecd7d4242d331f2b5c28c13309dd4b7d89a9b78306e35122fdc5011 - languageName: node - linkType: hard - -"pngjs@npm:^6.0.0": - version: 6.0.0 - resolution: "pngjs@npm:6.0.0" - checksum: ac23ea329b1881d1a10575aff58116dc27b894ec3f5b84ba15c7f527d21e609fbce7ba16d48f8ccb86c7ce45ceed622472765476ab2875949d4bec55e153f87a - languageName: node - linkType: hard - "pnp-webpack-plugin@npm:^1.7.0": version: 1.7.0 resolution: "pnp-webpack-plugin@npm:1.7.0" @@ -28345,13 +28284,6 @@ __metadata: languageName: node linkType: hard -"ssim.js@npm:^3.1.1": - version: 3.5.0 - resolution: "ssim.js@npm:3.5.0" - checksum: 9e7101da17395d3acbd417aac712d8f156522e79059a27cb38882eedd5a8868e31871c8f58bec3a150f8cf0660883cf22310cbd2fd63b408c1fd0ab02fda9fbc - languageName: node - linkType: hard - "ssri@npm:9.0.1, ssri@npm:^9.0.0": version: 9.0.1 resolution: "ssri@npm:9.0.1" diff --git a/docs/toc.js b/docs/toc.js index 9c773a493244..ebc0a878eccb 100644 --- a/docs/toc.js +++ b/docs/toc.js @@ -168,11 +168,6 @@ module.exports = { title: 'Test coverage', type: 'link', }, - { - pathSegment: 'snapshot-testing', - title: 'Snapshot tests', - type: 'link', - }, { pathSegment: '', title: 'Import stories in tests', diff --git a/docs/writing-tests/snapshot-test.png b/docs/writing-tests/snapshot-test.png deleted file mode 100644 index 5446154fccc420f2f0a2e695f82a858f9241cbff..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 14131 zcmb_@WmFqc&}e`{akt`bf#4K}Vl7gjP&~L3EKsbJ;uhT9ODTm0r@@O`3lx`P2@b_6 zUS9fr-#Jgu`|-}pId^wvc4qF(+?l)g?rvgrwVxB=)8PXE03!7lDtZ6_78n4)WWmKk zQ$AK_UjYCZ)4E!(Rnh4GzVWyN3a^q3zW9vr%4nP?@F z67q$BY9K=&8h>D}&=>vlV3w{N6o`b? zYU^s*LL38gvOY*M2xX)eL)}80?EEcEJ@RrshP_WReC3pyRH!U(937snsb={;FkW6t zzaa0Ewz~DQI-8A!x4MeCgs_$s7+P9X?e6lPky`wXXSkh}4?nlE+A~vLc12ERxroq| zmoKcuKpGATrCu347-7L=$6c8tABB9I->QiEGYw0nsl96K+yg2`3m?y29Af@E_6euIc z!7qBI!?JES4^mv|;@lPGb$L&@p+G)vVX+|Yx_`q=`bJM%9}5Eq zpNO24ik2bgd|skEjml`?8~_metFH3wwg2M5{Lh!{!jw@z+axwZAKAD)uC%>9f{J3k@Z$umaGD_X+|#y1~#ZB!-NC+k&WcX@H`_0kjb;9u-4Kg!?$up ziP%?fWD6|yzruGKGfqd#0Y)G}DW5%A9hk76%rHLT_{IB=Z%qD*pJPO4uUZgS|d{&`ZE0hT2>RO@s9@`j|_wr^*$O4 zvxk=7qDGKm7GM*wE(}dYhPkvMl)%SMU{(+*%|RBTn4ISO{}Nd5feVjp%(e@5=sn}d zZ|<=Ke;d3Xb!Rew%;Atd9=}^bJKg-F|4qdCOCZz zxwu(!>+@lf#}b)w!C2I2GG$Z_>9w2T0>(W?yu2P3Z~ryDfs1+3>6=DHdw<-FyrJ&& z*yyRy{d>&y5T^6|f+$4LgBAY#Y?e+)=M+;TVuREjMx$Qgl*WyCc~l>h)n-G7@zxT8 z+$)lyn0v1KKA;LpWHveh6-VH+7#=K$!9`8DP2OsRh z;H%MTA0FKMOed!+IPNY8*B!}?NUWOn#E@NoYXy#TWl)Y^`*SV>LQ%K(BbeSKK0NyS zzNVpsIYj4TKX1@S`t0!hV9S))Ml2=!+eF_L4EgtXmrHQde!swk0hr3jPa;fO>a zb6kRA{D6(E;)*qG!D-vDp1(KdV%q$PiFE*BT~DbgEPS46R;2t`$dvp!Hbj=Vj&!MK z_LVb~K%jRta%hFNF~!)Gt!TwLF}nEofXzz@n-M(sY`rY{#&cH&q`z;+xhIYQa9xR4 zq>#vBi7Qx5Ac5X2fjFFc4r?t*C)Dzm#z@RL)+B~?6#uvBB6;I_3}NbHCpWs9Q5UDNus*Zx484{4LirrB2C?JHFCu7p)fmx@t=jzPb%#_%49BMOpW9;qOT7` zV@l|nG%!c#0^X_i%SGrpYLY#Dr&g5JU#Dta}5l~ zNWry$RiyO�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 diff --git a/docs/writing-tests/snapshot-testing.md b/docs/writing-tests/snapshot-testing.md deleted file mode 100644 index 69b0c17c680a..000000000000 --- a/docs/writing-tests/snapshot-testing.md +++ /dev/null @@ -1,168 +0,0 @@ ---- -title: 'Snapshot tests' ---- - -Snapshot tests compare the rendered markup of every story against known baselines. It’s a way to identify markup changes that trigger rendering errors and warnings. - -Storybook is a helpful tool for snapshot testing because every story is essentially a test specification. Any time you write or update a story, you get a snapshot test for free. - -![Example Snapshot test](./snapshot-test.png) - -## Set up test runner - -Storybook test runner turns all of your stories into executable tests. It is powered by [Jest](https://jestjs.io/) and [Playwright](https://playwright.dev/). - -Follow the [setup instructions](./test-runner#setup) to install and run the test runner. - -Then, you can use the [test hook API](./test-runner#test-hook-api-experimental) to snapshot the HTML of each story: - - - - - - - -When running in [index.json mode](./test-runner#indexjson-mode), tests are generated in a temporary folder and snapshots get stored alongside them. You will need to [`--eject`](./test-runner#configure) and configure a custom [`snapshotResolver`](https://jestjs.io/docs/configuration#snapshotresolver-string) to store them elsewhere, e.g. in your working directory: - -```js -// ./test-runner-jest.config.js - -const path = require('path'); - -module.exports = { - resolveSnapshotPath: (testPath, snapshotExtension) => - path.join(process.cwd(), '__snapshots__', path.basename(testPath) + snapshotExtension), - resolveTestPath: (snapshotFilePath, snapshotExtension) => - path.join(process.env.TEST_ROOT, path.basename(snapshotFilePath, snapshotExtension)), - testPathForConsistencyCheck: path.join(process.env.TEST_ROOT, 'example.test.js'), -}; -``` - -Finally, you can [set up test runner to run your tests in CI](./test-runner.md#set-up-ci-to-run-tests). - -There are many other configuration options available, such as watch mode and coverage. Please reference the [test runner documentation](./test-runner) for more information. - -## Set up Storyshots - -
- -⛔️ Storyshots has been deprecated in favor of [test runner](./test-runner.md), which you can use for both snapshot and [visual testing](./visual-testing.md). - -
- -[Storyshots](https://storybook.js.org/addons/@storybook/addon-storyshots/) is a Storybook addon that enables snapshot testing, powered by [Jest](https://jestjs.io/docs/getting-started). - -Run the following command to install Storyshots: - - - - - - - -Add a test file to your environment with the following contents to configure Storyshots: - - - - - - - -
-💡 You can name the test file differently to suit your needs. Bear in mind that it requires to be picked up by Jest. -
- -Run your first test. Storyshots will recognize your stories (based on [.storybook/main.js's setup](https://storybook.js.org/docs/react/configure/story-rendering)) and save them in the **snapshots** directory. - -```shell -npm test storybook.test.js -``` - -![Successful snapshot tests](./storyshots-pass.png) - -When you make changes to your components or stories, rerun the test to identify the changes to the rendered markup. - -![Failing snapshots](./storyshots-fail.png) - -If they're intentional, accept them as new baselines. If the changes are bugs, fix the underlying code, then rerun the snapshot tests. - -### Configure the snapshot's directory - -If your project has a custom setup for snapshot testing, you'll need to take additional steps to run Storyshots. You'll need to install both [@storybook/addon-storyshots-puppeteer](https://storybook.js.org/addons/@storybook/addon-storyshots-puppeteer) and [puppeteer](https://github.com/puppeteer/puppeteer): - -```shell -# With npm -npm i -D @storybook/addon-storyshots-puppeteer puppeteer - -# With yarn -yarn add @storybook/addon-storyshots-puppeteer puppeteer -``` - -Next, update your test file (for example, `storybook.test.js`) to the following: - - - - - - - -
-💡 Don't forget to replace your-custom-directory with your own. -
- -When you run your tests, the snapshots will be available in the directory you've specified. - -### Framework configuration - -By default, Storyshots detects your project's framework. If you run into a situation where this is not the case, you can adjust the configuration object and specify your framework. For example, if you wanted to configure the addon for a Vue 3 project: - - - - - - - -These are the frameworks currently supported by Storyshots: `angular`, `html`, `preact`, `react`, `react-native`, `svelte`, `vue`, `vue3`, and `web-components`. - -### Additional customization - -Storyshots is highly customizable and includes options for various advanced use cases. You can read more in the [addon’s documentation](https://github.com/storybookjs/storybook/tree/master/addons/storyshots/storyshots-core#options). - ---- - -#### What’s the difference between snapshot tests and visual tests? - -Visual tests capture images of stories and compare them against image baselines. Snapshot tests take DOM snapshots and compare them against DOM baselines. Visual tests are better suited for verifying appearance. Snapshot tests are useful for smoke testing and ensuring the DOM doesn’t change. - -#### Learn about other UI tests - -- [Test runner](./test-runner.md) to automate test execution -- [Visual tests](./visual-testing.md) for appearance -- [Accessibility tests](./accessibility-testing.md) for accessibility -- [Interaction tests](./interaction-testing.md) for user behavior simulation -- [Coverage tests](./test-coverage.md) for measuring code coverage -- Snapshot tests for rendering errors and warnings -- [End-to-end tests](./stories-in-end-to-end-tests.md) for simulating real user scenarios -- [Unit tests](./stories-in-unit-tests.md) for functionality diff --git a/scripts/package.json b/scripts/package.json index b6020c436390..d38c2707ae00 100644 --- a/scripts/package.json +++ b/scripts/package.json @@ -140,7 +140,6 @@ "husky": "^4.3.7", "jest": "^29.3.1", "jest-environment-jsdom": "^29.3.1", - "jest-image-snapshot": "^6.0.0", "jest-junit": "^14.0.1", "jest-mock-extended": "^3.0.4", "jest-os-detection": "^1.3.1", diff --git a/scripts/yarn.lock b/scripts/yarn.lock index 504a13091f02..21497980d15a 100644 --- a/scripts/yarn.lock +++ b/scripts/yarn.lock @@ -3018,7 +3018,6 @@ __metadata: husky: ^4.3.7 jest: ^29.3.1 jest-environment-jsdom: ^29.3.1 - jest-image-snapshot: ^6.0.0 jest-junit: ^14.0.1 jest-mock-extended: ^3.0.4 jest-os-detection: ^1.3.1 @@ -8499,13 +8498,6 @@ __metadata: languageName: node linkType: hard -"get-stdin@npm:^5.0.1": - version: 5.0.1 - resolution: "get-stdin@npm:5.0.1" - checksum: 309f933f08a4d6783681674451027802299124e596324cd628c5e5138bbc5de843bbaa345a8ce0fc72304869f9de3b50086407aca551e292b13f7cb02351479e - languageName: node - linkType: hard - "get-stdin@npm:^6.0.0": version: 6.0.0 resolution: "get-stdin@npm:6.0.0" @@ -8794,13 +8786,6 @@ __metadata: languageName: node linkType: hard -"glur@npm:^1.1.2": - version: 1.1.2 - resolution: "glur@npm:1.1.2" - checksum: 756fcbc7f1a8576755811e31367feeaffbd13b7f20d788672bccbd65956839065e256621a7576f4ab321352b28a0aea442d64567bca23882526b891767ffbe3e - languageName: node - linkType: hard - "google-auth-library@npm:^8.0.2": version: 8.9.0 resolution: "google-auth-library@npm:8.9.0" @@ -10256,27 +10241,6 @@ __metadata: languageName: node linkType: hard -"jest-image-snapshot@npm:^6.0.0": - version: 6.2.0 - resolution: "jest-image-snapshot@npm:6.2.0" - dependencies: - chalk: ^4.0.0 - get-stdin: ^5.0.1 - glur: ^1.1.2 - lodash: ^4.17.4 - pixelmatch: ^5.1.0 - pngjs: ^3.4.0 - rimraf: ^2.6.2 - ssim.js: ^3.1.1 - peerDependencies: - jest: ">=20 <=29" - peerDependenciesMeta: - jest: - optional: true - checksum: 62e415f86f2bed30fe126520519014beed61a38a678285de44c6544d10eed7381b28958d3406f131a60c05715f42ab7bf7ea4ecfdab4f55946cec6739de23924 - languageName: node - linkType: hard - "jest-junit@npm:^14.0.1": version: 14.0.1 resolution: "jest-junit@npm:14.0.1" @@ -11322,7 +11286,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:4, lodash@npm:4.17.21, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.21, lodash@npm:^4.17.4": +"lodash@npm:4, lodash@npm:4.17.21, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.21": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: d8cbea072bb08655bb4c989da418994b073a608dffa608b09ac04b43a791b12aeae7cd7ad919aa4c925f33b48490b5cfe6c1f71d827956071dae2e7bb3a6b74c @@ -13318,17 +13282,6 @@ __metadata: languageName: node linkType: hard -"pixelmatch@npm:^5.1.0": - version: 5.3.0 - resolution: "pixelmatch@npm:5.3.0" - dependencies: - pngjs: ^6.0.0 - bin: - pixelmatch: bin/pixelmatch - checksum: 30850661db29b57cefbe6cf36e930b7517aea4e0ed129e85fcc8ec04a7e6e7648a822a972f8e01d2d3db268ca3c735555caf6b8099a164d8b64d105986d682d2 - languageName: node - linkType: hard - "pkg-dir@npm:^4.2.0": version: 4.2.0 resolution: "pkg-dir@npm:4.2.0" @@ -13399,20 +13352,6 @@ __metadata: languageName: node linkType: hard -"pngjs@npm:^3.4.0": - version: 3.4.0 - resolution: "pngjs@npm:3.4.0" - checksum: 88ee73e2ad3f736e0b2573722309eb80bd2aa28916f0862379b4fd0f904751b4f61bb6bd1ecd7d4242d331f2b5c28c13309dd4b7d89a9b78306e35122fdc5011 - languageName: node - linkType: hard - -"pngjs@npm:^6.0.0": - version: 6.0.0 - resolution: "pngjs@npm:6.0.0" - checksum: ac23ea329b1881d1a10575aff58116dc27b894ec3f5b84ba15c7f527d21e609fbce7ba16d48f8ccb86c7ce45ceed622472765476ab2875949d4bec55e153f87a - languageName: node - linkType: hard - "portfinder@npm:^1.0.28": version: 1.0.32 resolution: "portfinder@npm:1.0.32" @@ -14773,17 +14712,6 @@ __metadata: languageName: node linkType: hard -"rimraf@npm:^2.6.2": - version: 2.7.1 - resolution: "rimraf@npm:2.7.1" - dependencies: - glob: ^7.1.3 - bin: - rimraf: ./bin.js - checksum: 4eef73d406c6940927479a3a9dee551e14a54faf54b31ef861250ac815172bade86cc6f7d64a4dc5e98b65e4b18a2e1c9ff3b68d296be0c748413f092bb0dd40 - languageName: node - linkType: hard - "rimraf@npm:^3.0.0, rimraf@npm:^3.0.2": version: 3.0.2 resolution: "rimraf@npm:3.0.2" @@ -15378,13 +15306,6 @@ __metadata: languageName: node linkType: hard -"ssim.js@npm:^3.1.1": - version: 3.5.0 - resolution: "ssim.js@npm:3.5.0" - checksum: 9e7101da17395d3acbd417aac712d8f156522e79059a27cb38882eedd5a8868e31871c8f58bec3a150f8cf0660883cf22310cbd2fd63b408c1fd0ab02fda9fbc - languageName: node - linkType: hard - "ssri@npm:^10.0.0": version: 10.0.5 resolution: "ssri@npm:10.0.5"