eliott/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird synced 2026-04-25 17:25:08 +02:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Handle object-fit in VideoPaintable

Browse Source
This commit is contained in:
Zaggy1024
2025-11-05 18:11:50 -06:00
committed by Gregory Bertilson
parent 51aae8b3b0
commit 296216714a
Notes: github-actions[bot] 2026-04-22 00:12:23 +00:00 
Author: https://github.com/Zaggy1024
Commit: https://github.com/LadybirdBrowser/ladybird/commit/296216714ac
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/9004
3 changed files with 69 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
Tests/LibWeb/Screenshot/expected/video-object-fit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 MiB

60
Tests/LibWeb/Screenshot/input/video-object-fit.html Normal file
View File

@@ -0,0 +1,60 @@
<!DOCTYPE html>
<meta name="fuzzy" content="maxDifference=0-2;totalPixels=0-1239523">
<html class="reftest-wait">
<div>
<h2>480x240</h2>
<h3>default</h3>
<video width="480" height="240" src="../../Assets/test-webm.webm"></video>
<h3>fill</h3>
<video style="object-fit: fill" width="480" height="240" src="../../Assets/test-webm.webm"></video>
<h3>cover</h3>
<video style="object-fit: cover" width="480" height="240" src="../../Assets/test-webm.webm"></video>
<h3>none</h3>
<video style="object-fit: none" width="480" height="240" src="../../Assets/test-webm.webm"></video>
<h3>scale-down</h3>
<video style="object-fit: scale-down" width="480" height="240" src="../../Assets/test-webm.webm"></video>
</div>
<h2>240x240</h2>
<div>
<h3>default</h3>
<video width="240" height="240" src="../../Assets/test-webm.webm"></video>
<h3>fill</h3>
<video style="object-fit: fill" width="240" height="240" src="../../Assets/test-webm.webm"></video>
<h3>cover</h3>
<video style="object-fit: cover" width="240" height="240" src="../../Assets/test-webm.webm"></video>
<h3>none</h3>
<video style="object-fit: none" width="240" height="240" src="../../Assets/test-webm.webm"></video>
<h3>scale-down</h3>
<video style="object-fit: scale-down" width="240" height="240" src="../../Assets/test-webm.webm"></video>
</div>
<div>
<h2>1280x720</h2>
<h3>none</h3>
<video style="object-fit: none" width="1280" height="720" src="../../Assets/test-webm.webm"></video>
<h3>scale-down</h3>
<video style="object-fit: scale-down" width="1280" height="720" src="../../Assets/test-webm.webm"></video>
</div>
<script>
addEventListener('load', () => {
const videoElements = document.getElementsByTagName('video');
let loadedVideoElements = 0;
function videoLoaded() {
loadedVideoElements++;
if (loadedVideoElements == videoElements.length) {
document.documentElement.classList.remove("reftest-wait");
}
}
for (const videoElement of videoElements) {
if (videoElement.readyState < HTMLMediaElement.HAVE_CURRENT_DATA) {
videoElement.addEventListener('loadeddata', () => {
videoLoaded();
});
} else {
videoLoaded();
}
}
});
</script>
</html>