Add a hotfix for :has() selector

This hotfix requires not using that selector at all, which worsens the experience in Chrome.
This commit is contained in:
Michael Fabian 'Xaymar' Dirks
2023-06-22 20:57:27 +02:00
parent ba118e206f
commit 797ece883e
2 changed files with 31 additions and 65 deletions
+11 -50
View File
@@ -546,56 +546,6 @@ class XMediaPlayer {
}
/*
async function xmr_initialize_player(el) {
let variant = el.querySelector(".variant");
{ // Variants
variant.update = function () {
// Store current state and pause.
let paused = this._media.paused;
let muted = this._media.muted;
let volume = this._media.volume;
let time = this._media.currentTime;
this._media.pause();
play_pause.update();
// Tell the this._media source to begin loading.
this._media.src = variant.value;
this._media.load();
this._media.currentTime = time;
this._media.addEventListener("canplay", () => {
this._media.currentTime = time;
this._media.volume = volume;
this._media.muted = muted;
if (paused) {
this._media.pause();
} else {
this._media.play();
}
play_pause.update();
}, {
"once": true
})
}
variant.addEventListener("input", () => { variant.update(); });
variant.addEventListener("value", () => { variant.update(); });
// Variants - Add options from available sources.
let sources = el.querySelectorAll("source");
for (let k of sources) {
let option = document.createElement("option");
option.value = k.src;
option.textContent = k.title;
variant.appendChild(option);
}
variant.value = this._media.currentSrc;
}
}
*/
(function () {
'use strict';
@@ -604,6 +554,17 @@ async function xmr_initialize_player(el) {
document.querySelector("#header #navigation").classList.toggle("open");
});
// Shims
// - :has() is missing in many browsers.
document.querySelectorAll("*").forEach((v, k) => {
let s = new Set();
for (let c of v.children) {
s.add(c.tagName.toLocaleLowerCase());
}
if (s.size > 0)
v.dataset["has"] = Array.from(s.values()).join(" ");
});
// Lazily load this._media
xmr_media_lazyload_initialize();