fix: add screen option to test runner fixtures

packages/playwright/src/index.ts

@@ -284,6 +284,7 @@ const playwrightFixtures: Fixtures<TestFixtures, WorkerFixtures, UtilityTestFixt
   timezoneId: [({ contextOptions }, use) => use(contextOptions.timezoneId), { option: true, box: true }],
   userAgent: [({ contextOptions }, use) => use(contextOptions.userAgent), { option: true, box: true }],
   viewport: [({ contextOptions }, use) => use(contextOptions.viewport === undefined ? { width: 1280, height: 720 } : contextOptions.viewport), { option: true, box: true }],
+  screen: [({ contextOptions }, use) => use(contextOptions.screen), { option: true, box: true }],
   actionTimeout: [0, { option: true, box: true }],
   navigationTimeout: [0, { option: true, box: true }],
   baseURL: [async ({ }, use) => {
@@ -311,6 +312,7 @@ const playwrightFixtures: Fixtures<TestFixtures, WorkerFixtures, UtilityTestFixt
     permissions,
     proxy,
     reducedMotion,
+    screen,
     storageState,
     viewport,
     timezoneId,
@@ -356,6 +358,8 @@ const playwrightFixtures: Fixtures<TestFixtures, WorkerFixtures, UtilityTestFixt
       options.proxy = proxy;
     if (reducedMotion !== undefined)
       options.reducedMotion = reducedMotion;
+    if (screen !== undefined)
+      options.screen = screen;
     if (storageState !== undefined)
       options.storageState = storageState;
     if (clientCertificates?.length)

tests/playwright-test/playwright.config.spec.ts

@@ -242,3 +242,67 @@ test('should respect testIdAttribute with multiple comma-separated names', async
   expect(result.exitCode).toBe(0);
   expect(result.passed).toBe(1);
 });
+
+
+test('should support screen option in test runner', async ({ runInlineTest }) => {
+  const result = await runInlineTest({
+    'playwright.config.ts': `
+      import { defineConfig, devices } from '@playwright/test';
+      export default defineConfig({
+        projects: [
+          {
+            name: 'chromium',
+            use: { ...devices['iPhone 13'] },
+          },
+        ],
+      });
+    `,
+    'a.test.ts': `
+      import { test, expect } from '@playwright/test';
+      test('screen should match device descriptor', async ({ page }) => {
+        const screen = await page.evaluate(() => ({
+          width: window.screen.width,
+          height: window.screen.height
+        }));
+        // iPhone 13 has screen dimensions of 390x844
+        expect(screen.width).toBe(390);
+        expect(screen.height).toBe(844);
+      });
+    `,
+  }, { workers: 1 });
+
+  expect(result.exitCode).toBe(0);
+  expect(result.passed).toBe(1);
+});
+
+test('should support explicit screen option', async ({ runInlineTest }) => {
+  const result = await runInlineTest({
+    'playwright.config.ts': `
+      export default {
+        use: {
+          screen: { width: 1920, height: 1080 },
+          viewport: { width: 800, height: 600 }
+        }
+      };
+    `,
+    'a.test.ts': `
+      import { test, expect } from '@playwright/test';
+      test('screen should differ from viewport', async ({ page }) => {
+        const viewport = page.viewportSize();
+        const screen = await page.evaluate(() => ({
+          width: window.screen.width,
+          height: window.screen.height
+        }));
+        // Viewport is 800x600
+        expect(viewport.width).toBe(800);
+        expect(viewport.height).toBe(600);
+        // But screen is 1920x1080
+        expect(screen.width).toBe(1920);
+        expect(screen.height).toBe(1080);
+      });
+    `,
+  }, { workers: 1 });
+
+  expect(result.exitCode).toBe(0);
+  expect(result.passed).toBe(1);
+});

utils/generate_types/overrides-test.d.ts

@@ -299,6 +299,7 @@ export interface PlaywrightTestOptions {
   permissions: string[] | undefined;
   proxy: Proxy | undefined;
   reducedMotion: ReducedMotion;
+  screen: ViewportSize | undefined;
   storageState: StorageState | undefined;
   timezoneId: string | undefined;
   userAgent: string | undefined;