mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-30 04:39:06 +00:00
Tests: Transform some ref tests into screenshot tests
These test work with LibGfx painter but won't longer work after switching to Skia, because it produces slightly different antialiasing, rounding in color blending, etc.
This commit is contained in:
Aliaksandr Kalenik
Andreas Kling
parent
de66e2551f
commit
9ab25c47a4
Notes:
github-actions[bot]
2024-07-21 11:27:20 +00:00
Author: https://github.com/kalenikaliaksandr
Commit: 9ab25c47a4
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/736
Reviewed-by: https://github.com/jamierocks
20 changed files with 49 additions and 124 deletions
|
|
@ -1,91 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<!-- FIXME: Some colors/channels are off by 1, likely from accumulated rounding errors -->
|
||||
<!-- Affected cases are labeled with "Expected: #blahblah" -->
|
||||
|
||||
<div style="background-color: #0a141e;">
|
||||
<p>legacy rgb with numbers</p>
|
||||
</div>
|
||||
<div style="background-color: #1a334d;">
|
||||
<p>legacy rgb with percentages</p>
|
||||
</div>
|
||||
<div style="background-color: #84898e;">
|
||||
<p>legacy rgba with numbers and number alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #84898e;">
|
||||
<p>legacy rgba with numbers and percentage alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #8c98a5;"> <!-- Expected: #8c99a6 -->
|
||||
<p>legacy rgba with percentages and number alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #8c99a6;">
|
||||
<p>legacy rgba with percentages and percentage alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #00ff00;">
|
||||
<p>legacy hsl with number hue</p>
|
||||
</div>
|
||||
<div style="background-color: #00ff00;">
|
||||
<p>legacy hsl with degree hue</p>
|
||||
</div>
|
||||
<div style="background-color: #7fff7f;">
|
||||
<p>legacy hsla with number alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #7fff7f;">
|
||||
<p>legacy hsla with percentage alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #0000ff;">
|
||||
<p>legacy rgba with out-of-range numbers (should be clamped)</p>
|
||||
</div>
|
||||
<div style="background-color: #ffffff;">
|
||||
<p>legacy rgba with out-of-range percentages (should be clamped)</p>
|
||||
</div>
|
||||
<div style="background-color: #0a331e;">
|
||||
<p>modern rgb with mixed types</p>
|
||||
</div>
|
||||
<div style="background-color: #84988e;"> <!-- Expected: #84998e -->
|
||||
<p>modern rgb with alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #0a331e;">
|
||||
<p>modern rgba without alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #59a659;">
|
||||
<p>modern hsl</p>
|
||||
</div>
|
||||
<div style="background-color: #abd2ab;"> <!-- Expected: #acd2ac -->
|
||||
<p>modern hsl with alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #59a659;">
|
||||
<p>modern hsla without alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #59a659;">
|
||||
<p>modern hsl with numbers</p>
|
||||
</div>
|
||||
<div style="background-color: #ffffff;">
|
||||
<p>modern hsl with out-of-range values (should be clamped/wrapped)</p>
|
||||
</div>
|
||||
<div style="background-color: #4c7f4c;"> <!-- Expected: #4d804d -->
|
||||
<p>hwb with percentages</p>
|
||||
</div>
|
||||
<div style="background-color: #a5bfa5;"> <!-- Expected: #a6bfa6 -->
|
||||
<p>hwb with percentages and alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #567f4c;"> <!-- Expected: #57804d -->
|
||||
<p>hwb with numbers/angle</p>
|
||||
</div>
|
||||
<div style="background-color: #a5bfa5;"> <!-- Expected: #a6bfa6 -->
|
||||
<p>hwb with mixed-type values and percentage alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #92877f;"> <!-- Expected: #93877f -->
|
||||
<p>oklab with numbers and alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #fffdb0;">
|
||||
<p>oklab with out-of-range lightness (should be clamped)</p>
|
||||
</div>
|
||||
<div style="background-color: #a77fce;"> <!-- Expected: #a87fce -->
|
||||
<p>oklab with percentages and alpha</p>
|
||||
</div>
|
||||
<div style="background-color: #c9a4a4;"> <!-- Expected: #c9a4a5 -->
|
||||
<p>oklch with numbers</p>
|
||||
</div>
|
||||
<div style="background-color: #bbacac;"> <!-- Expected: #bcacac -->
|
||||
<p>oklch with percentages and angle hue </p>
|
||||
</div>
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<svg width="600" viewBox="0 0 150 100" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="100" cy="50" r="40" fill="#b3b3b3" />
|
||||
<circle cx="50" cy="50" r="40" fill="blue" />
|
||||
</svg>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<svg width="40" height="40" viewBox="0 0 40 40">
|
||||
<circle cx="16" cy="16" r="16" fill="black"></circle>
|
||||
</svg>
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
<!doctype html>
|
||||
<svg>
|
||||
</svg>
|
||||
<svg>
|
||||
<rect fill="red" x="10" y="10" width="50" height="50">
|
||||
</svg>
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
<style>
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<svg height="150" width="400">
|
||||
<defs>
|
||||
<linearGradient id="grad" x1="0" y1="0" x2="70%" y2="0">
|
||||
<stop offset="0" stop-color="red" stop-opacity="0.3"/>
|
||||
<stop offset="1" stop-color="blue" stop-opacity="0.3"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<rect x="115" y="15" width="170" height="110" stroke="url(#grad)" stroke-width="10" fill="none" />
|
||||
</svg>
|
||||
BIN
Tests/LibWeb/Screenshot/images/css-color-functions-ref.png
Normal file
BIN
Tests/LibWeb/Screenshot/images/css-color-functions-ref.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 114 KiB |
BIN
Tests/LibWeb/Screenshot/images/opacity-stacking-ref.png
Normal file
BIN
Tests/LibWeb/Screenshot/images/opacity-stacking-ref.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
Tests/LibWeb/Screenshot/images/svg-foreign-object-mask-ref.png
Normal file
BIN
Tests/LibWeb/Screenshot/images/svg-foreign-object-mask-ref.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
Tests/LibWeb/Screenshot/images/svg-non-local-clip-path-ref.png
Normal file
BIN
Tests/LibWeb/Screenshot/images/svg-non-local-clip-path-ref.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
|
|
@ -0,0 +1,9 @@
|
|||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<img src="../images/css-color-functions-ref.png">
|
||||
10
Tests/LibWeb/Screenshot/reference/opacity-stacking-ref.html
Normal file
10
Tests/LibWeb/Screenshot/reference/opacity-stacking-ref.html
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<img src="../images/opacity-stacking-ref.png">
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<img src="../images/svg-foreign-object-mask-ref.png">
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<img src="../images/svg-non-local-clip-path-ref.png">
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
<img src="../images/svg-stroke-paintstyle-with-opacity-ref.png">
|
||||
Loading…
Add table
Add a link
Reference in a new issue