<!
DOCTYPE HTML>
<
html>
<
head>
<
meta charset=
"utf-8">
<
title>Test cloneElementVisually with poster</
title>
<
script src=
"/tests/SimpleTest/SimpleTest.js"></
script>
<
script type=
"application/javascript" src=
"https://example.com:443/tests/dom/media/test/cloneElementVisually_helpers.js"></
script>
<
link rel=
"stylesheet" type=
"text/css" href=
"/tests/SimpleTest/test.css">
</
head>
<
body>
<
div id=
"content">
<
h1>Original</
h1>
<
video id=
"original"></
video>
<
h1>Clone</
h1>
</
div>
<
div id=
"results">
<
h1>Results</
h1>
<
canvas id=
"left"></
canvas>
<
canvas id=
"right"></
canvas>
</
div>
<
script type=
"application/javascript">
/* import-globals-from cloneElementVisually_helpers.js */
/**
* Test that when we clone a
video with a poster, the poster does not prevent
* the cloned
video from displaying properly (as in bug 1532692).
*/
add_task(async () => {
await setup();
let originalVideo = document.getElementById(
"original");
const POSTER_URL =
"https://example.com:443/tests/dom/media/test/poster-test.jpg";
originalVideo.setAttribute(
"poster", POSTER_URL);
await withNewClone(originalVideo, async clone => {
await SpecialPowers.wrap(originalVideo).cloneElementVisually(clone);
originalVideo.loop = false;
originalVideo.currentTime = originalVideo.duration - 0.1;
let endedPromise = waitForEventOnce(originalVideo,
"ended");
await originalVideo.play();
await endedPromise;
ok(await assertVideosMatch(originalVideo, clone),
"Video with a poster should clone properly.");
});
});
</
script>
</
body>
</
html>
