search

webdriverio / visual-testing

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

[🐛 Bug]: module system issue when using with vite and storybook #495

Closed wswebcreation closed 1 month ago

wswebcreation commented 2 months ago

Have you read the Contributing Guidelines on issues?

WebdriverIO Version

9.0.7

Node.js Version

20.5.0

Mode

Standalone Mode

Which capabilities are you using?

No response

What happened?

I initiated an empty project using vite cli and then added storybook using its cli too. Then I used wdio and selected some options which you can check in the github respository. Now when I run pnpm wdio I get the following error:

Error:  Test failed due to following error(s):
  - expect.js: Uncaught SyntaxError: The requested module '/node_modules/.pnpm/expect@29.7.0/node_modules/expect/build/index.js?v=fd972e43' does not provide an export named 'expect'

I tried and changed the code inside the node_modules folder, and then I basically start going down a rabbit hole of fixing esm/cjs related errors like require not defined or exports not defined etc.

What is your expected behavior?

Have no error

How to reproduce the bug.

To reproduce the bug simply:

Relevant log output

pnpm wdio

> vite-storybook-wdio@0.0.0 wdio /Users/mehdibabapour/codebase/tmp-vite/vite-storybook-wdio
> wdio run ./wdio.conf.ts --storybook

(node:30440) ExperimentalWarning: Custom ESM Loaders is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)

Execution of 0 workers started at 2024-08-27T09:43:09.177Z

