Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

feat(chromium): switch to headless=new by default (#33262)

Browse source 
Co-authored-by: Max Schmitt <max@schmitt.mx>
This commit is contained in:
Dmitry Gozman 2024-11-04 03:56:00 -08:00 committed by GitHub
parent 76ffc2374c
commit 82f6c15e6a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 41 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
.github/workflows/tests_secondary.yml vendored
View file

@ -268,23 +268,6 @@ jobs:
- run: npx playwright install-deps - run: npx playwright install-deps
- run: utils/build/build-playwright-driver.sh - run: utils/build/build-playwright-driver.sh
test_linux_chromium_headless_new:
name: Linux Chromium Headless New
environment: ${{ github.event_name == 'push' && 'allow-uploading-flakiness-results' || null }}
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: ./.github/actions/run-test
with:
browsers-to-install: chromium
command: npm run ctest
bot-name: "headless-new"
flakiness-client-id: ${{ secrets.AZURE_FLAKINESS_DASHBOARD_CLIENT_ID }}
flakiness-tenant-id: ${{ secrets.AZURE_FLAKINESS_DASHBOARD_TENANT_ID }}
flakiness-subscription-id: ${{ secrets.AZURE_FLAKINESS_DASHBOARD_SUBSCRIPTION_ID }}
env:
PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW: 1
test_linux_chromium_headless_shell: test_linux_chromium_headless_shell:
name: Chromium Headless Shell name: Chromium Headless Shell
environment: ${{ github.event_name == 'push' && 'allow-uploading-flakiness-results' || null }} environment: ${{ github.event_name == 'push' && 'allow-uploading-flakiness-results' || null }}

5
packages/playwright-core/src/server/bidi/bidiChromium.ts
View file

@ -112,10 +112,7 @@ export class BidiChromium extends BrowserType {
if (options.devtools) if (options.devtools)
chromeArguments.push('--auto-open-devtools-for-tabs'); chromeArguments.push('--auto-open-devtools-for-tabs');
if (options.headless) { if (options.headless) {
if (process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW) chromeArguments.push('--headless');
chromeArguments.push('--headless=new');
else
chromeArguments.push('--headless=old');
chromeArguments.push( chromeArguments.push(
'--hide-scrollbars', '--hide-scrollbars',

5
packages/playwright-core/src/server/chromium/chromium.ts
View file

@ -309,10 +309,7 @@ export class Chromium extends BrowserType {
if (options.devtools) if (options.devtools)
chromeArguments.push('--auto-open-devtools-for-tabs'); chromeArguments.push('--auto-open-devtools-for-tabs');
if (options.headless) { if (options.headless) {
if (process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW) chromeArguments.push('--headless');
chromeArguments.push('--headless=new');
else
chromeArguments.push('--headless=old');
chromeArguments.push( chromeArguments.push(
'--hide-scrollbars', '--hide-scrollbars',

29
tests/library/browsercontext-credentials.spec.ts
View file

@ -15,33 +15,26 @@
* limitations under the License. * limitations under the License.
*/ */
import { browserTest as base, expect } from '../config/browserTest'; import { browserTest as it, expect } from '../config/browserTest';
const it = base.extend<{ isChromiumHeadedLike: boolean }>({ it('should fail without credentials', async ({ browser, server, browserName, channel }) => {
isChromiumHeadedLike: async ({ browserName, headless }, use) => {
const isChromiumHeadedLike = browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW);
await use(isChromiumHeadedLike);
},
});
it('should fail without credentials', async ({ browser, server, isChromiumHeadedLike }) => {
server.setAuth('/empty.html', 'user', 'pass'); server.setAuth('/empty.html', 'user', 'pass');
const context = await browser.newContext(); const context = await browser.newContext();
const page = await context.newPage(); const page = await context.newPage();
const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e); const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e);
if (isChromiumHeadedLike) if (browserName === 'chromium' && channel !== 'chromium-headless-shell')
expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS'); expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS');
else else
expect(responseOrError.status()).toBe(401); expect(responseOrError.status()).toBe(401);
}); });
it('should work with setHTTPCredentials', async ({ browser, server, isChromiumHeadedLike }) => { it('should work with setHTTPCredentials', async ({ browser, server, browserName, channel }) => {
server.setAuth('/empty.html', 'user', 'pass'); server.setAuth('/empty.html', 'user', 'pass');
const context = await browser.newContext(); const context = await browser.newContext();
const page = await context.newPage(); const page = await context.newPage();
let responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e); let responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e);
if (isChromiumHeadedLike) if (browserName === 'chromium' && channel !== 'chromium-headless-shell')
expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS'); expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS');
else else
expect(responseOrError.status()).toBe(401); expect(responseOrError.status()).toBe(401);
@ -109,21 +102,21 @@ it('should work with correct credentials and matching origin case insensitive',
await context.close(); await context.close();
}); });
it('should fail with correct credentials and mismatching scheme', async ({ browser, server, isChromiumHeadedLike }) => { it('should fail with correct credentials and mismatching scheme', async ({ browser, server, browserName, channel }) => {
server.setAuth('/empty.html', 'user', 'pass'); server.setAuth('/empty.html', 'user', 'pass');
const context = await browser.newContext({ const context = await browser.newContext({
httpCredentials: { username: 'user', password: 'pass', origin: server.PREFIX.replace('http://', 'https://') } httpCredentials: { username: 'user', password: 'pass', origin: server.PREFIX.replace('http://', 'https://') }
}); });
const page = await context.newPage(); const page = await context.newPage();
const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e); const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e);
if (isChromiumHeadedLike) if (browserName === 'chromium' && channel !== 'chromium-headless-shell')
expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS'); expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS');
else else
expect(responseOrError.status()).toBe(401); expect(responseOrError.status()).toBe(401);
await context.close(); await context.close();
}); });
it('should fail with correct credentials and mismatching hostname', async ({ browser, server, isChromiumHeadedLike }) => { it('should fail with correct credentials and mismatching hostname', async ({ browser, server, browserName, channel }) => {
server.setAuth('/empty.html', 'user', 'pass'); server.setAuth('/empty.html', 'user', 'pass');
const hostname = new URL(server.PREFIX).hostname; const hostname = new URL(server.PREFIX).hostname;
const origin = server.PREFIX.replace(hostname, 'mismatching-hostname'); const origin = server.PREFIX.replace(hostname, 'mismatching-hostname');
@ -132,14 +125,14 @@ it('should fail with correct credentials and mismatching hostname', async ({ bro
}); });
const page = await context.newPage(); const page = await context.newPage();
const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e); const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e);
if (isChromiumHeadedLike) if (browserName === 'chromium' && channel !== 'chromium-headless-shell')
expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS'); expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS');
else else
expect(responseOrError.status()).toBe(401); expect(responseOrError.status()).toBe(401);
await context.close(); await context.close();
}); });
it('should fail with correct credentials and mismatching port', async ({ browser, server, isChromiumHeadedLike }) => { it('should fail with correct credentials and mismatching port', async ({ browser, server, browserName, channel }) => {
server.setAuth('/empty.html', 'user', 'pass'); server.setAuth('/empty.html', 'user', 'pass');
const origin = server.PREFIX.replace(server.PORT.toString(), (server.PORT + 1).toString()); const origin = server.PREFIX.replace(server.PORT.toString(), (server.PORT + 1).toString());
const context = await browser.newContext({ const context = await browser.newContext({
@ -147,7 +140,7 @@ it('should fail with correct credentials and mismatching port', async ({ browser
}); });
const page = await context.newPage(); const page = await context.newPage();
const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e); const responseOrError = await page.goto(server.EMPTY_PAGE).catch(e => e);
if (isChromiumHeadedLike) if (browserName === 'chromium' && channel !== 'chromium-headless-shell')
expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS'); expect(responseOrError.message).toContain('net::ERR_INVALID_AUTH_CREDENTIALS');
else else
expect(responseOrError.status()).toBe(401); expect(responseOrError.status()).toBe(401);

4
tests/library/download.spec.ts
View file

@ -636,8 +636,8 @@ it('should be able to download a inline PDF file via response interception', asy
await page.close(); await page.close();
}); });
it('should be able to download a inline PDF file via navigation', async ({ browser, server, asset, browserName, headless }) => { it('should be able to download a inline PDF file via navigation', async ({ browser, server, asset, browserName, channel }) => {
it.fixme(((!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW) && browserName === 'chromium')); it.skip(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'We expect PDF Viewer to open up in Chromium');
const page = await browser.newPage(); const page = await browser.newPage();
await page.goto(server.EMPTY_PAGE); await page.goto(server.EMPTY_PAGE);
await page.setContent(` await page.setContent(`

4
tests/library/emulation-focus.spec.ts
View file

@ -101,9 +101,11 @@ it('should change document.activeElement', async ({ page, server }) => {
expect(active).toEqual(['INPUT', 'TEXTAREA']); expect(active).toEqual(['INPUT', 'TEXTAREA']);
}); });
it('should not affect screenshots', async ({ page, server, browserName, headless, isWindows }) => { it('should not affect screenshots', async ({ page, server, browserName, headless, isWindows, channel }) => {
it.skip(browserName === 'webkit' && isWindows && !headless, 'WebKit/Windows/headed has a larger minimal viewport. See https://github.com/microsoft/playwright/issues/22616'); it.skip(browserName === 'webkit' && isWindows && !headless, 'WebKit/Windows/headed has a larger minimal viewport. See https://github.com/microsoft/playwright/issues/22616');
it.skip(browserName === 'firefox' && !headless, 'Firefox headed produces a different image'); it.skip(browserName === 'firefox' && !headless, 'Firefox headed produces a different image');
// TODO: We want to see test results
// it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'https://github.com/microsoft/playwright/issues/33330');
const page2 = await page.context().newPage(); const page2 = await page.context().newPage();
await Promise.all([ await Promise.all([

7
tests/library/permissions.spec.ts
View file

@ -145,20 +145,19 @@ it.describe('permissions', () => {
}); });
}); });
it('should support clipboard read', async ({ page, context, server, browserName, isWindows, isLinux, headless }) => { it('should support clipboard read', async ({ page, context, server, browserName, isWindows, isLinux, headless, channel }) => {
it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/27475' }); it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/27475' });
it.fail(browserName === 'firefox', 'No such permissions (requires flag) in Firefox'); it.fail(browserName === 'firefox', 'No such permissions (requires flag) in Firefox');
it.fixme(browserName === 'webkit' && isWindows, 'WebPasteboardProxy::allPasteboardItemInfo not implemented for Windows.'); it.fixme(browserName === 'webkit' && isWindows, 'WebPasteboardProxy::allPasteboardItemInfo not implemented for Windows.');
it.fixme(browserName === 'webkit' && isLinux && headless, 'WebPasteboardProxy::allPasteboardItemInfo not implemented for WPE.'); it.fixme(browserName === 'webkit' && isLinux && headless, 'WebPasteboardProxy::allPasteboardItemInfo not implemented for WPE.');
const isChromiumHeadedLike = browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW);
await page.goto(server.EMPTY_PAGE); await page.goto(server.EMPTY_PAGE);
// There is no 'clipboard-read' permission in WebKit Web API. // There is no 'clipboard-read' permission in WebKit Web API.
if (browserName !== 'webkit') if (browserName !== 'webkit')
expect(await getPermission(page, 'clipboard-read')).toBe('prompt'); expect(await getPermission(page, 'clipboard-read')).toBe('prompt');
if (!isChromiumHeadedLike) { if (browserName === 'chromium' && channel === 'chromium-headless-shell') {
// Headed Chromium shows a dialog and does not resolve the promise. // Chromium shows a dialog and does not resolve the promise.
const error = await page.evaluate(() => navigator.clipboard.readText()).catch(e => e); const error = await page.evaluate(() => navigator.clipboard.readText()).catch(e => e);
expect(error.toString()).toContain('denied'); expect(error.toString()).toContain('denied');
} }

8
tests/library/playwright.config.ts
View file

@ -126,13 +126,7 @@ for (const browserName of browserNames) {
metadata: { metadata: {
platform: process.platform, platform: process.platform,
docker: !!process.env.INSIDE_DOCKER, docker: !!process.env.INSIDE_DOCKER,
headless: (() => { headless: headed ? 'headed' : 'headless',
if (process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW)
return 'headless-new';
if (headed)
return 'headed';
return 'headless';
})(),
browserName, browserName,
channel, channel,
mode, mode,

4
tests/library/screenshot.spec.ts
View file

@ -22,7 +22,9 @@ import { verifyViewport } from '../config/utils';
browserTest.describe('page screenshot', () => { browserTest.describe('page screenshot', () => {
browserTest.skip(({ browserName, headless }) => browserName === 'firefox' && !headless, 'Firefox headed produces a different image.'); browserTest.skip(({ browserName, headless }) => browserName === 'firefox' && !headless, 'Firefox headed produces a different image.');
browserTest('should run in parallel in multiple pages', async ({ server, contextFactory }) => { browserTest('should run in parallel in multiple pages', async ({ server, contextFactory, browserName, channel }) => {
// TODO: We want to see test results
// browserTest.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'https://github.com/microsoft/playwright/issues/33330');
const context = await contextFactory(); const context = await contextFactory();
const N = 5; const N = 5;
const pages = await Promise.all(Array(N).fill(0).map(async () => { const pages = await Promise.all(Array(N).fill(0).map(async () => {

4
tests/library/tracing.spec.ts
View file

@ -407,9 +407,9 @@ for (const params of [
height: 768, height: 768,
} }
]) { ]) {
browserTest(`should produce screencast frames ${params.id}`, async ({ video, contextFactory, browserName, platform, headless }, testInfo) => { browserTest(`should produce screencast frames ${params.id}`, async ({ video, contextFactory, browserName, platform, headless, channel }, testInfo) => {
browserTest.skip(browserName === 'chromium' && video === 'on', 'Same screencast resolution conflicts'); browserTest.skip(browserName === 'chromium' && video === 'on', 'Same screencast resolution conflicts');
browserTest.fixme(browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW), 'Chromium screencast on headed has a min width issue'); browserTest.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'Chromium screencast has a min width issue');
browserTest.fixme(params.id === 'fit' && browserName === 'chromium' && platform === 'darwin', 'High DPI maxes image at 600x600'); browserTest.fixme(params.id === 'fit' && browserName === 'chromium' && platform === 'darwin', 'High DPI maxes image at 600x600');
browserTest.fixme(params.id === 'fit' && browserName === 'webkit' && platform === 'linux', 'Image size is flaky'); browserTest.fixme(params.id === 'fit' && browserName === 'webkit' && platform === 'linux', 'Image size is flaky');
browserTest.fixme(browserName === 'firefox' && !headless, 'Image size is different'); browserTest.fixme(browserName === 'firefox' && !headless, 'Image size is different');

19
tests/library/video.spec.ts
View file

@ -473,9 +473,9 @@ it.describe('screencast', () => {
expect(videoFiles.length).toBe(2); expect(videoFiles.length).toBe(2);
}); });
it('should scale frames down to the requested size ', async ({ browser, browserName, server, headless, trace }, testInfo) => { it('should scale frames down to the requested size ', async ({ browser, browserName, server, headless, channel }, testInfo) => {
const isChromiumHeadlessNew = browserName === 'chromium' && !!headless && !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW; it.fixme(!headless, 'Fails on headed');
it.fixme(!headless || isChromiumHeadlessNew, 'Fails on headed'); it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'Fails on Chromiums');
const context = await browser.newContext({ const context = await browser.newContext({
recordVideo: { recordVideo: {
@ -722,9 +722,9 @@ it.describe('screencast', () => {
expect(files.length).toBe(1); expect(files.length).toBe(1);
}); });
it('should capture full viewport', async ({ browserType, browserName, headless, isWindows }, testInfo) => { it('should capture full viewport', async ({ browserType, browserName, isWindows, channel }, testInfo) => {
it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/22411' }); it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/22411' });
it.fixme(browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW), 'The square is not on the video'); it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'The square is not on the video');
it.fixme(browserName === 'firefox' && isWindows, 'https://github.com/microsoft/playwright/issues/14405'); it.fixme(browserName === 'firefox' && isWindows, 'https://github.com/microsoft/playwright/issues/14405');
const size = { width: 600, height: 400 }; const size = { width: 600, height: 400 };
const browser = await browserType.launch(); const browser = await browserType.launch();
@ -757,9 +757,9 @@ it.describe('screencast', () => {
expectAll(pixels, almostRed); expectAll(pixels, almostRed);
}); });
it('should capture full viewport on hidpi', async ({ browserType, browserName, headless, isWindows, isLinux }, testInfo) => { it('should capture full viewport on hidpi', async ({ browserType, browserName, headless, isWindows, isLinux, channel }, testInfo) => {
it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/22411' }); it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/22411' });
it.fixme(browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW), 'The square is not on the video'); it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'The square is not on the video');
it.fixme(browserName === 'firefox' && isWindows, 'https://github.com/microsoft/playwright/issues/14405'); it.fixme(browserName === 'firefox' && isWindows, 'https://github.com/microsoft/playwright/issues/14405');
it.fixme(browserName === 'webkit' && isLinux && !headless, 'https://github.com/microsoft/playwright/issues/22617'); it.fixme(browserName === 'webkit' && isLinux && !headless, 'https://github.com/microsoft/playwright/issues/22617');
const size = { width: 600, height: 400 }; const size = { width: 600, height: 400 };
@ -794,9 +794,10 @@ it.describe('screencast', () => {
expectAll(pixels, almostRed); expectAll(pixels, almostRed);
}); });
it('should work with video+trace', async ({ browser, trace, headless }, testInfo) => { it('should work with video+trace', async ({ browser, trace, headless, browserName, channel }, testInfo) => {
it.skip(trace === 'on'); it.skip(trace === 'on');
it.fixme(!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW, 'different trace screencast image size on all browsers'); it.fixme(!headless, 'different trace screencast image size on all browsers');
it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'different trace screencast image size on Chromium');
const size = { width: 500, height: 400 }; const size = { width: 500, height: 400 };
const traceFile = testInfo.outputPath('trace.zip'); const traceFile = testInfo.outputPath('trace.zip');

10
tests/page/page-focus.spec.ts
View file

@ -119,9 +119,8 @@ it('clicking checkbox should activate it', async ({ page, browserName, headless,
it('tab should cycle between single input and browser', { it('tab should cycle between single input and browser', {
annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32339' } annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32339' }
}, async ({ page, browserName, headless }) => { }, async ({ page, browserName, channel }) => {
it.fixme(browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW), it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'Chromium keeps input focused.');
'Chromium in headful mode keeps input focused.');
it.fixme(browserName !== 'chromium'); it.fixme(browserName !== 'chromium');
await page.setContent(`<label for="input1">input1</label> await page.setContent(`<label for="input1">input1</label>
<input id="input1"> <input id="input1">
@ -147,9 +146,8 @@ it('tab should cycle between single input and browser', {
it('tab should cycle between document elements and browser', { it('tab should cycle between document elements and browser', {
annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32339' } annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32339' }
}, async ({ page, browserName, headless }) => { }, async ({ page, browserName, channel }) => {
it.fixme(browserName === 'chromium' && (!headless || !!process.env.PLAYWRIGHT_CHROMIUM_USE_HEADLESS_NEW), it.fixme(browserName === 'chromium' && channel !== 'chromium-headless-shell', 'Chromium keeps last input focused.');
'Chromium in headful mode keeps last input focused.');
it.fixme(browserName !== 'chromium'); it.fixme(browserName !== 'chromium');
await page.setContent(` await page.setContent(`
<input id="input1"> <input id="input1">