yujunjun/playwright
1
0
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2025-06-26 21:40:17 +00:00
Code Issues Packages Projects Releases Wiki Activity
playwright/tests/page/page-click-timeout-3.spec.ts

106 lines
4.2 KiB
TypeScript
Raw Normal View History

test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
/**
* 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.
*/
test: cleanup bad usages of pageTest (#6430)
2021-05-06 07:08:22 -07:00
import { test as it, expect } from './pageTest';
test: migrate page tests to new folio (#6054)
2021-04-02 14:23:42 -07:00
chore: enable object-curly-spacing in ESLint (#9168)
2021-09-27 18:58:08 +02:00
it('should fail when element jumps during hit testing', async ({ page, mode }) => {
test: migrate page tests to new folio (#6054)
2021-04-02 14:23:42 -07:00
it.skip(mode !== 'default');
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
await page.setContent('<button>Click me</button>');
let clicked = false;
const handle = await page.$('button');
const __testHookBeforeHitTarget = () => page.evaluate(() => {
chore(test): run eslint on tests (#3638)
2020-08-28 04:20:29 -07:00
const margin = parseInt(document.querySelector('button').style.marginLeft || '0', 10) + 100;
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
document.querySelector('button').style.marginLeft = margin + 'px';
});
chore(types): convert tests to typescript part 3 (#3340)
2020-08-07 11:19:15 -07:00
const promise = handle.click({ timeout: 5000, __testHookBeforeHitTarget } as any).then(() => clicked = true).catch(e => e);
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
const error = await promise;
expect(clicked).toBe(false);
chore(types): convert tests to typescript part 3 (#3340)
2020-08-07 11:19:15 -07:00
expect(await page.evaluate('window.clicked')).toBe(undefined);
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
expect(error.message).toContain('elementHandle.click: Timeout 5000ms exceeded.');
feat(click): provide preview of the element intercepting pointer events (#3449)
2020-08-14 14:48:36 -07:00
expect(error.message).toContain('<body>…</body> intercepts pointer events');
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
expect(error.message).toContain('retrying click action');
});
chore: enable object-curly-spacing in ESLint (#9168)
2021-09-27 18:58:08 +02:00
it('should timeout waiting for hit target', async ({ page, server }) => {
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
await page.goto(server.PREFIX + '/input/button.html');
const button = await page.$('button');
await page.evaluate(() => {
document.body.style.position = 'relative';
const blocker = document.createElement('div');
feat(click): provide preview of the element intercepting pointer events (#3449)
2020-08-14 14:48:36 -07:00
blocker.id = 'blocker';
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
blocker.style.position = 'absolute';
blocker.style.width = '400px';
blocker.style.height = '20px';
blocker.style.left = '0';
blocker.style.top = '0';
document.body.appendChild(blocker);
});
const error = await button.click({ timeout: 5000 }).catch(e => e);
expect(error.message).toContain('elementHandle.click: Timeout 5000ms exceeded.');
feat(click): provide preview of the element intercepting pointer events (#3449)
2020-08-14 14:48:36 -07:00
expect(error.message).toContain('<div id="blocker"></div> intercepts pointer events');
expect(error.message).toContain('retrying click action');
fix(actions): wait for some time before retrying the action (#4001) This saves some CPU cycles while waiting for the page to change the state, e.g. for animations to complete. Note that retrying logic is only applicable in rare circumstances like unexpected scroll in the middle of an action, or some overlay blocking the click. Usually, action times out in this cases while retrying.
2020-09-29 10:28:19 -07:00
expect(error.message).toContain('waiting 500ms');
feat(click): provide preview of the element intercepting pointer events (#3449)
2020-08-14 14:48:36 -07:00
});
feat(input): perform hit target check during input (#9546) This replaces previous `checkHitTarget` heuristic that took place before the action with a new `setupHitTargetInterceptor` that works during the action: - Before the action we set up capturing listeners on the window. - During the action we ensure that event target is the element we expect to interact with. - After the action we clear the listeners. This should catch the "layout shift" issues where things move between action point calculation and the actual action. Possible issues: - **Risk:** `{ trial: true }` might dispatch move events like `mousemove` or `pointerout`, because we do actually move the mouse but prevent all other events. - **Timing**: The timing of "hit target check" has moved, so this may affect different web pages in different ways, for example expose more races. In this case, we should retry the click as before. - **No risk**: There is still a possibility of mis-targeting with iframes shifting around, because we only intercept in the target frame. This behavior does not change. There is an opt-out environment variable PLAYWRIGHT_NO_LAYOUT_SHIFT_CHECK that reverts to previous behavior.
2021-11-05 17:31:28 -07:00
it('should still click when force but hit target is obscured', async ({ page, server }) => {
await page.goto(server.PREFIX + '/input/button.html');
const button = await page.$('button');
await page.evaluate(() => {
document.body.style.position = 'relative';
const blocker = document.createElement('div');
blocker.id = 'blocker';
blocker.style.position = 'absolute';
blocker.style.width = '400px';
blocker.style.height = '200px';
blocker.style.left = '0';
blocker.style.top = '0';
document.body.appendChild(blocker);
});
await button.click({ force: true });
});
chore: enable object-curly-spacing in ESLint (#9168)
2021-09-27 18:58:08 +02:00
it('should report wrong hit target subtree', async ({ page, server }) => {
feat(click): provide preview of the element intercepting pointer events (#3449)
2020-08-14 14:48:36 -07:00
await page.goto(server.PREFIX + '/input/button.html');
const button = await page.$('button');
await page.evaluate(() => {
document.body.style.position = 'relative';
const blocker = document.createElement('div');
blocker.id = 'blocker';
blocker.style.position = 'absolute';
blocker.style.width = '400px';
blocker.style.height = '20px';
blocker.style.left = '0';
blocker.style.top = '0';
document.body.appendChild(blocker);
const inner = document.createElement('div');
inner.id = 'inner';
inner.style.position = 'absolute';
inner.style.left = '0';
inner.style.top = '0';
inner.style.right = '0';
inner.style.bottom = '0';
blocker.appendChild(inner);
});
const error = await button.click({ timeout: 5000 }).catch(e => e);
expect(error.message).toContain('elementHandle.click: Timeout 5000ms exceeded.');
expect(error.message).toContain('<div id="inner"></div> from <div id="blocker">…</div> subtree intercepts pointer events');
test: remove describes (#3274)
2020-08-03 13:41:48 -07:00
expect(error.message).toContain('retrying click action');
});
Reference in New Issue Copy Permalink