Use <template> element instead of Range.createContextualFragment()

https://forums.ankiweb.net/t/audio-in-back-template-is-played-on-front-template-on-desktop-2-1-46/12399

Unlike when using <template> element, if a DocumentFragment is created
using Range.createContextualFragment(), <audio>/<video> elements
with `aotoplay` will play immediately even before they are inserted into
the actual document, which will cause audio or video on the answer side
to be played on the question side.
This commit is contained in:
hikaru-y 2021-08-17 22:41:05 +09:00
parent 2265bfe71d
commit 207e4253f1

View file

@ -31,7 +31,9 @@ function clearPreloadLinks(): void {
}
function extractImageSrcs(html: string): string[] {
const fragment = document.createRange().createContextualFragment(html);
const tmpl = document.createElement("template");
tmpl.innerHTML = html;
const fragment = tmpl.content;
const srcs = [...fragment.querySelectorAll("img[src]")].map(
(img) => (img as HTMLImageElement).src
);