Skip to content

Commit

Permalink
fix(tests): Fixes for old Safari (#8368)
Browse files Browse the repository at this point in the history
  • Loading branch information
mister-ben authored Jul 21, 2023
1 parent da15810 commit 6fc1fd4
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 8 deletions.
3 changes: 2 additions & 1 deletion src/js/utils/dom.js
Original file line number Diff line number Diff line change
Expand Up @@ -878,7 +878,8 @@ export function copyStyleSheetsToWindow(win) {

link.rel = 'stylesheet';
link.type = styleSheet.type;
link.media = styleSheet.media;
// For older Safari this has to be the string; on other browsers setting the MediaList works
link.media = styleSheet.media.mediaText;
link.href = styleSheet.href;
win.document.head.appendChild(link);
}
Expand Down
15 changes: 8 additions & 7 deletions test/unit/utils/dom.test.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
/* eslint-env qunit */
import document from 'global/document';
import window from 'global/window';
import sinon from 'sinon';
import * as Dom from '../../../src/js/utils/dom.js';
import { IS_SAFARI } from '../../../src/js/utils/browser.js';
import TestHelpers from '../test-helpers.js';

QUnit.module('utils/dom');
Expand Down Expand Up @@ -689,11 +687,14 @@ QUnit.test('isSingleLeftClick() checks return values for mousedown event', funct
assert.ok(Dom.isSingleLeftClick(mouseEvent), 'a touch event on simulated mobiles is a single left click');
});

// The next test is skipped on Safari < 14, which has a broken document.styleSheets
// copyStyleSheetsToWindow() is only used on browsers supporting documentPictureInPicture - Chromium 113+
const skipOnOldSafari = IS_SAFARI && parseInt(window.navigator.userAgent.match(/Version\/(\d+)\./)[1], 10) < 14 ? 'skip' : 'test';
QUnit.test('Dom.copyStyleSheetsToWindow() copies all style sheets to a window', function(assert) {
/**
* This test is checking that styles are copied by comparing strings in original stylesheets to those in
* documents.styleSheets in the new (fake) window. This can be problematic on older Safari as documents.styleSheets
* does not always return the original style - a shorthand property like `background: white` may be returned as
* `background-color: white`.
*/

QUnit[skipOnOldSafari]('Dom.copyStyleSheetsToWindow() copies all style sheets to a window', function(assert) {
const fakeWindow = document.createElement('div');
const done = assert.async();

Expand All @@ -705,7 +706,7 @@ QUnit[skipOnOldSafari]('Dom.copyStyleSheetsToWindow() copies all style sheets to

const style1 = document.createElement('style');

style1.textContent = 'body { background: white; }';
style1.textContent = 'body { background-color: white; }';
document.head.appendChild(style1);

const style2 = document.createElement('style');
Expand Down

0 comments on commit 6fc1fd4

Please sign in to comment.