playwright/tests/page/page-event-console.spec.ts
Andrey Lushnikov 9ca9b08d90
fix: better formatting for sparse arrays (#20379)
Right now arrays preview yields all array elements. In case
of a sparse array with a single element on index 10000000,
this results in a large string that OOM Node.js.

This patch changes pretty-printing. For example:

```ts
// Given this array
const a = [];
a[10] = 1;
// Before this patch, pretty printing will yield:
"[,,,,,,,,1]"
// With this patch, pretty printing yields:
"[empty x 9, 1]"
```

The new array pretty-printing is equal to what Chrome DevTools
do to render sparse arrays.

Fixes #20347
2023-01-27 05:07:55 -08:00

204 lines
7.6 KiB
TypeScript

/**
* Copyright 2017 Google Inc. All rights reserved.
* Modifications copyright (c) Microsoft Corporation.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { test as it, expect } from './pageTest';
import util from 'util';
it('should work @smoke', async ({ page, browserName }) => {
let message = null;
page.once('console', m => message = m);
await Promise.all([
page.evaluate(() => console.log('hello', 5, { foo: 'bar' })),
page.waitForEvent('console')
]);
if (browserName !== 'firefox')
expect(message.text()).toEqual('hello 5 {foo: bar}');
else
expect(message.text()).toEqual('hello 5 JSHandle@object');
expect(message.type()).toEqual('log');
expect(await message.args()[0].jsonValue()).toEqual('hello');
expect(await message.args()[1].jsonValue()).toEqual(5);
expect(await message.args()[2].jsonValue()).toEqual({ foo: 'bar' });
});
it('should emit same log twice', async ({ page }) => {
const messages = [];
page.on('console', m => messages.push(m.text()));
await page.evaluate(() => { for (let i = 0; i < 2; ++i) console.log('hello'); });
expect(messages).toEqual(['hello', 'hello']);
});
it('should use text() for inspection', async ({ page }) => {
let text;
const inspect = value => {
text = util.inspect(value);
};
page.on('console', inspect);
await page.evaluate(() => console.log('Hello world'));
expect(text).toEqual('Hello world');
});
it('should work for different console API calls', async ({ page }) => {
const messages = [];
page.on('console', msg => messages.push(msg));
// All console events will be reported before `page.evaluate` is finished.
await page.evaluate(() => {
// A pair of time/timeEnd generates only one Console API call.
console.time('calling console.time');
console.timeEnd('calling console.time');
console.trace('calling console.trace');
console.dir('calling console.dir');
console.warn('calling console.warn');
console.error('calling console.error');
console.info('calling console.info');
console.debug('calling console.debug');
console.log(Promise.resolve('should not wait until resolved!'));
});
// WebKit uses console.debug() to report binding calls, make sure they don't get reported.
await page.exposeBinding('foobar', async (_, value) => page.evaluate(value => console.log(value), value));
await page.evaluate(() => window['foobar']('Using bindings'));
expect(messages.map(msg => msg.type())).toEqual([
'timeEnd', 'trace', 'dir', 'warning', 'error', 'info', 'debug', 'log', 'log'
]);
expect(messages[0].text()).toContain('calling console.time');
expect(messages.slice(1).map(msg => msg.text())).toEqual([
'calling console.trace',
'calling console.dir',
'calling console.warn',
'calling console.error',
'calling console.info',
'calling console.debug',
'Promise',
'Using bindings',
]);
});
it('should format the message correctly with time/timeLog/timeEnd', async ({ page, browserName }) => {
it.fixme(browserName === 'firefox', 'https://github.com/microsoft/playwright/issues/10580');
const messages = [];
page.on('console', msg => messages.push(msg));
await page.evaluate(async () => {
console.time('foo time');
await new Promise(x => setTimeout(x, 100));
console.timeLog('foo time');
await new Promise(x => setTimeout(x, 100));
console.timeEnd('foo time');
});
expect(messages.length).toBe(2);
if (browserName === 'webkit')
expect(messages[0].type()).toBe('timeEnd');
else if (browserName === 'chromium')
expect(messages[0].type()).toBe('log');
expect(messages[1].type()).toBe('timeEnd');
// WebKit has a space before the unit: https://bugs.webkit.org/show_bug.cgi?id=233556
expect(messages[0].text()).toMatch(/foo time: \d+.\d+ ?ms/);
expect(messages[1].text()).toMatch(/foo time: \d+.\d+ ?ms/);
});
it('should not fail for window object', async ({ page, browserName }) => {
let message = null;
page.once('console', msg => message = msg);
await Promise.all([
page.evaluate(() => console.error(window)),
page.waitForEvent('console')
]);
if (browserName !== 'firefox')
expect(message.text()).toEqual('Window');
else
expect(message.text()).toEqual('JSHandle@object');
});
it('should trigger correct Log', async ({ page, server, browserName, isWindows }) => {
it.skip(browserName === 'webkit' && isWindows, 'Upstream issue https://bugs.webkit.org/show_bug.cgi?id=229515');
await page.goto('about:blank');
const [message] = await Promise.all([
page.waitForEvent('console'),
page.evaluate(async url => fetch(url).catch(e => {}), server.EMPTY_PAGE)
]);
expect(message.text()).toContain('Access-Control-Allow-Origin');
expect(message.type()).toEqual('error');
});
it('should have location for console API calls', async ({ page, server }) => {
await page.goto(server.EMPTY_PAGE);
const [message] = await Promise.all([
page.waitForEvent('console', m => m.text().startsWith('here:')),
page.goto(server.PREFIX + '/consolelog.html'),
]);
expect(message.type()).toBe('log');
const location = message.location();
// Engines have different column notion.
delete location.columnNumber;
expect(location).toEqual({
url: server.PREFIX + '/consolelog.html',
lineNumber: 7,
});
});
it('should not throw when there are console messages in detached iframes', async ({ page, server }) => {
// @see https://github.com/GoogleChrome/puppeteer/issues/3865
await page.goto(server.EMPTY_PAGE);
const [popup] = await Promise.all([
page.waitForEvent('popup'),
page.evaluate(async () => {
// 1. Create a popup that Playwright is not connected to.
const win = window.open('');
window['_popup'] = win;
if (window.document.readyState !== 'complete')
await new Promise(f => window.addEventListener('load', f));
// 2. In this popup, create an iframe that console.logs a message.
win.document.body.innerHTML = `<iframe src='/consolelog.html'></iframe>`;
const frame = win.document.querySelector('iframe');
if (!frame.contentDocument || frame.contentDocument.readyState !== 'complete')
await new Promise(f => frame.addEventListener('load', f));
// 3. After that, remove the iframe.
frame.remove();
}),
]);
// 4. Connect to the popup and make sure it doesn't throw.
expect(await popup.evaluate('1 + 1')).toBe(2);
});
it('should use object previews for arrays and objects', async ({ page, browserName }) => {
let text: string;
page.on('console', message => {
text = message.text();
});
await page.evaluate(() => console.log([1, 2, 3], { a: 1 }, window));
if (browserName !== 'firefox')
expect(text).toEqual('[1, 2, 3] {a: 1} Window');
else
expect(text).toEqual('Array JSHandle@object JSHandle@object');
});
it('should use object previews for errors', async ({ page, browserName }) => {
let text: string;
page.on('console', message => {
text = message.text();
});
await page.evaluate(() => console.log(new Error('Exception')));
if (browserName === 'chromium')
expect(text).toContain('.evaluate');
if (browserName === 'webkit')
expect(text).toEqual('Error: Exception');
if (browserName === 'firefox')
expect(text).toEqual('Error');
});