RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-10-31 07:02:44 +00:00
Code Issues Activity Actions

LibWeb: Fix broken conversion of CSS <resolution> dpi/dpcm to dppx

Browse source 
Also add a basic test that documents how these media features currently
get serialized, even if they're not identical to other browsers yet.
This commit is contained in:
Andreas Kling 2023-08-25 17:58:40 +02:00
parent b256e52586
commit b63e393cef
3 changed files with 33 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

15
Tests/LibWeb/Text/expected/css/media-query-serialization-basic.txt Normal file
View file

@ -0,0 +1,15 @@
@media screen {
}
@media screen and ((min-width:20px) and (max-width:40px)) {
}
@media screen and (min-resolution:1dppx) {
}
@media screen and (min-resolution:2dppx) {
}
@media screen and (min-resolution:2.54dppx) {
}

16
Tests/LibWeb/Text/input/css/media-query-serialization-basic.html Normal file
View file

@ -0,0 +1,16 @@
<head><style>
@media only screen { }
@media only screen and (min-width: 20px) and (max-width: 40px) { }
@media only screen and (min-resolution: 96dpi) { }
@media only screen and (min-resolution: 2dppx) { }
@media only screen and (min-resolution: 96dpcm) { }
</style></head>
<script src="../include.js"></script>
<script>
test(() => {
let sheet = document.head.firstChild.sheet
for (rule of sheet.cssRules) {
println(rule.cssText);
}
});
</script>

4
Userland/Libraries/LibWeb/CSS/Resolution.cpp
View file

@ -23,9 +23,9 @@ double Resolution::to_dots_per_pixel() const
{
switch (m_type) {
case Type::Dpi:
return m_value * 96; // 1in = 2.54cm = 96px
return m_value / 96; // 1in = 2.54cm = 96px
case Type::Dpcm:
return m_value * (96.0 / 2.54); // 1cm = 96px/2.54
return m_value / (96.0 / 2.54); // 1cm = 96px/2.54
case Type::Dppx:
return m_value;
}