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

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
Notes: sideshowbarker 2024-07-17 01:11:48 +09:00
3 changed files with 33 additions and 2 deletions

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) {
}

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>

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;
}