fergalmoran/ladybird
1
0
Fork 0
mirror of https://github.com/fergalmoran/ladybird.git synced 2025-12-22 09:19:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Let getComputedStyle() show *used* values for margin/padding

Browse Source 
We were incorrectly showing *computed* instead of *used* values for
margin and padding when inspected via getComputedStyle().
This commit is contained in:
Andreas Kling
2025-02-21 11:52:37 +01:00
committed by Andreas Kling
parent cdd2ccac0b
commit a706d0ebf4
5 changed files with 100 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
Tests/LibWeb/Text/expected/css/calc-coverage.txt
View File

@@ -94,12 +94,12 @@ line-height: 'calc(2)' -> '32px'
line-height: 'calc(2 * var(--n))' -> '64px'
margin-bottom: 'calc(2px)' -> '2px'
margin-bottom: 'calc(2px * var(--n))' -> '4px'
margin-left: 'calc(2%)' -> '2%'
margin-left: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
margin-left: 'calc(2%)' -> '15.67188px'
margin-left: 'calc(2% * var(--n))' -> '31.375px'
margin-right: 'calc(2px)' -> '2px'
margin-right: 'calc(2px * var(--n))' -> '4px'
margin-top: 'calc(2%)' -> '2%'
margin-top: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
margin-top: 'calc(2%)' -> '15.67188px'
margin-top: 'calc(2% * var(--n))' -> '31.375px'
math-depth: 'calc(2)' -> '2'
math-depth: 'calc(2 * var(--n))' -> '4'
max-height: 'calc(2px)' -> '2px'
@@ -120,12 +120,12 @@ outline-width: 'calc(2px)' -> '2px'
outline-width: 'calc(2px * var(--n))' -> '4px'
padding-bottom: 'calc(2px)' -> '2px'
padding-bottom: 'calc(2px * var(--n))' -> '4px'
padding-left: 'calc(2%)' -> '2%'
padding-left: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
padding-left: 'calc(2%)' -> '15.67188px'
padding-left: 'calc(2% * var(--n))' -> '31.375px'
padding-right: 'calc(2px)' -> '2px'
padding-right: 'calc(2px * var(--n))' -> '4px'
padding-top: 'calc(2%)' -> '2%'
padding-top: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
padding-top: 'calc(2%)' -> '15.67188px'
padding-top: 'calc(2% * var(--n))' -> '31.375px'
r: 'calc(2px)' -> '2px'
r: 'calc(2px * var(--n))' -> '4px'
right: 'calc(2%)' -> '2%'

4
Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt
View File

@@ -146,9 +146,9 @@ justify-content: normal
justify-items: legacy
justify-self: auto
left: auto
margin-block-end: 8px
margin-block-end: 16px
margin-block-start: 8px
margin-bottom: 8px
margin-bottom: 16px
margin-inline-end: 8px
margin-inline-start: 8px
margin-left: 8px

11
Tests/LibWeb/Text/expected/wpt-import/css/CSS2/normal-flow/auto-margins-used-values.txt Normal file
View File

@@ -0,0 +1,11 @@
Harness status: OK
Found 6 tests
6 Pass
Pass .box 1
Pass .box 2
Pass .box 3
Pass .box 4
Pass .box 5
Pass .box 6

31
Tests/LibWeb/Text/input/wpt-import/css/CSS2/normal-flow/auto-margins-used-values.html Normal file
View File

@@ -0,0 +1,31 @@
<!DOCTYPE html>
<link rel="help" href="https://www.w3.org/TR/CSS22/visudet.html#blockwidth">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../resources/check-layout-th.js"></script>
<style>
.container {
display: flow-root;
width: 100px;
padding: 5px;
box-sizing: border-box;
}
.box {
display: flow-root;
width: 40px;
height: 10px;
background: lime;
}
</style>
<body onload="checkLayout('.box')">
<div class="container">
<div class="box" style="margin: auto;" data-expected-margin-left="25" data-expected-margin-right="25"></div>
<div class="box" style="margin-left: auto;" data-expected-margin-left="50" data-expected-margin-right="0"></div>
<div class="box" style="margin-right: auto;" data-expected-margin-left="0" data-expected-margin-right="50"></div>
</div>
<div class="container" style="direction: rtl;">
<div class="box" style="margin: auto;" data-expected-margin-left="25" data-expected-margin-right="25"></div>
<div class="box" style="margin-left: auto;" data-expected-margin-left="50" data-expected-margin-right="0"></div>
<div class="box" style="margin-right: auto;" data-expected-margin-left="0" data-expected-margin-right="50"></div>
</div>
</body>