fix: support hiding caret in case of matching style rule (#12172)

This commit is contained in:
Andrey Lushnikov 2022-02-17 15:05:56 -07:00 committed by GitHub
parent 6ec00a9ae5
commit c98d595bea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 5 deletions

View File

@ -133,11 +133,9 @@ export class Screenshotter {
await frame.nonStallingEvaluateInExistingContext('(' + (function(disableAnimations: boolean) {
const styleTag = document.createElement('style');
styleTag.textContent = `
*,
* > *,
* > * > *,
* > * > * > *,
* > * > * > * > * { caret-color: transparent !important; }
*:not(#playwright-aaaaaaaaaa.playwright-bbbbbbbbbbb.playwright-cccccccccc.playwright-dddddddddd.playwright-eeeeeeeee) {
caret-color: transparent !important;
}
`;
document.documentElement.append(styleTag);
const infiniteAnimationsToResume: Set<Animation> = new Set();

View File

@ -34,6 +34,16 @@ it.describe('page screenshot', () => {
it('should not capture blinking caret', async ({ page, server }) => {
await page.setContent(`
<!-- Refer to stylesheet from other origin. Accessing this
stylesheet rules will throw.
-->
<link rel=stylesheet href="${server.CROSS_PROCESS_PREFIX + '/injectedstyle.css'}">
<!-- make life harder: define caret color in stylesheet -->
<style>
div {
caret-color: #000 !important;
}
</style>
<div contenteditable="true"></div>
`);
const div = page.locator('div');