mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-28 10:37:17 +02:00
d2528dd5ce
Instead of rendering a reference HTML page that wraps an <img> tag pointing to a PNG, Screenshot tests now load the expected PNG directly from disk and compare it against the rendered screenshot. This eliminates the indirection of loading and rendering a second page just to display a static image. This also means --rebaseline now works for Screenshot tests, generating the expected PNG automatically instead of requiring manual screenshot capture and placement. Changes: - Add TestMode::Screenshot with its own collector and runner - Move PNGs from Screenshot/images/ to Screenshot/expected/ with normalized names matching input filenames - Remove all 92 reference HTML wrapper files and the images/ directory - Remove <link rel="match"> from all 94 Screenshot input HTML files - Update add_libweb_test.py Screenshot boilerplate accordingly - Add Screenshot mode to results viewer image comparison tabs
45 lines
1.1 KiB
HTML
45 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<meta name="fuzzy" content="maxDifference=0-3;totalPixels=0-2915">
|
|
<style>
|
|
div {
|
|
position: absolute;
|
|
width: 60px;
|
|
height: 60px;
|
|
opacity: 50%;
|
|
}
|
|
#d1 {
|
|
background-color: rgb(186, 190, 92);
|
|
}
|
|
#d2 {
|
|
background-color: linear-gradient(to right rgb(255, 132, 0) 51%),
|
|
linear-gradient(to right, rgb(255, 0, 212));
|
|
background-blend-mode: normal, difference;
|
|
mix-blend-mode: screen;
|
|
top: 10px;
|
|
}
|
|
#d3 {
|
|
background-color: rgb(21, 107, 118);
|
|
isolation: isolate;
|
|
mix-blend-mode: multiply;
|
|
top: 20px;
|
|
}
|
|
#d4 {
|
|
background-color: linear-gradient(to right rgb(77, 145, 113) 51%),
|
|
linear-gradient(to right, rgb(60, 118, 41));
|
|
background-blend-mode: normal, exclusion;
|
|
mix-blend-mode: normal;
|
|
isolation: isolate;
|
|
top: 30px;
|
|
}
|
|
#d5 {
|
|
background-color: rgb(34, 29, 78);
|
|
mix-blend-mode: difference;
|
|
top: 40px;
|
|
}
|
|
</style>
|
|
<div id="d1">111</div>
|
|
<div id="d2">222</div>
|
|
<div id="d3">333</div>
|
|
<div id="d4">444</div>
|
|
<div id="d5">555</div>
|