mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-16 05:51:55 +00:00
3af6a69f1e
Instead of CSSColorValue holding a Gfx::Color, make it an abstract class with subclasses for each different color function, to match the Typed-OM spec. This means moving the color calculations from the parsing code to the `to_color()` method on the style value. This lets us have calc() inside a color function, instead of having to fully resolve the color at parse time. The canvas fillStyle tests have been updated to reflect this. The other test change is Screenshot/css-color-functions.html: previously we produced slightly different colors for an alpha of 0.5 and one of 50%, and this incorrect behavior was baked into the test. So now it's more correct. :^)
42 lines
1.2 KiB
HTML
42 lines
1.2 KiB
HTML
<script src="../include.js"></script>
|
|
<script>
|
|
test(() => {
|
|
let testCounter = 1;
|
|
function testPart(part) {
|
|
println(`${testCounter++}. ${JSON.stringify(part())}`);
|
|
}
|
|
|
|
const canvas = document.createElement("canvas");
|
|
const context = canvas.getContext("2d");
|
|
|
|
// 1. Integers
|
|
testPart(() => {
|
|
context.fillStyle = "rgb(0,255,0)";
|
|
return context.fillStyle;
|
|
});
|
|
|
|
// 2. Decimals
|
|
testPart(() => {
|
|
context.fillStyle = "rgb(254.56022744510793,0.28813966673057,0.2973971574794)";
|
|
return context.fillStyle;
|
|
});
|
|
|
|
// 3. Clamp numbers between 0-255
|
|
testPart(() => {
|
|
context.fillStyle = "rgba(-50,-50,500,1)";
|
|
return context.fillStyle;
|
|
});
|
|
|
|
// 4. Percentages
|
|
testPart(() => {
|
|
context.fillStyle = "rgb(0%, 100%, 0%)";
|
|
return context.fillStyle;
|
|
});
|
|
|
|
// 5. Calc, with out-of-range values
|
|
testPart(() => {
|
|
context.fillStyle = "rgb(calc(infinity), 0, 0)";
|
|
return context.fillStyle;
|
|
});
|
|
});
|
|
</script>
|