search

webdriverio / visual-testing

Image comparison / visual regression testing for WebdriverIO
https://webdriver.io/docs/visual-testing
MIT License
109 stars 41 forks source link

Issue with running visual-service #318

Closed Ridhib closed 6 months ago

Ridhib commented 6 months ago

Environment (please complete the following information):

Config of WebdriverIO + @wdio/visual-service An example of how you configured the @wdio/visual-service

services: [ [ 'browserstack', { testObservability: false, browserstackLocal: true, }, ], ['visual', { // Some options, see the docs for more baselineFolder: path.join(process.cwd(), 'tests', 'baseline'), formatImageName: '{tag}-{logName}-{width}x{height}', screenshotPath: path.join(process.cwd(), 'tmp'), savePerInstance: true, // ... more options }] ], tsconfig file: { "compilerOptions": { "module": "commonjs", "baseUrl": "./", "types": ["node", "@wdio/globals/types", "@wdio/mocha-framework", "expect-webdriverio", "@wdio/visual-service"], "paths": { "@tests/": ["../"] } },

} Describe the bug

Fails to run spec files with error Error: Error: Failed to initilialise launcher service unknown: Error: Couldn't initialize "@wdio/visual-service". Error: Cannot find package '@wdio/globals' imported from /Users/rbhan/Documents/web-self-serve-ads/node_modules/.pnpm/@wdio+visual-service@4.1.0/node_modules/@wdio/visual-service/dist/service.js

To Reproduce Steps to reproduce the behavior:

[Include code or an example repository that can easily be set up]

Expected behavior A clear and concise description of what you expected to happen.

Log If applicable, add logs to help explain your problem. If you don't have log, enable 'debug:true' in the config and paste the log here. Please use proper markdown to style it

Additional context Add any other context about the problem here.

wswebcreation commented 6 months ago

Will be fixed with https://github.com/webdriverio/visual-testing/pull/319

wswebcreation commented 6 months ago

https://github.com/webdriverio/visual-testing/releases/tag/%40wdio%2Fvisual-service%404.1.1 has been released

Ridhib commented 6 months ago

Still failing with new error Error: Failed to initilialise launcher service unknown: Error: Couldn't initialize "@wdio/visual-service". Error: Cannot find package 'webdriverio' imported from /Users/rbhan/Documents/web-self-serve-ads/nodemodules/.pnpm/@wdio+visual-service@4.1.1@wdio+local-runner@8.36.1@wdio+mocha-framework@8.36.1@wdio+spec-_7dtx5v75xsee53thbjnqnfquqe/node_modules/@wdio/visual-service/dist/storybook/launcher.js

wswebcreation commented 6 months ago

Hi @Ridhib Hmm, I'm not seeing this in a clean project. This is what I have (from the default init setup)

{
  "name": "no-globals",
  "type": "module",
  "devDependencies": {
    "@wdio/cli": "^8.36.1",
    "@wdio/local-runner": "^8.36.1",
    "@wdio/mocha-framework": "^8.36.1",
    "@wdio/spec-reporter": "^8.36.1",
    "@wdio/visual-service": "^4.1.1",
    "ts-node": "^10.9.2",
    "typescript": "^5.4.5"
  },
  "scripts": {
    "wdio": "wdio run ./wdio.conf.ts"
  }
}

Then do this

npm run wdio -- --storybook --numShards=10 --url=https://govuk-react.github.io/govuk-react/ --skipStories="/.*(loading-box|spinner).*/" --logLevel=silent

And I get this

Execution of 1 workers started at 2024-05-01T04:53:35.287Z

[0-8] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-8-10.test.js
[0-1] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-10-10.test.js
[0-5] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-5-10.test.js
[0-7] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-7-10.test.js
[0-0] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-1-10.test.js
[0-2] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-2-10.test.js
[0-4] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-4-10.test.js
[0-3] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-3-10.test.js
[0-6] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-6-10.test.js
[0-9] RUNNING in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-9-10.test.js
[0-3] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-3-10.test.js
[0-0] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-1-10.test.js
[0-9] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-9-10.test.js
[0-4] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-4-10.test.js
[0-7] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-7-10.test.js
[0-1] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-10-10.test.js
[0-6] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-6-10.test.js
[0-5] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-5-10.test.js
[0-8] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-8-10.test.js
[0-2] PASSED in chrome - file:///var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-2-10.test.js

 "spec" Reporter:
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-3] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-3] Session ID: 7ea7b309e4f8cc5e83d02ddb3086b7cb
[chrome-headless-shell 124.0.6367.91 mac #0-3]
[chrome-headless-shell 124.0.6367.91 mac #0-3] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-3-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-3] Shard 3 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input-field--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input-field--input-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input-field--input-with-hint-text-error
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input-field--input-with-type-and-auto-complete
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of input--with-label
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of label-text--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of label-text--with-label
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of label--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of label--with-input
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of multi-choice--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of multi-choice--inline-with-a-hint
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of multi-choice--inline-with-an-error
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of multi-choice--with-a-hint-and-error
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--default
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--radio-small
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--radio-stacked
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--radio-inline
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--radio-disabled
[chrome-headless-shell 124.0.6367.91 mac #0-3]    ✓ should take an element screenshot of radio--radio-preselected
[chrome-headless-shell 124.0.6367.91 mac #0-3]
[chrome-headless-shell 124.0.6367.91 mac #0-3] 20 passing (6.4s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-0] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-0] Session ID: 762e807da36e96a75133a8a4c835acc1
[chrome-headless-shell 124.0.6367.91 mac #0-0]
[chrome-headless-shell 124.0.6367.91 mac #0-0] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-1-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-0] Shard 1 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--example-application
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--form
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--final-form
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--formik
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--react-hook-form
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of example-application--react-json-schema-form
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--default
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--start
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--start-with-icon
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--disabled
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--disabled-start-with-icon
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--custom-colour
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--custom-colours-all-options
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of button--router-link-button
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--default
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--checkbox-small
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--checkbox-disabled
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--checkbox-preselected
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--checkbox-preselected-disabled
[chrome-headless-shell 124.0.6367.91 mac #0-0]    ✓ should take an element screenshot of checkbox--checkbox-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-0]
[chrome-headless-shell 124.0.6367.91 mac #0-0] 20 passing (5s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-9] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-9] Session ID: 2dab5b9ffc524dd7ba583bcaa90d24bd
[chrome-headless-shell 124.0.6367.91 mac #0-9]
[chrome-headless-shell 124.0.6367.91 mac #0-9] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-9-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-9] Shard 9 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--default
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-default-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-anchor-tag
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-titles-anchor-tag
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-titles-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-just-with-next-page-anchor-tag
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-just-with-next-page-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-just-with-previous-page-anchor-tag
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of pagination--pagination-with-numbers-just-with-previous-page-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of related-items--default
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of skip-link--default
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of skip-link--auto-focussed
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--default
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--simple
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--simple-with-map-function
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--simple-with-map-and-babel-s-proposed-class-properties-plugin
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--complex-mapped-table
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--hooks
[chrome-headless-shell 124.0.6367.91 mac #0-9]    ✓ should take an element screenshot of tabs--using-react-router
[chrome-headless-shell 124.0.6367.91 mac #0-9]
[chrome-headless-shell 124.0.6367.91 mac #0-9] 20 passing (5.1s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-4] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-4] Session ID: cfe304581608a159fc6c0e599733db9d
[chrome-headless-shell 124.0.6367.91 mac #0-4]
[chrome-headless-shell 124.0.6367.91 mac #0-4] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-4-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-4] Shard 4 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of radio--radio-preselected-disabled
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of radio--radio-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of radio--usage-with-final-redux-form-multi-checkbox-validation
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of search-box--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of select--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of select--select-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of select--select-with-hint-text-error
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of select--standalone-input-with-inline-label
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of text-area--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of text-area--textarea-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of text-area--textarea-with-hint-text-error
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of caption--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of caption--placed-with-a-heading-component
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of caption--placed-inside-a-heading-component
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of caption--showing-all-standard-caption-sizes-with-headings
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of details--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of details--set-as-open
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of details--with-paragraph-contents
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of document-footer-metadata--default
[chrome-headless-shell 124.0.6367.91 mac #0-4]    ✓ should take an element screenshot of document-footer-metadata--dfm-from-part-of-example
[chrome-headless-shell 124.0.6367.91 mac #0-4]
[chrome-headless-shell 124.0.6367.91 mac #0-4] 20 passing (7.1s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-7] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-7] Session ID: 526952728fee9013e785694da924acb3
[chrome-headless-shell 124.0.6367.91 mac #0-7]
[chrome-headless-shell 124.0.6367.91 mac #0-7] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-7-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-7] Shard 7 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-custom-license
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-no-license
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-meta-links
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-meta-custom
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-meta-links-and-custom
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-navigation
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of footer--with-navigation-and-meta
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of global-style--default
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--default
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-halves
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-thirds
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-two-thirds-one-third
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-one-third-two-thirds
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-four-quarters
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-one-quarter-and-auto-fill
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--column-widths-differing-between-tablet-and-desktop
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-col--custom-widths-differing-between-tablet-and-desktop
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of grid-row--default
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of main--default
[chrome-headless-shell 124.0.6367.91 mac #0-7]    ✓ should take an element screenshot of page--default
[chrome-headless-shell 124.0.6367.91 mac #0-7]
[chrome-headless-shell 124.0.6367.91 mac #0-7] 20 passing (5.9s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-1] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-1] Session ID: 8e9a689715874d08dc09a8b64fd24802
[chrome-headless-shell 124.0.6367.91 mac #0-1]
[chrome-headless-shell 124.0.6367.91 mac #0-1] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-10-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-1] Shard 10 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of tabs--using-react-router-single-panel-only
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of loading-box--default
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of loading-box--partial-cover
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of loading-box--loading-box-long
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of loading-box--short-height
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of loading-box--with-bold-text
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of visually-hidden--default
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of visually-hidden--focussed-focusable
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of visually-hidden--focussed-focusable-as-a-button
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-arrowleft--arrow-left
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-arrowright--arrow-right
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-buttonarrow--button-arrow
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-iconimportant--icon-important
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-svgbase--svg-base
[chrome-headless-shell 124.0.6367.91 mac #0-1]    ✓ should take an element screenshot of utility-icons-search--search
[chrome-headless-shell 124.0.6367.91 mac #0-1]    - should take an element screenshot of utility-icons-spinner--spinner
[chrome-headless-shell 124.0.6367.91 mac #0-1]
[chrome-headless-shell 124.0.6367.91 mac #0-1] 10 passing (6.1s)
[chrome-headless-shell 124.0.6367.91 mac #0-1] 6 skipped
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-6] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-6] Session ID: 4e601f007e4e140ae8dc5f883fb15a20
[chrome-headless-shell 124.0.6367.91 mac #0-6]
[chrome-headless-shell 124.0.6367.91 mac #0-6] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-6-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-6] Shard 6 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of phase-banner--beta-phase-tag
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of table--default
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of table--with-a-caption
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of table--with-a-head-row-and-numeric-tabular-data
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of table--with-a-three-quarter-width-column-and-one-quarter
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of table--with-custom-column-widths
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of tag--default
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of tag--inactive
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of tag--custom
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of tag--showing-one-or-two-statuses
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of tag--additional-colours
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of unordered-list--default
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of unordered-list--unordered-list-with-square
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of unordered-list--unordered-list-with-bullet-with-nested-lists
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of unordered-list--unordered-list-with-no-decoration
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of warning-text--default
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of warning-text--long-warning
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of footer--default
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of footer--with-custom-width-container-no-width-limit
[chrome-headless-shell 124.0.6367.91 mac #0-6]    ✓ should take an element screenshot of footer--with-copyright
[chrome-headless-shell 124.0.6367.91 mac #0-6]
[chrome-headless-shell 124.0.6367.91 mac #0-6] 20 passing (6.3s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-5] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-5] Session ID: 02921c8abf2d0a3f1a54ef233e38fe7a
[chrome-headless-shell 124.0.6367.91 mac #0-5]
[chrome-headless-shell 124.0.6367.91 mac #0-5] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-5-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-5] Shard 5 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of document-footer-metadata--dfm-from-other-data-example
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of heading--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of heading--level-aliases
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of heading--differing-sizes
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of heading--props-pass-through
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of inset-text--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of inset-text--using-a-paragraph-for-contents
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of lead-paragraph--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of list-item--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of list-item--with-anchor
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of ordered-list--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of ordered-list--ordered-list-with-alpha
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of ordered-list--ordered-list-with-roman
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of ordered-list--ordered-list-with-bullet-with-nested-number-list
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of ordered-list--ordered-list-with-no-decoration
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of paragraph--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of paragraph--supporting-paragaph
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of paragraph--with-a-block-of-code
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of paragraph--with-react-router
[chrome-headless-shell 124.0.6367.91 mac #0-5]    ✓ should take an element screenshot of phase-banner--default
[chrome-headless-shell 124.0.6367.91 mac #0-5]
[chrome-headless-shell 124.0.6367.91 mac #0-5] 20 passing (6.7s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-8] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-8] Session ID: aeb7c96efb01d16c638d06c3e823e8f8
[chrome-headless-shell 124.0.6367.91 mac #0-8]
[chrome-headless-shell 124.0.6367.91 mac #0-8] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-8-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-8] Shard 8 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of page--custom-width-container-no-width-limit
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of page--custom-main-container-background-colour
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of page--custom-main-container-adjusted-padding
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of panel--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of panel--panel-with-header-and-html-body
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of section-break--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--custom-logo
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--with-service-title
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--logo-and-service-title-with-react-router-link
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--with-search
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--children
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--everything-but-service-title
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--everything
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of top-nav--everything-with-9-nav-items
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of back-link--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of back-link--with-href
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of breadcrumbs--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of link--default
[chrome-headless-shell 124.0.6367.91 mac #0-8]    ✓ should take an element screenshot of link--with-react-router
[chrome-headless-shell 124.0.6367.91 mac #0-8]
[chrome-headless-shell 124.0.6367.91 mac #0-8] 20 passing (6.8s)
------------------------------------------------------------------
[chrome-headless-shell 124.0.6367.91 mac #0-2] Running: chrome-headless-shell (v124.0.6367.91) on mac
[chrome-headless-shell 124.0.6367.91 mac #0-2] Session ID: 1004f0bb658fdbf3c2886b1839cc601d
[chrome-headless-shell 124.0.6367.91 mac #0-2]
[chrome-headless-shell 124.0.6367.91 mac #0-2] » /var/folders/m1/kdbf_gz14qb0nlfss6l9m1sh0000gn/T/wdio-storybook-tests-1714539215497/visual-storybook-2-10.test.js
[chrome-headless-shell 124.0.6367.91 mac #0-2] Shard 2 of 10
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of date-field--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of date-field--date-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of date-field--date-with-default-values
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of date-field--date-with-hint-text-error
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of date-field--date-with-per-field-props
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of error-summary--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of error-text--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of error-text--with-label
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of fieldset--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of fieldset--legend-as-page-heading
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of file-upload--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of file-upload--input-with-hint-text
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of file-upload--input-with-hint-text-error
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of form-group--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of form-group--nested-form-groups
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of form-group--error-prop-set
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of form-group--nested-form-groups-with-inner-groups-error-props-set
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of form-group--nested-form-groups-with-all-groups-error-props-set
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of hint-text--default
[chrome-headless-shell 124.0.6367.91 mac #0-2]    ✓ should take an element screenshot of hint-text--with-label
[chrome-headless-shell 124.0.6367.91 mac #0-2]
[chrome-headless-shell 124.0.6367.91 mac #0-2] 20 passing (6.8s)

Spec Files:      10 passed, 1 total (1000% completed) in 00:00:11

Have you already tried removing your lock file, remove the dependencies and do a new install?