Cypress spec window not showing in experiment webkit, resulting in blank page

Current behavior

I have an existing cypress test suite which runs fine in Chrome and Electron, i have experimented with webkit , when the cypress open command runs and selected with Webkit, it resulting to blank page.

playwright-webkit added with command : yarn add --dev playwright-webkit

Engine: node : v18.0.0 yarn : 1.22.18

Specification : “cypress”: “~10.11.0” “playwright-webkit”: “~1.28.0”

OS: macOS : v12.6

Cypress Open

Cypress Run

Cypress started in fd-sb-aw mode [0] [0] ==================================================================================================== [0] [0] (Run Starting) [0] [0] ┌────────────────────────────────────────────────────────────────────────────────────────────────┐ [0] │ Cypress: 10.11.0 │ [0] │ Browser: WebKit 16 (headless) │ [0] │ Node Version: v18.0.0 (/opt/homebrew/Cellar/node/18.0.0/bin/node) │ [0] │ Specs: 71 found (…) │ [0] │ Searched: /…//*.js │ [0] │ Experiments: experimentalInteractiveRunEvents=true,experimentalWebKitSupport=true │ [0] └────────────────────────────────────────────────────────────────────────────────────────────────┘ [0] [0] [0] ──────────────────────────────────────────────────────────────────────────────────────────────────── [0]
[0] Running: fd-sb-aw/account/sso_recovery.spec.js (1 of 71) [0] [0] Your project has set the configuration option: chromeWebSecurity to false. [0] [0] This option will not have an effect in Webkit. Tests that rely on web security being disabled will not run as expected. [0] [0] Timed out waiting for the browser to connect. Retrying…

Desired behavior

Like Chrome and Electron, it should load the identified spec in webkit

Test code to reproduce

Engine: node : v18.0.0 yarn : 1.22.18

Specification : “cypress”: “~10.11.0” “playwright-webkit”: “~1.28.0”

OS: macOS : v12.6

Cypress Version

10.11.0

Node version

v18.0.0

Operating System

12.6

Debug Logs

No response

Other

No response

[tbiethman]

Hi @manoj-fd, I started investigating this a bit and had a quick question off the jump. Looking at your example index.js:

module.exports = (on, config) => {
    
    Object.assign(config, {
        baseUrl: 'https://localhost:3001',
    })

    return config
}

Are you actually serving that route over https? I ask because I was able reproduce the blank webkit based on the prior posts, but I saw an error in the WebKit console that pointed out that my local server wasn’t actually serving over https:

Changing the baseUrl to use http corrected this, as that is how my local server was actually serving it.

I also ask because you mention that your config works in Chrome and Electron. Those browsers (as well as Firefox) are more graceful when it comes to the protocol mismatch and will show that the connection is not secured in the url bar rather than fail, which could explain the differences in behavior you’re seeing:

So I’m just curious if this lines up with what you’re seeing locally, and if using http rather than https corrects your immediate issues launching WebKit. If so, there’s definitely work to be done with Cypress to actually surface these errors in the UI. If not, we’ll have to do a bit more digging.

[vladlearns]

For me, the issue was in playwright-webkit v1.29.0. Downgrading it to v1.28.0 fixed the issue @manoj-fd

edit: make sure you removed the node_modules and package-lock.json