Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(vitest): headless mode not working when using webdriverio (fix #3930) #3996

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
81c67c6
fix(vitest): headless mode not working when using webdriverio
LorenzoBloedow Aug 20, 2023
eb9b04e
Revert changes to pnpm-lock.yaml
LorenzoBloedow Aug 25, 2023
0cb1d4b
Add only the new dev dependency to lockfile
LorenzoBloedow Aug 28, 2023
4a98aea
Revert lockfile to upstream
LorenzoBloedow Sep 4, 2023
8e3e308
Move @wdio/types to the package where it's used
LorenzoBloedow Sep 5, 2023
63d5fe5
Add @wdio/types and its dependencies to lockfile
LorenzoBloedow Sep 5, 2023
a27202c
Merge branch 'main' into fix-headless-browser
sheremet-va Sep 8, 2023
585dbf3
Fix capabilities types
LorenzoBloedow Sep 9, 2023
b47efde
Merge branch 'fix-headless-browser' of https://github.com/LorenzoBloe…
LorenzoBloedow Sep 9, 2023
3f5a36d
Merge upstream 'main' into fix-headless-browser
LorenzoBloedow Sep 13, 2023
843ed21
Merge branch 'main' into fix-headless-browser
sheremet-va Sep 14, 2023
54f0a29
Merge branch 'main' into fix-headless-browser
LorenzoBloedow Sep 17, 2023
3e6e76a
Merge upstream 'main' into 'fix-headless-browser' and fix duplicate k…
LorenzoBloedow Sep 17, 2023
890d60d
Fix test trying to use headless mode with Safari
LorenzoBloedow Sep 18, 2023
afb999d
Merge branch 'main' into fix-headless-browser
LorenzoBloedow Sep 18, 2023
fd32cfe
Merge branch 'main' into fix-headless-browser
sheremet-va Sep 20, 2023
e65a3d4
Merge branch 'main' into fix-headless-browser
LorenzoBloedow Sep 27, 2023
3260a31
Merge branch 'main' into fix-headless-browser
LorenzoBloedow Sep 29, 2023
fb021d4
Merge branch 'fix-headless-browser' of https://github.com/LorenzoBloe…
LorenzoBloedow Sep 29, 2023
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/vitest/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -180,6 +180,7 @@
"@types/micromatch": "^4.0.2",
"@types/prompts": "^2.4.4",
"@types/sinonjs__fake-timers": "^8.1.2",
"@wdio/types": "^8.16.3",
"birpc": "0.2.14",
"chai-subset": "^1.6.0",
"cli-truncate": "^3.1.0",
Expand Down
64 changes: 60 additions & 4 deletions packages/vitest/src/node/browser/webdriver.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import type { Awaitable } from '@vitest/utils'
import type { Capabilities } from '@wdio/types'
import type { BrowserProvider, BrowserProviderOptions } from '../../types/browser'
import { ensurePackageInstalled } from '../pkg'
import type { WorkspaceProject } from '../workspace'
Expand All @@ -10,6 +11,14 @@ export interface WebdriverProviderOptions extends BrowserProviderOptions {
browser: WebdriverBrowser
}

type BrowserOptionsKey = 'goog:chromeOptions' | 'moz:firefoxOptions' | 'ms:edgeOptions'
interface WebdriverBrowserExtensionMapValue {
key: BrowserOptionsKey
value: {
args: string[]
}
}

export class WebdriverBrowserProvider implements BrowserProvider {
public name = 'webdriverio'

Expand Down Expand Up @@ -42,6 +51,9 @@ export class WebdriverBrowserProvider implements BrowserProvider {
const options = this.ctx.config.browser

if (this.browser === 'safari') {
if (options.headless)
throw new Error('You\'ve enabled headless mode for Safari but it doesn\'t currently support it')

const safaridriver = await import('safaridriver')
safaridriver.start({ diagnose: true })
this.stopSafari = () => safaridriver.stop()
Expand All @@ -53,13 +65,57 @@ export class WebdriverBrowserProvider implements BrowserProvider {

const { remote } = await import('webdriverio')

const webdriverBrowserExtensionMap: {
chrome: WebdriverBrowserExtensionMapValue
firefox: WebdriverBrowserExtensionMapValue
edge: WebdriverBrowserExtensionMapValue
} = {
chrome: {
key: 'goog:chromeOptions',
value: {
args: [],
},
},
firefox: {
key: 'moz:firefoxOptions',
value: {
args: [],
},
},
edge: {
key: 'ms:edgeOptions',
value: {
args: [],
},
},
}

const capabilities: Capabilities.VendorExtensions & {
browserName: WebdriverProviderOptions['browser']
} = {
browserName: this.browser,
}

if (this.browser !== 'safari') {
if (options.headless) {
switch (this.browser) {
case 'chrome':
webdriverBrowserExtensionMap[this.browser].value.args = webdriverBrowserExtensionMap[this.browser].value.args.concat(['headless', 'disable-gpu'])
break
case 'firefox':
webdriverBrowserExtensionMap[this.browser].value.args.push('-headless')
break
case 'edge':
webdriverBrowserExtensionMap[this.browser].value.args.push('--headless')
Copy link
Member

@userquin userquin Oct 13, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we can use same configuration for chrome

}
}
capabilities[webdriverBrowserExtensionMap[this.browser].key] = webdriverBrowserExtensionMap[this.browser].value
}

// TODO: close everything, if browser is closed from the outside
this.cachedBrowser = await remote({
logLevel: 'error',
capabilities: {
'browserName': this.browser,
'wdio:devtoolsOptions': { headless: options.headless },
},
capabilities,
})

return this.cachedBrowser
Expand Down
3 changes: 3 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

11 changes: 8 additions & 3 deletions test/browser/specs/runner.test.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,12 @@ import { execa } from 'execa'

const browser = process.env.BROWSER || (process.env.PROVIDER === 'playwright' ? 'chromium' : 'chrome')

const { stderr, stdout } = await execa('npx', ['vitest', '--run', `--browser.name=${browser}`, '--browser.headless'], {
const testArgs = ['vitest', '--run', `--browser.name=${browser}`]
// Safari doesn't support headless mode
if (browser !== 'safari')
testArgs.push('--browser.headless')

const { stderr, stdout } = await execa('npx', testArgs, {
env: {
...process.env,
CI: 'true',
Expand All @@ -24,8 +29,8 @@ const passedTests = getPassed(browserResultJson.testResults)
const failedTests = getFailed(browserResultJson.testResults)

await test('tests are actually running', async () => {
assert.ok(browserResultJson.testResults.length === 8, 'Not all the tests have been run')
assert.ok(passedTests.length === 7, 'Some tests failed')
assert.ok(browserResultJson.testResults.length === 9, 'Not all the tests have been run')
assert.ok(passedTests.length === 8, 'Some tests failed')
assert.ok(failedTests.length === 1, 'Some tests have passed but should fail')

assert.doesNotMatch(stderr, /Unhandled Error/, 'doesn\'t have any unhandled errors')
Expand Down
5 changes: 5 additions & 0 deletions test/browser/test/headless.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { expect, it } from 'vitest'

it('is running in headless mode', () => {
expect(navigator.userAgent.search(/headless/i)).not.toBe(-1)
})
Loading