diff --git a/packages/browser/src/node/providers/playwright.ts b/packages/browser/src/node/providers/playwright.ts index 2fba6668d847..cef27c34f629 100644 --- a/packages/browser/src/node/providers/playwright.ts +++ b/packages/browser/src/node/providers/playwright.ts @@ -1,6 +1,5 @@ import type { Browser, - BrowserContext, BrowserContextOptions, Frame, @@ -67,10 +66,22 @@ export class PlaywrightBrowserProvider implements BrowserProvider { const playwright = await import('playwright') - const browser = await playwright[this.browserName].launch({ + const launchOptions = { ...this.options?.launch, headless: options.headless, - }) + } satisfies LaunchOptions + + // start Vitest UI maximized only on supported browsers + if (this.ctx.config.browser.ui && this.browserName === 'chromium') { + if (!launchOptions.args) { + launchOptions.args = [] + } + if (!launchOptions.args.includes('--start-maximized') && !launchOptions.args.includes('--start-fullscreen')) { + launchOptions.args.push('--start-maximized') + } + } + + const browser = await playwright[this.browserName].launch(launchOptions) this.browser = browser this.browserPromise = null return this.browser @@ -85,11 +96,15 @@ export class PlaywrightBrowserProvider implements BrowserProvider { } const browser = await this.openBrowser() - const context = await browser.newContext({ + const options = { ...this.options?.context, ignoreHTTPSErrors: true, serviceWorkers: 'allow', - }) + } satisfies BrowserContextOptions + if (this.ctx.config.browser.ui) { + options.viewport = null + } + const context = await browser.newContext(options) this.contexts.set(contextId, context) return context } diff --git a/packages/browser/src/node/providers/webdriver.ts b/packages/browser/src/node/providers/webdriver.ts index 074592ece2ca..810d91ab1916 100644 --- a/packages/browser/src/node/providers/webdriver.ts +++ b/packages/browser/src/node/providers/webdriver.ts @@ -104,6 +104,19 @@ export class WebdriverBrowserProvider implements BrowserProvider { capabilities[key] = { ...currentValues, args: newArgs as any } } + // start Vitest UI maximized only on supported browsers + if (options.ui && (browser === 'chrome' || browser === 'edge')) { + const key = browser === 'chrome' + ? 'goog:chromeOptions' + : 'ms:edgeOptions' + const args = capabilities[key]?.args || [] + if (!args.includes('--start-maximized') && !args.includes('--start-fullscreen')) { + args.push('--start-maximized') + } + capabilities[key] ??= {} + capabilities[key]!.args = args + } + return capabilities } diff --git a/test/browser/specs/runner.test.ts b/test/browser/specs/runner.test.ts index 5065cc3498bd..396841a0ccdb 100644 --- a/test/browser/specs/runner.test.ts +++ b/test/browser/specs/runner.test.ts @@ -23,8 +23,8 @@ describe('running browser tests', async () => { console.error(stderr) }) - expect(browserResultJson.testResults).toHaveLength(18) - expect(passedTests).toHaveLength(16) + expect(browserResultJson.testResults).toHaveLength(19) + expect(passedTests).toHaveLength(17) expect(failedTests).toHaveLength(2) expect(stderr).not.toContain('has been externalized for browser compatibility') diff --git a/test/browser/test/viewport.test.ts b/test/browser/test/viewport.test.ts new file mode 100644 index 000000000000..146faae1c66a --- /dev/null +++ b/test/browser/test/viewport.test.ts @@ -0,0 +1,27 @@ +import { page, server } from '@vitest/browser/context' +import { describe, expect, it } from 'vitest' + +describe.skipIf(server.provider === 'preview')('viewport window has been properly initialized', () => { + it.skipIf(!page.config.browser.headless)('viewport has proper size', () => { + const { width, height } = page.config.browser.viewport + const { width: actualWidth, height: actualHeight } = window.document.documentElement.getBoundingClientRect() + + expect(actualWidth).toBe(width) + expect(actualHeight).toBe(height) + }) + + it.skipIf(page.config.browser.headless)('window has been maximized', () => { + let topWindow = window + while (topWindow.parent && topWindow !== topWindow.parent) { + topWindow = topWindow.parent as unknown as any + } + + // edge will show the Hub Apps right panel + if (server.browser === 'edge') { + expect(topWindow.visualViewport.width - topWindow.innerWidth === 0).toBe(true) + } + else { + expect(screen.availWidth - topWindow.innerWidth === 0).toBe(true) + } + }) +})