2024-08-27T09:43:10.199Z INFO @wdio/browser-runner: Initiate browser environment
2024-08-27T09:43:10.200Z INFO @wdio/cli:launcher: Run onPrepare hook
2024-08-27T09:43:10.200Z INFO @wdio/visual-service: Running `@wdio/visual-service` in Storybook mode.
2024-08-27T09:43:10.209Z INFO @wdio/visual-service:storybook-utils: Using temporary folder for storybook specs: /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208
2024-08-27T09:43:10.215Z INFO @wdio/visual-service: Clearing the current capabilities.
2024-08-27T09:43:10.216Z INFO @wdio/visual-service:storybook-utils: Test file created at: /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js
2024-08-27T09:43:10.216Z INFO @wdio/visual-service:storybook-utils: Added new storybook capabilities: [
  {
    "browserName": "chrome",
    "goog:chromeOptions": {
      "args": [
        "disable-infobars",
        "--headless"
      ]
    },
    "wdio-ics:options": {
      "logName": "local-chrome"
    }
  }
]
2024-08-27T09:43:10.217Z INFO @wdio/utils: Setting up browser driver for: chrome@stable
2024-08-27T09:43:10.217Z INFO @wdio/utils: Setting up browser binaries for: chrome@stable
2024-08-27T09:43:10.262Z INFO webdriver: Using Chromedriver v128.0.6613.84 from cache directory /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T
2024-08-27T09:43:10.304Z INFO @wdio/cli:launcher: Run onWorkerStart hook
2024-08-27T09:43:10.341Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: expect, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: minimatch, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: css-shorthand-properties, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: lodash.merge, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: lodash.zip, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: ws, present in 'optimizeDeps.include'
2024-08-27T09:43:10.342Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: lodash.clonedeep, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: lodash.pickby, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: lodash.flattendeep, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: aria-query, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: grapheme-splitter, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: css-value, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: rgb2hex, present in 'optimizeDeps.include'
2024-08-27T09:43:10.343Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: p-iteration, present in 'optimizeDeps.include'
2024-08-27T09:43:10.344Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: deepmerge-ts, present in 'optimizeDeps.include'
2024-08-27T09:43:10.344Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: jest-util, present in 'optimizeDeps.include'
2024-08-27T09:43:10.344Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: jest-matcher-utils, present in 'optimizeDeps.include'
2024-08-27T09:43:10.344Z WARN @wdio/browser-runner:vite: Failed to resolve dependency: split2, present in 'optimizeDeps.include'
2024-08-27T09:43:10.357Z INFO @wdio/browser-runner:ViteServer: Vite server started successfully on port 58189, root directory: /Users/mehdibabapour/codebase/tmp-vite/vite-storybook-wdio
2024-08-27T09:43:10.358Z INFO @wdio/local-runner: Start worker 0-0 with arg: run,./wdio.conf.ts,--storybook
[0-0] (node:30456) ExperimentalWarning: Custom ESM Loaders is an experimental feature and might change at any time
[0-0] (Use `node --trace-warnings ...` to show where the warning was created)
[0-0] 2024-08-27T09:43:10.999Z INFO @wdio/local-runner: Run worker command: run
[0-0] RUNNING in chrome - file:///var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js
[0-0] 2024-08-27T09:43:11.341Z INFO webdriver: Initiate new session using the WebDriver protocol
[0-0] 2024-08-27T09:43:11.380Z INFO webdriver: Using Chromedriver v128.0.6613.84 from cache directory /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T
[0-0] 2024-08-27T09:43:11.396Z INFO chromedriver: Starting ChromeDriver 128.0.6613.84 (606aa55c7d687518d34b55accc5a71ea0bd28727-refs/branch-heads/6613@{#1335}) on port 58192
[0-0] 2024-08-27T09:43:11.396Z INFO chromedriver: Remote connections are allowed by an allowlist (0.0.0.0).
[0-0] 2024-08-27T09:43:11.396Z INFO chromedriver: Please see https://chromedriver.chromium.org/security-considerations for suggestions on keeping ChromeDriver safe.
[0-0] 2024-08-27T09:43:11.414Z INFO chromedriver: ChromeDriver was started successfully on port 58192.
[0-0] 2024-08-27T09:43:12.387Z INFO @wdio/utils: Started Chromedriver v128.0.6613.84 with params --port=58192 --allowed-origins=* --allowed-ips=0.0.0.0 in 1046ms on port 58192
[0-0] 2024-08-27T09:43:12.392Z INFO webdriver: [POST] http://localhost:58192/session
[0-0] 2024-08-27T09:43:12.392Z INFO webdriver: DATA {
[0-0]   capabilities: {
[0-0]     alwaysMatch: {
[0-0]       browserName: 'chrome',
[0-0]       'goog:chromeOptions': [Object],
[0-0]       'wdio-ics:options': [Object],
[0-0]       webSocketUrl: true
[0-0]     },
[0-0]     firstMatch: [ {} ]
[0-0]   },
[0-0]   desiredCapabilities: {
[0-0]     browserName: 'chrome',
[0-0]     'goog:chromeOptions': {
[0-0]       binary: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
[0-0]       args: [Array]
[0-0]     },
[0-0]     'wdio-ics:options': { logName: 'local-chrome' },
[0-0]     webSocketUrl: true
[0-0]   }
[0-0] }
[0-0] 2024-08-27T09:43:13.471Z INFO webdriver: Register BiDi handler for session with id efcd5f4e3ffcab6fa9b70b2efc6e16bd
[0-0] 2024-08-27T09:43:13.472Z INFO webdriver: Connect to webSocketUrl ws://127.0.0.1:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd
[0-0] 2024-08-27T09:43:13.477Z INFO webdriver: Connected session to Bidi protocol
[0-0] 2024-08-27T09:43:13.477Z INFO webdriver: Connected session to Bidi protocol
[0-0] 2024-08-27T09:43:13.477Z INFO webdriver: Connected to WebDriver Bidi interface at ws://127.0.0.1:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd
[0-0] 2024-08-27T09:43:13.478Z INFO webdriver: BIDI COMMAND script.addPreloadScript { functionDeclaration: <PreloadScript[868 bytes]>, contexts: undefined }
[0-0] 2024-08-27T09:43:13.479Z INFO webdriver: BIDI COMMAND session.subscribe {"events":["browsingContext.navigationStarted","network.responseCompleted","network.beforeRequestSent","network.fetchError"]}
[0-0] 2024-08-27T09:43:13.479Z INFO webdriver: BIDI COMMAND session.subscribe {"events":["browsingContext.userPromptOpened"]}
[0-0] 2024-08-27T09:43:13.479Z INFO webdriver: BIDI COMMAND session.subscribe {"events":["browsingContext.navigationStarted"]}
[0-0] 2024-08-27T09:43:13.479Z INFO webdriver: BIDI COMMAND session.subscribe {"events":["log.entryAdded"]}
[0-0] 2024-08-27T09:43:13.500Z INFO @wdio/visual-service: Adding commands to global browser
[0-0] 2024-08-27T09:43:13.502Z INFO @wdio/visual-service: Adding element command "saveElement" to browser object
[0-0] 2024-08-27T09:43:13.503Z INFO @wdio/visual-service: Adding element command "checkElement" to browser object
[0-0] 2024-08-27T09:43:13.503Z INFO @wdio/visual-service: Adding browser command "saveScreen" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "saveFullPageScreen" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "saveTabbablePage" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "checkScreen" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "checkFullPageScreen" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "checkTabbablePage" to browser object
[0-0] 2024-08-27T09:43:13.504Z INFO @wdio/visual-service: Adding browser command "waitForStorybookComponentToBeLoaded" to browser object
[0-0] 2024-08-27T09:43:13.510Z INFO @wdio/runner: Run spec file file:///var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js for cid 0-0
[0-0] 2024-08-27T09:43:13.511Z INFO webdriver: COMMAND getWindowHandle()
[0-0] 2024-08-27T09:43:13.512Z INFO webdriver: [GET] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd/window
[0-0] 2024-08-27T09:43:13.518Z INFO webdriver: RESULT E9842D5B50E6924AFF366A5AC280C8C5
[0-0] 2024-08-27T09:43:13.518Z INFO webdriver: BIDI COMMAND browsingContext.navigate {"context":"E9842D5B50E6924AFF366A5AC280C8C5","url":"http://localhost:58189/?cid=0-0&spec=/var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js","wait":"complete"}
2024-08-27T09:43:13.525Z INFO @wdio/browser-runner:plugin: Received request for: /?cid=0-0&spec=/var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js
[0-0] 2024-08-27T09:43:13.523Z INFO webdriver: COMMAND getWindowHandle()
[0-0] 2024-08-27T09:43:13.524Z INFO webdriver: [GET] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd/window
[0-0] 2024-08-27T09:43:13.528Z INFO webdriver: RESULT E9842D5B50E6924AFF366A5AC280C8C5
[0-0] 2024-08-27T09:43:13.528Z INFO webdriverio:ContextManager: Update current context: E9842D5B50E6924AFF366A5AC280C8C5
[0-0] 2024-08-27T09:43:13.987Z INFO webdriver: COMMAND addCookie(<object>)
[0-0] 2024-08-27T09:43:13.987Z INFO webdriver: [POST] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd/cookie
[0-0] 2024-08-27T09:43:13.987Z INFO webdriver: DATA {
[0-0]   cookie: {
[0-0]     name: 'WDIO_SPEC',
[0-0]     value: '/var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js'
[0-0]   }
[0-0] }
[0-0] 2024-08-27T09:43:13.992Z INFO webdriver: RESULT null
[0-0] 2024-08-27T09:43:13.992Z INFO webdriver: COMMAND addCookie(<object>)
[0-0] 2024-08-27T09:43:13.992Z INFO webdriver: [POST] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd/cookie
[0-0] 2024-08-27T09:43:13.992Z INFO webdriver: DATA { cookie: { name: 'WDIO_CID', value: '0-0' } }
[0-0] 2024-08-27T09:43:13.996Z INFO webdriver: RESULT null
[0-0] 2024-08-27T09:43:14.498Z INFO webdriver: BIDI COMMAND script.callFunction {"functionDeclaration":"<Function[849 bytes]>","awaitPromise":false,"arguments":[],"target":{"context":"E9842D5B50E6924AFF366A5AC280C8C5"}}
[0-0]  Error:  Test failed due to following error(s):
  - expect.js: Uncaught SyntaxError: The requested module '/node_modules/.pnpm/expect@29.7.0/node_modules/expect/build/index.js?v=fd972e43' does not provide an export named 'expect'

[0-0] 2024-08-27T09:43:14.504Z INFO webdriver: COMMAND getLogs("browser")
[0-0] 2024-08-27T09:43:14.505Z INFO webdriver: [POST] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd/se/log
[0-0] 2024-08-27T09:43:14.505Z INFO webdriver: DATA { type: 'browser' }
[0-0] 2024-08-27T09:43:14.506Z INFO webdriver: COMMAND deleteSession()
[0-0] 2024-08-27T09:43:14.506Z INFO webdriver: [DELETE] http://localhost:58192/session/efcd5f4e3ffcab6fa9b70b2efc6e16bd
[0-0] 2024-08-27T09:43:14.508Z INFO webdriver: RESULT [
[0-0]   {
[0-0]     level: 'SEVERE',
[0-0]     message: "http://localhost:58189/node_modules/.pnpm/@wdio+browser-runner@9.0.7_esbuild@0.18.20/node_modules/@wdio/browser-runner/build/browser/expect.js 1:9 Uncaught SyntaxError: The requested module '/node_modules/.pnpm/expect@2…972e43' does not provide an export named 'expect'",
[0-0]     source: 'javascript',
[0-0]     timestamp: 1724751793985
[0-0]   }
[0-0] ]
[0-0] 2024-08-27T09:43:14.563Z INFO webdriver: RESULT null
[0-0] 2024-08-27T09:43:14.563Z INFO webdriver: Kill driver process with PID 30459
[0-0] FAILED in chrome - file:///var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208/visual-storybook-1-1.test.js
2024-08-27T09:43:14.677Z INFO @wdio/cli:launcher: Run onWorkerEnd hook
2024-08-27T09:43:14.677Z INFO @wdio/cli:launcher: Run onComplete hook
2024-08-27T09:43:14.677Z INFO @wdio/visual-service: Cleaning up temporary folder for storybook specs: /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208
2024-08-27T09:43:14.678Z INFO @wdio/visual-service: Temporary folder for storybook specs has been removed: /var/folders/nk/g9rcs1gx4ssbnd66pgtv0bfw0000gn/T/wdio-storybook-tests-1724751790208

Spec Files:      0 passed, 1 failed, 0 total (0% completed) in 00:00:05  

2024-08-27T09:43:14.679Z INFO @wdio/local-runner: Shutting down spawned worker
(node:30440) [DEP0147] DeprecationWarning: In future versions of Node.js, fs.rmdir(path, { recursive: true }) will be removed. Use fs.rm(path, { recursive: true }) instead
2024-08-27T09:43:14.930Z INFO @wdio/local-runner: Waiting for 0 to shut down gracefully
2024-08-27T09:43:14.930Z INFO @wdio/local-runner: shutting down
 ELIFECYCLE  Command failed with exit code 1.

Code of Conduct

Is there an existing issue for this?

wswebcreation commented 2 months ago

This is a copy of https://github.com/webdriverio/webdriverio/issues/13469

wswebcreation commented 2 months ago

Solution: Check the runner, if other than local then throw an error

wswebcreation commented 1 month ago

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