workaround for CSS injection in firefox

when taking screenshots, firefox complains adoptedStyleSheets.push is not a function
This commit is contained in:
Rui Figueira 2024-04-14 17:45:16 +01:00
parent fb69e334f8
commit 3460693f5f
2 changed files with 12 additions and 4 deletions

View file

@ -75,9 +75,17 @@ export class Highlight {
this._actionPointElement = document.createElement('x-pw-action-point');
this._actionPointElement.setAttribute('hidden', 'true');
this._glassPaneShadow = this._glassPaneElement.attachShadow({ mode: this._isUnderTest ? 'open' : 'closed' });
const sheet = new injectedScript.window.CSSStyleSheet();
sheet.replaceSync(highlightCSS);
this._glassPaneShadow.adoptedStyleSheets = [sheet];
// workaround for firefox: when taking screenshots, it complains adoptedStyleSheets.push
// is not a function, so we fallback to style injection
if (typeof this._glassPaneShadow.adoptedStyleSheets.push === 'function') {
const sheet = new this._injectedScript.window.CSSStyleSheet();
sheet.replaceSync(highlightCSS);
this._glassPaneShadow.adoptedStyleSheets.push(sheet);
} else {
const styleElement = this._injectedScript.document.createElement('style');
styleElement.textContent = highlightCSS;
this._glassPaneShadow.appendChild(styleElement);
}
this._glassPaneShadow.appendChild(this._actionPointElement);
}

View file

@ -1057,7 +1057,7 @@ export class Recorder {
];
this.highlight.install();
this.overlay?.install();
this.document.adoptedStyleSheets = [...this.document.adoptedStyleSheets, this._stylesheet];
this.document.adoptedStyleSheets.push(this._stylesheet);
}
private _switchCurrentTool() {