mirror of
https://github.com/RGBCube/serenity
synced 2025-05-31 15:28:11 +00:00
LibWeb: Produce resolved transform value according to spec algorithm
We now produce a `matrix3d()` value when appropriate. Some sites (such as gsap.com) request the resolved style for `transform` when there's no viewport paintable, but the element itself does already have a stacking context. This fixes crashes in that case, because we now do not access the stacking context at all. We also do not wrap the result as a StyleValueList any more. The returned StyleValue is only serialized and exposed to JS, so making it a StyleValueList has no effect.
This commit is contained in:
parent
c65d6964ea
commit
c9c99b3c42
3 changed files with 122 additions and 26 deletions
35
Tests/LibWeb/Text/input/css/getComputedStyle-transform.html
Normal file
35
Tests/LibWeb/Text/input/css/getComputedStyle-transform.html
Normal file
|
@ -0,0 +1,35 @@
|
|||
<script src="../include.js"></script>
|
||||
<script>
|
||||
test(() => {
|
||||
const e = document.createElement("div");
|
||||
document.body.appendChild(e);
|
||||
function checkTransform(transform) {
|
||||
e.style.transform = transform;
|
||||
const computedStyle = getComputedStyle(e);
|
||||
const serialized = computedStyle.transform;
|
||||
println(transform + " => " + serialized);
|
||||
}
|
||||
for (transform of [
|
||||
"none",
|
||||
"matrix(1, 2, 3, 4, 5, 6)",
|
||||
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16)",
|
||||
"translate(1%, 2px)",
|
||||
"translate3d(1%, 2px, 3em)",
|
||||
"translateX(1px)",
|
||||
"translateY(1%)",
|
||||
"scale(1, 2)",
|
||||
"scaleX(2)",
|
||||
"scaleY(2.5)",
|
||||
"rotate(1deg)",
|
||||
"rotateX(1rad)",
|
||||
"rotateY(1grad)",
|
||||
"rotateZ(1turn)",
|
||||
"skew(1deg, 1rad)",
|
||||
"skewX(1deg)",
|
||||
"skewY(1rad)",
|
||||
]) {
|
||||
checkTransform(transform);
|
||||
}
|
||||
e.remove();
|
||||
});
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue