This test checks that grid items alignment works as expected with VERTICAL-RL vs HORIZONTAL-TB orthogonal flows.
Direction: LTR vs LTR
Direction: RTL vs LTR
Direction: LTR vs RTL
Direction: RTL vs RTL
Harness status: OK
Found 4 tests
Result | Test Name | Message | ||||||
---|---|---|---|---|---|---|---|---|
Fail | .grid 1 | assert_equals:
<div class="container">
<div class="grid fit-content verticalRL directionLTR">
<div class="item firstRowFirstColumn horizontalTB selfEnd" data-offset-x="300" data-offset-y="80">end</div>
<div class="item firstRowSecondColumn horizontalTB selfCenter" data-offset-x="350" data-offset-y="140">center</div>
<div class="item secondRowFirstColumn horizontalTB selfStart" data-offset-x="250" data-offset-y="0">start</div>
<div class="item secondRowSecondColumn horizontalTB selfSelfEnd" data-offset-x="250" data-offset-y="180">s-end</div>
<div class="item thirdRowFirstColumn horizontalTB selfSelfStart" data-offset-x="0" data-offset-y="0">s-start</div>
<div class="item thirdRowSecondColumn horizontalTB" data-offset-x="100" data-offset-y="100">default</div>
</div>
</div>
offsetLeft expected 300 but got 0at assert_tolerance (https://www1.wpt.live/resources/check-layout-th.js:24:9) at checkExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:82:9) at checkSubtreeExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:7:25) at https://www1.wpt.live/resources/check-layout-th.js:9:26 at NodeList.forEach (<anonymous>) Asserts run
| ||||||
Fail | .grid 2 | assert_equals:
<div class="container">
<div class="grid fit-content verticalRL directionRTL">
<div class="item firstRowFirstColumn directionLTR horizontalTB selfEnd" data-offset-x="300" data-offset-y="100">end</div>
<div class="item firstRowSecondColumn directionLTR horizontalTB selfCenter" data-offset-x="350" data-offset-y="40">center</div>
<div class="item secondRowFirstColumn directionLTR horizontalTB selfStart" data-offset-x="250" data-offset-y="180">start</div>
<div class="item secondRowSecondColumn directionLTR horizontalTB selfSelfEnd" data-offset-x="250" data-offset-y="80">s-end</div>
<div class="item thirdRowFirstColumn directionLTR horizontalTB selfSelfStart" data-offset-x="0" data-offset-y="100">s-start</div>
<div class="item thirdRowSecondColumn directionLTR horizontalTB" data-offset-x="100" data-offset-y="80">default</div>
</div>
</div>
offsetLeft expected 300 but got 0at assert_tolerance (https://www1.wpt.live/resources/check-layout-th.js:24:9) at checkExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:82:9) at checkSubtreeExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:7:25) at https://www1.wpt.live/resources/check-layout-th.js:9:26 at NodeList.forEach (<anonymous>) Asserts run
| ||||||
Fail | .grid 3 | assert_equals:
<div class="container">
<div class="grid fit-content verticalRL directionLTR">
<div class="item firstRowFirstColumn directionRTL horizontalTB selfEnd" data-offset-x="300" data-offset-y="80">end</div>
<div class="item firstRowSecondColumn directionRTL horizontalTB selfCenter" data-offset-x="350" data-offset-y="140">center</div>
<div class="item secondRowFirstColumn directionRTL horizontalTB selfStart" data-offset-x="250" data-offset-y="0">start</div>
<div class="item secondRowSecondColumn directionRTL horizontalTB selfSelfEnd" data-offset-x="150" data-offset-y="180">s-end</div>
<div class="item thirdRowFirstColumn directionRTL horizontalTB selfSelfStart" data-offset-x="100" data-offset-y="0">s-start</div>
<div class="item thirdRowSecondColumn directionRTL horizontalTB" data-offset-x="100" data-offset-y="100">default</div>
</div>
</div>
offsetLeft expected 300 but got 0at assert_tolerance (https://www1.wpt.live/resources/check-layout-th.js:24:9) at checkExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:82:9) at checkSubtreeExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:7:25) at https://www1.wpt.live/resources/check-layout-th.js:9:26 at NodeList.forEach (<anonymous>) Asserts run
| ||||||
Fail | .grid 4 | assert_equals:
<div class="container">
<div class="grid fit-content verticalRL directionRTL">
<div class="item firstRowFirstColumn horizontalTB selfEnd" data-offset-x="300" data-offset-y="100">end</div>
<div class="item firstRowSecondColumn horizontalTB selfCenter" data-offset-x="350" data-offset-y="40">center</div>
<div class="item secondRowFirstColumn horizontalTB selfStart" data-offset-x="250" data-offset-y="180">start</div>
<div class="item secondRowSecondColumn horizontalTB selfSelfEnd" data-offset-x="150" data-offset-y="80">s-end</div>
<div class="item thirdRowFirstColumn horizontalTB selfSelfStart" data-offset-x="100" data-offset-y="100">s-start</div>
<div class="item thirdRowSecondColumn horizontalTB" data-offset-x="100" data-offset-y="80">default</div>
</div>
</div>
offsetLeft expected 300 but got 0at assert_tolerance (https://www1.wpt.live/resources/check-layout-th.js:24:9) at checkExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:82:9) at checkSubtreeExpectedValues (https://www1.wpt.live/resources/check-layout-th.js:7:25) at https://www1.wpt.live/resources/check-layout-th.js:9:26 at NodeList.forEach (<anonymous>) Asserts run
|