Skip to content

Commit

Permalink
chore(types): convert tests to typescript part 3 (#3340)
Browse files Browse the repository at this point in the history
  • Loading branch information
JoelEinbinder authored Aug 7, 2020
1 parent 1bcbf19 commit eac8aee
Show file tree
Hide file tree
Showing 17 changed files with 359 additions and 318 deletions.
2 changes: 1 addition & 1 deletion src/browserContext.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ import { ProgressController } from './progress';
import { DebugController } from './debug/debugController';
import { LoggerSink } from './loggerSink';

export interface BrowserContext {
export interface BrowserContext extends EventEmitter {
setDefaultNavigationTimeout(timeout: number): void;
setDefaultTimeout(timeout: number): void;
pages(): Page[];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
* limitations under the License.
*/

import utils from './utils';
const {FFOX, CHROMIUM, WEBKIT} = testOptions;

it.skip(CHROMIUM)('should be missing', async function({page, server}) {
Expand Down
42 changes: 25 additions & 17 deletions test/chromium/oopif.spec.js → test/chromium/oopif.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,17 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Page, Browser, BrowserContext } from '../../types/types';

const {FFOX, CHROMIUM, WEBKIT, CHANNEL} = testOptions;

declare global {
interface FixtureState {
sppBrowser: Browser;
sppContext: BrowserContext;
sppPage: Page;
}
}
registerFixture('sppBrowser', async ({browserType, defaultBrowserOptions}, test) => {
const browser = await browserType.launch({
...defaultBrowserOptions,
Expand Down Expand Up @@ -76,13 +84,13 @@ it.skip(!CHROMIUM)('should handle remote -> local -> remote transitions', async
expect(await page.frames()[1].evaluate(() => '' + location.href)).toBe(server.CROSS_PROCESS_PREFIX + '/grid.html');
await Promise.all([
page.frames()[1].waitForNavigation(),
page.evaluate(() => goLocal()),
page.evaluate('goLocal()'),
]);
expect(await page.frames()[1].evaluate(() => '' + location.href)).toBe(server.PREFIX + '/grid.html');
expect(await countOOPIFs(browser)).toBe(0);
await Promise.all([
page.frames()[1].waitForNavigation(),
page.evaluate(() => goRemote()),
page.evaluate('goRemote()'),
]);
expect(await page.frames()[1].evaluate(() => '' + location.href)).toBe(server.CROSS_PROCESS_PREFIX + '/grid.html');
expect(await countOOPIFs(browser)).toBe(1);
Expand Down Expand Up @@ -118,7 +126,7 @@ it.skip(!CHROMIUM)('should expose function', async({sppBrowser, sppPage, server}
const oopif = page.frames()[1];
await page.exposeFunction('mul', (a, b) => a * b);
const result = await oopif.evaluate(async function() {
return await mul(9, 4);
return await window['mul'](9, 4);
});
expect(result).toBe(36);
});
Expand Down Expand Up @@ -252,25 +260,25 @@ it.skip(!CHROMIUM)('should support exposeFunction', async function({sppBrowser,
await page.goto(server.PREFIX + '/dynamic-oopif.html');
expect(await countOOPIFs(browser)).toBe(1);
expect(page.frames().length).toBe(2);
expect(await page.frames()[0].evaluate(() => inc(3))).toBe(4);
expect(await page.frames()[1].evaluate(() => inc(4))).toBe(5);
expect(await page.frames()[0].evaluate(() => dec(3))).toBe(2);
expect(await page.frames()[1].evaluate(() => dec(4))).toBe(3);
expect(await page.frames()[0].evaluate(() => window['inc'](3))).toBe(4);
expect(await page.frames()[1].evaluate(() => window['inc'](4))).toBe(5);
expect(await page.frames()[0].evaluate(() => window['dec'](3))).toBe(2);
expect(await page.frames()[1].evaluate(() => window['dec'](4))).toBe(3);
});

it.skip(!CHROMIUM)('should support addInitScript', async function({sppBrowser, sppContext, sppPage, server}) {
const browser = sppBrowser;
const context = sppContext;
const page = sppPage;
await context.addInitScript(() => window.bar = 17);
await page.addInitScript(() => window.foo = 42);
await context.addInitScript(() => window['bar'] = 17);
await page.addInitScript(() => window['foo'] = 42);
await page.goto(server.PREFIX + '/dynamic-oopif.html');
expect(await countOOPIFs(browser)).toBe(1);
expect(page.frames().length).toBe(2);
expect(await page.frames()[0].evaluate(() => window.foo)).toBe(42);
expect(await page.frames()[1].evaluate(() => window.foo)).toBe(42);
expect(await page.frames()[0].evaluate(() => window.bar)).toBe(17);
expect(await page.frames()[1].evaluate(() => window.bar)).toBe(17);
expect(await page.frames()[0].evaluate(() => window['foo'])).toBe(42);
expect(await page.frames()[1].evaluate(() => window['foo'])).toBe(42);
expect(await page.frames()[0].evaluate(() => window['bar'])).toBe(17);
expect(await page.frames()[1].evaluate(() => window['bar'])).toBe(17);
});
// @see https://github.com/microsoft/playwright/issues/1240
it.skip(!CHROMIUM)('should click a button when it overlays oopif', async function({sppBrowser, sppPage, server}) {
Expand All @@ -279,7 +287,7 @@ it.skip(!CHROMIUM)('should click a button when it overlays oopif', async functio
await page.goto(server.PREFIX + '/button-overlay-oopif.html');
expect(await countOOPIFs(browser)).toBe(1);
await page.click('button');
expect(await page.evaluate(() => window.BUTTON_CLICKED)).toBe(true);
expect(await page.evaluate(() => window['BUTTON_CLICKED'])).toBe(true);
});

it.skip(!CHROMIUM)('should report google.com frame with headful', async({browserType, defaultBrowserOptions, server}) => {
Expand Down Expand Up @@ -325,7 +333,7 @@ it.skip(!CHROMIUM)('ElementHandle.boundingBox() should work', async function({sp

await Promise.all([
page.frames()[1].waitForNavigation(),
page.evaluate(() => goLocal()),
page.evaluate('goLocal()'),
]);
expect(await countOOPIFs(browser)).toBe(0);
const handle2 = await page.frames()[1].$('.box:nth-of-type(13)');
Expand All @@ -346,9 +354,9 @@ it.skip(!CHROMIUM)('should click', async function({sppBrowser, sppPage, server})

expect(await countOOPIFs(browser)).toBe(1);
const handle1 = await page.frames()[1].$('.box:nth-of-type(13)');
await handle1.evaluate(div => div.addEventListener('click', () => window._clicked = true, false));
await handle1.evaluate(div => div.addEventListener('click', () => window['_clicked'] = true, false));
await handle1.click();
expect(await handle1.evaluate(() => window._clicked)).toBe(true);
expect(await handle1.evaluate(() => window['_clicked'])).toBe(true);
});

async function countOOPIFs(browser) {
Expand Down
43 changes: 24 additions & 19 deletions test/chromium/tracing.spec.js → test/chromium/tracing.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,15 @@
* limitations under the License.
*/

const fs = require('fs');
const path = require('path');
import fs from 'fs';
import path from 'path';
import { ChromiumBrowser } from '../..';
const {FFOX, CHROMIUM, WEBKIT, OUTPUT_DIR, CHANNEL} = testOptions;

declare global {
interface FixtureState {
outputFile: string;
}
}
registerFixture('outputFile', async ({parallelIndex}, test) => {
const outputFile = path.join(OUTPUT_DIR, `trace-${parallelIndex}.json`);
await test(outputFile);
Expand All @@ -26,48 +31,48 @@ registerFixture('outputFile', async ({parallelIndex}, test) => {
});

it.skip(!CHROMIUM)('should output a trace', async({browser, page, server, outputFile}) => {
await browser.startTracing(page, {screenshots: true, path: outputFile});
await (browser as ChromiumBrowser).startTracing(page, {screenshots: true, path: outputFile});
await page.goto(server.PREFIX + '/grid.html');
await browser.stopTracing();
await (browser as ChromiumBrowser).stopTracing();
expect(fs.existsSync(outputFile)).toBe(true);
});

it.skip(!CHROMIUM)('should run with custom categories if provided', async({browser, page, outputFile}) => {
await browser.startTracing(page, {path: outputFile, categories: ['disabled-by-default-v8.cpu_profiler.hires']});
await browser.stopTracing();
await (browser as ChromiumBrowser).startTracing(page, {path: outputFile, categories: ['disabled-by-default-v8.cpu_profiler.hires']});
await (browser as ChromiumBrowser).stopTracing();

const traceJson = JSON.parse(fs.readFileSync(outputFile).toString());
expect(traceJson.metadata['trace-config']).toContain('disabled-by-default-v8.cpu_profiler.hires', 'Does not contain expected category');
expect(traceJson.metadata['trace-config']).toContain('disabled-by-default-v8.cpu_profiler.hires');
});

it.skip(!CHROMIUM)('should throw if tracing on two pages', async({browser, page, outputFile}) => {
await browser.startTracing(page, {path: outputFile});
await (browser as ChromiumBrowser).startTracing(page, {path: outputFile});
const newPage = await browser.newPage();
let error = null;
await browser.startTracing(newPage, {path: outputFile}).catch(e => error = e);
await (browser as ChromiumBrowser).startTracing(newPage, {path: outputFile}).catch(e => error = e);
await newPage.close();
expect(error).toBeTruthy();
await browser.stopTracing();
await (browser as ChromiumBrowser).stopTracing();
});

it.skip(!CHROMIUM)('should return a buffer', async({browser, page, server, outputFile}) => {
await browser.startTracing(page, {screenshots: true, path: outputFile});
await (browser as ChromiumBrowser).startTracing(page, {screenshots: true, path: outputFile});
await page.goto(server.PREFIX + '/grid.html');
const trace = await browser.stopTracing();
const trace = await (browser as ChromiumBrowser).stopTracing();
const buf = fs.readFileSync(outputFile);
expect(trace.toString()).toEqual(buf.toString(), 'Tracing buffer mismatch');
expect(trace.toString()).toEqual(buf.toString());
});

it.skip(!CHROMIUM)('should work without options', async({browser, page, server}) => {
await browser.startTracing(page);
await (browser as ChromiumBrowser).startTracing(page);
await page.goto(server.PREFIX + '/grid.html');
const trace = await browser.stopTracing();
const trace = await (browser as ChromiumBrowser).stopTracing();
expect(trace).toBeTruthy();
});

it.skip(!CHROMIUM)('should support a buffer without a path', async({browser, page, server}) => {
await browser.startTracing(page, {screenshots: true});
await (browser as ChromiumBrowser).startTracing(page, {screenshots: true});
await page.goto(server.PREFIX + '/grid.html');
const trace = await browser.stopTracing();
expect(trace.toString()).toContain('screenshot', 'Does not contain screenshot');
const trace = await (browser as ChromiumBrowser).stopTracing();
expect(trace.toString()).toContain('screenshot');
});
120 changes: 120 additions & 0 deletions test/click-react.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
/**
* Copyright 2018 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 utils from './utils';

declare const renderComponent;
declare const e;
declare const MyButton;

it.fail(true)('should report that selector does not match anymore', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
renderComponent(e('div', {}, [e(MyButton, { name: 'button1' }), e(MyButton, { name: 'button2' })] ));
});
const __testHookAfterStable = () => page.evaluate(() => {
window['counter'] = (window['counter'] || 0) + 1;
if (window['counter'] === 1)
renderComponent(e('div', {}, [e(MyButton, { name: 'button2' }), e(MyButton, { name: 'button1' })] ));
else
renderComponent(e('div', {}, []));
});
const error = await page.dblclick('text=button1', { __testHookAfterStable, timeout: 3000 } as any).catch(e => e);
expect(await page.evaluate('window.button1')).toBe(undefined);
expect(await page.evaluate('window.button2')).toBe(undefined);
expect(error.message).toContain('page.dblclick: Timeout 3000ms exceeded.');
expect(error.message).toContain('element does not match the selector anymore');
});

it.fail(true)('should not retarget the handle when element is recycled', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
renderComponent(e('div', {}, [e(MyButton, { name: 'button1' }), e(MyButton, { name: 'button2', disabled: true })] ));
});
const __testHookBeforeStable = () => page.evaluate(() => {
window['counter'] = (window['counter'] || 0) + 1;
if (window['counter'] === 1)
renderComponent(e('div', {}, [e(MyButton, { name: 'button2', disabled: true }), e(MyButton, { name: 'button1' })] ));
});
const handle = await page.$('text=button1');
const error = await handle.click({ __testHookBeforeStable, timeout: 3000 } as any).catch(e => e);
expect(await page.evaluate('window.button1')).toBe(undefined);
expect(await page.evaluate('window.button2')).toBe(undefined);
expect(error.message).toContain('elementHandle.click: Timeout 3000ms exceeded.');
expect(error.message).toContain('element is disabled - waiting');
});

it('should timeout when click opens alert', async({page, server}) => {
const dialogPromise = page.waitForEvent('dialog');
await page.setContent(`<div onclick='window.alert(123)'>Click me</div>`);
const error = await page.click('div', { timeout: 3000 }).catch(e => e);
expect(error.message).toContain('page.click: Timeout 3000ms exceeded.');
const dialog = await dialogPromise;
await dialog.dismiss();
});

it.fail(true)('should retarget when element is recycled during hit testing', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
renderComponent(e('div', {}, [e(MyButton, { name: 'button1' }), e(MyButton, { name: 'button2' })] ));
});
const __testHookAfterStable = () => page.evaluate(() => {
window['counter'] = (window['counter'] || 0) + 1;
if (window['counter'] === 1)
renderComponent(e('div', {}, [e(MyButton, { name: 'button2' }), e(MyButton, { name: 'button1' })] ));
});
await page.click('text=button1', { __testHookAfterStable } as any);
expect(await page.evaluate('window.button1')).toBe(true);
expect(await page.evaluate('window.button2')).toBe(undefined);
});

it.fail(true)('should retarget when element is recycled before enabled check', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
renderComponent(e('div', {}, [e(MyButton, { name: 'button1' }), e(MyButton, { name: 'button2', disabled: true })] ));
});
const __testHookBeforeStable = () => page.evaluate(() => {
window['counter'] = (window['counter'] || 0) + 1;
if (window['counter'] === 1)
renderComponent(e('div', {}, [e(MyButton, { name: 'button2', disabled: true }), e(MyButton, { name: 'button1' })] ));
});
await page.click('text=button1', { __testHookBeforeStable } as any);
expect(await page.evaluate('window.button1')).toBe(true);
expect(await page.evaluate('window.button2')).toBe(undefined);
});

it('should not retarget when element changes on hover', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
renderComponent(e('div', {}, [e(MyButton, { name: 'button1', renameOnHover: true }), e(MyButton, { name: 'button2' })] ));
});
await page.click('text=button1');
expect(await page.evaluate('window.button1')).toBe(true);
expect(await page.evaluate('window.button2')).toBe(undefined);
});

it('should not retarget when element is recycled on hover', async ({page, server}) => {
await page.goto(server.PREFIX + '/react.html');
await page.evaluate(() => {
function shuffle() {
renderComponent(e('div', {}, [e(MyButton, { name: 'button2' }), e(MyButton, { name: 'button1' })] ));
}
renderComponent(e('div', {}, [e(MyButton, { name: 'button1', onHover: shuffle }), e(MyButton, { name: 'button2' })] ));
});
await page.click('text=button1');
expect(await page.evaluate('window.button1')).toBe(undefined);
expect(await page.evaluate('window.button2')).toBe(true);
});
7 changes: 4 additions & 3 deletions test/click-timeout-1.spec.js → test/click-timeout-1.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,20 +15,21 @@
* limitations under the License.
*/

import utils from './utils';
const {USES_HOOKS} = testOptions;

it.skip(USES_HOOKS)('should avoid side effects after timeout', async({page, server}) => {
await page.goto(server.PREFIX + '/input/button.html');
const error = await page.click('button', { timeout: 2000, __testHookBeforePointerAction: () => new Promise(f => setTimeout(f, 2500))}).catch(e => e);
const error = await page.click('button', { timeout: 2000, __testHookBeforePointerAction: () => new Promise(f => setTimeout(f, 2500))} as any).catch(e => e);
await page.waitForTimeout(5000); // Give it some time to click after the test hook is done waiting.
expect(await page.evaluate(() => result)).toBe('Was not clicked');
expect(await page.evaluate('result')).toBe('Was not clicked');
expect(error.message).toContain('page.click: Timeout 2000ms exceeded.');
});

it('should timeout waiting for button to be enabled', async({page, server}) => {
await page.setContent('<button onclick="javascript:window.__CLICKED=true;" disabled><span>Click target</span></button>');
const error = await page.click('text=Click target', { timeout: 3000 }).catch(e => e);
expect(await page.evaluate(() => window.__CLICKED)).toBe(undefined);
expect(await page.evaluate('window.__CLICKED')).toBe(undefined);
expect(error.message).toContain('page.click: Timeout 3000ms exceeded.');
expect(error.message).toContain('element is disabled - waiting');
});
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
* limitations under the License.
*/

import utils from './utils';
const {USES_HOOKS} = testOptions;

it('should timeout waiting for display:none to be gone', async({page, server}) => {
Expand Down
7 changes: 4 additions & 3 deletions test/click-timeout-3.spec.js → test/click-timeout-3.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,20 +15,21 @@
* limitations under the License.
*/

import utils from './utils';
const {USES_HOOKS} = testOptions;

it.skip(USES_HOOKS)('should fail when element jumps during hit testing', async({page, server}) => {
await page.setContent('<button>Click me</button>');
let clicked = false;
const handle = await page.$('button');
const __testHookBeforeHitTarget = () => page.evaluate(() => {
const margin = parseInt(document.querySelector('button').style.marginLeft || 0) + 100;
const margin = parseInt(document.querySelector('button').style.marginLeft || '0') + 100;
document.querySelector('button').style.marginLeft = margin + 'px';
});
const promise = handle.click({ timeout: 5000, __testHookBeforeHitTarget }).then(() => clicked = true).catch(e => e);
const promise = handle.click({ timeout: 5000, __testHookBeforeHitTarget } as any).then(() => clicked = true).catch(e => e);
const error = await promise;
expect(clicked).toBe(false);
expect(await page.evaluate(() => window.clicked)).toBe(undefined);
expect(await page.evaluate('window.clicked')).toBe(undefined);
expect(error.message).toContain('elementHandle.click: Timeout 5000ms exceeded.');
expect(error.message).toContain('element does not receive pointer events');
expect(error.message).toContain('retrying click action');
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import utils from './utils';

it('should timeout waiting for stable position', async({page, server}) => {
await page.goto(server.PREFIX + '/input/button.html');
Expand Down
Loading

0 comments on commit eac8aee

Please sign in to comment.