Changeset 277391 in webkit


Ignore:
Timestamp:
May 12, 2021 2:43:31 PM (14 months ago)
Author:
commit-queue@webkit.org
Message:

Wrong position for orthogonal positioned element with writing-mode: vertical-rl
https://bugs.webkit.org/show_bug.cgi?id=180633

Patch by Ziran Sun <Ziran Sun> on 2021-05-12
Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Re-sync the following 3 tests with WPT. grid-self-alignment-non-static-positioned-items-009.html and
grid-self-alignment-non-static-positioned-items-010.html are now passing.
grid-self-alignment-non-static-positioned-items-011.html is now producing the same test results as those
in Chromium.

  • web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-009.html:
  • web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-010.html:
  • web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-011.html:

Source/WebCore:

When calculating offset position for orthogonal positioned element with writing mode vertical-rl,
we also need to take into account of borders and paddings. This change corrects computations
for both topOffset and leftOffset.

  • rendering/RenderBox.cpp:

(WebCore::RenderBox::computePositionedLogicalWidthUsing const):
(WebCore::RenderBox::computePositionedLogicalHeightUsing const):

Location:
trunk
Files:
9 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/imported/w3c/ChangeLog

    r277371 r277391  
     12021-05-12  Ziran Sun  <zsun@igalia.com>
     2
     3        Wrong position for orthogonal positioned element with writing-mode: vertical-rl
     4        https://bugs.webkit.org/show_bug.cgi?id=180633
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Re-sync the following 3 tests with WPT. grid-self-alignment-non-static-positioned-items-009.html and
     9        grid-self-alignment-non-static-positioned-items-010.html are now passing.
     10        grid-self-alignment-non-static-positioned-items-011.html is now producing the same test results as those
     11        in Chromium.
     12
     13        * web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-009.html:
     14        * web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-010.html:
     15        * web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-011.html:
     16
    1172021-05-12  Sergio Villar Senin  <svillar@igalia.com>
    218
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-009-expected.txt

    r267650 r277391  
    2323XX XXX
    2424
    25 FAIL .grid 1 assert_equals:
    26 <div class="grid">
    27   <div data-offset-x="5" data-offset-y="0" data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
    28   <div data-offset-x="180" data-offset-y="60" data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    29   <div data-offset-x="0" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn RTL">X XX X</div>
    30   <div data-offset-x="105" data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    31 </div>
    32 offsetLeft expected 180 but got 210
    33 FAIL .grid 2 assert_equals:
    34 <div class="grid RTL">
    35   <div data-offset-x="155" data-offset-y="0" data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
    36   <div data-offset-x="80" data-offset-y="60" data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    37   <div data-offset-x="160" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn LTR">X XX X</div>
    38   <div data-offset-x="35" data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    39 </div>
    40 offsetLeft expected 80 but got 110
     25PASS .grid 1
     26PASS .grid 2
    4127PASS .grid 3
    42 FAIL .grid 4 assert_equals:
    43 <div class="grid verticalRL">
    44   <div data-offset-x="105" data-offset-y="70" data-expected-width="90" data-expected-height="30" class="firstRowFirstColumn horizontal">X XX X</div>
    45   <div data-offset-x="140" data-offset-y="150" data-expected-width="100" data-expected-height="50" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    46   <div data-offset-x="5" data-offset-y="10" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    47   <div data-offset-x="5" data-offset-y="115" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    48 </div>
    49 offsetLeft expected 105 but got 75
     28PASS .grid 4
    5029
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-009.html

    r262056 r277391  
    7272</script>
    7373<body onload="document.fonts.ready.then(() => { checkLayout('.grid'); })">
    74 <!-- The test cases with vertical-rl wirting-mode will fail becauuse of bug 779105 -->
    7574<div class="grid">
    7675  <div data-offset-x="5"   data-offset-y="0"   data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
     
    8483  <div data-offset-x="80"  data-offset-y="60"  data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    8584  <div data-offset-x="160" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn LTR">X XX X</div>
    86   <div data-offset-x="35"  data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     85  <div data-offset-x="5"   data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    8786</div>
    8887
     
    10099  <div data-offset-x="140" data-offset-y="150" data-expected-width="100" data-expected-height="50" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    101100  <div data-offset-x="5"   data-offset-y="10"  data-expected-width="90"  data-expected-height="30" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    102   <div data-offset-x="5"   data-offset-y="115" data-expected-width="70"  data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
     101  <div data-offset-x="5"   data-offset-y="110" data-expected-width="70"  data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    103102</div>
    104103</body>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-010-expected.txt

    r267650 r277391  
    2323XX XXX
    2424
    25 FAIL .grid 1 assert_equals:
    26 <div class="grid">
    27   <div data-offset-x="5" data-offset-y="0" data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
    28   <div data-offset-x="180" data-offset-y="60" data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    29   <div data-offset-x="0" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn RTL">X XX X</div>
    30   <div data-offset-x="105" data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    31 </div>
    32 offsetLeft expected 180 but got 210
    33 FAIL .grid 2 assert_equals:
    34 <div class="grid RTL">
    35   <div data-offset-x="155" data-offset-y="0" data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
    36   <div data-offset-x="80" data-offset-y="60" data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    37   <div data-offset-x="160" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn LTR">X XX X</div>
    38   <div data-offset-x="35" data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    39 </div>
    40 offsetLeft expected 80 but got 110
     25PASS .grid 1
     26PASS .grid 2
    4127PASS .grid 3
    42 FAIL .grid 4 assert_equals:
    43 <div class="grid verticalRL">
    44   <div data-offset-x="105" data-offset-y="70" data-expected-width="90" data-expected-height="30" class="firstRowFirstColumn horizontal">X XX X</div>
    45   <div data-offset-x="140" data-offset-y="150" data-expected-width="100" data-expected-height="50" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    46   <div data-offset-x="5" data-offset-y="10" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    47   <div data-offset-x="5" data-offset-y="115" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    48 </div>
    49 offsetLeft expected 105 but got 75
     28PASS .grid 4
    5029
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-010.html

    r262056 r277391  
    6868</script>
    6969<body onload="document.fonts.ready.then(() => { checkLayout('.grid'); })">
    70 <!-- The test cases with vertical-rl wirting-mode will fail becauuse of bug 779105 -->
    7170<div class="grid">
    7271  <div data-offset-x="5"   data-offset-y="0"   data-expected-width="40" data-expected-height="80" class="firstRowFirstColumn verticalLR">X XX X</div>
     
    8079  <div data-offset-x="80"  data-offset-y="60"  data-expected-width="60" data-expected-height="90" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    8180  <div data-offset-x="160" data-offset-y="160" data-expected-width="90" data-expected-height="30" class="secondRowFirstColumn LTR">X XX X</div>
    82   <div data-offset-x="35"  data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     81  <div data-offset-x="5"   data-offset-y="160" data-expected-width="70" data-expected-height="80" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    8382</div>
    8483
     
    9695  <div data-offset-x="140" data-offset-y="150" data-expected-width="100" data-expected-height="50" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    9796  <div data-offset-x="5"   data-offset-y="10"  data-expected-width="90"  data-expected-height="30" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    98   <div data-offset-x="5"   data-offset-y="115" data-expected-width="70"  data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
     97  <div data-offset-x="5"   data-offset-y="110" data-expected-width="70"  data-expected-height="80" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    9998</div>
    10099</body>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-011-expected.txt

    r267650 r277391  
    2626<div class="grid">
    2727  <div data-offset-x="13" data-offset-y="2" data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
    28   <div data-offset-x="180" data-offset-y="60" data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    29   <div data-offset-x="0" data-offset-y="160" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn RTL">X XX X</div>
    30   <div data-offset-x="105" data-offset-y="160" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     28  <div data-offset-x="190" data-offset-y="64" data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
     29  <div data-offset-x="8" data-offset-y="162" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn RTL">X XX X</div>
     30  <div data-offset-x="113" data-offset-y="162" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    3131</div>
    32 offsetLeft expected 180 but got 210
     32offsetLeft expected 190 but got 194
    3333FAIL .grid 2 assert_equals:
    3434<div class="grid RTL">
    35   <div data-offset-x="155" data-offset-y="0" data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
    36   <div data-offset-x="80" data-offset-y="60" data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    37   <div data-offset-x="160" data-offset-y="160" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn LTR">X XX X</div>
    38   <div data-offset-x="35" data-offset-y="160" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     35  <div data-offset-x="163" data-offset-y="2" data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
     36  <div data-offset-x="90" data-offset-y="64" data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
     37  <div data-offset-x="170" data-offset-y="162" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn LTR">X XX X</div>
     38  <div data-offset-x="13" data-offset-y="162" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    3939</div>
    40 offsetLeft expected 155 but got 163
    41 FAIL .grid 3 assert_equals:
    42 <div class="grid verticalLR">
    43   <div data-offset-x="5" data-offset-y="70" data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
    44   <div data-offset-x="40" data-offset-y="150" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    45   <div data-offset-x="180" data-offset-y="10" data-expected-width="26" data-expected-height="20" class="secondRowFirstColumn verticalRL">X XX X</div>
    46   <div data-offset-x="155" data-offset-y="110" data-expected-width="76" data-expected-height="50" class="secondRowSecondColumn horizontal RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    47 </div>
    48 offsetLeft expected 5 but got 13
     40offsetLeft expected 90 but got 94
     41PASS .grid 3
    4942FAIL .grid 4 assert_equals:
    5043<div class="grid verticalRL">
    51   <div data-offset-x="105" data-offset-y="70" data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
    52   <div data-offset-x="140" data-offset-y="150" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    53   <div data-offset-x="5" data-offset-y="10" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    54   <div data-offset-x="5" data-offset-y="115" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
     44  <div data-offset-x="113" data-offset-y="74" data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
     45  <div data-offset-x="150" data-offset-y="153" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
     46  <div data-offset-x="14" data-offset-y="12" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn horizontal RTL">X XX X</div>
     47  <div data-offset-x="13" data-offset-y="112" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    5548</div>
    56 offsetLeft expected 105 but got 101
     49offsetLeft expected 113 but got 117
    5750
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-self-alignment-non-static-positioned-items-011.html

    r262056 r277391  
    7474</script>
    7575<body onload="document.fonts.ready.then(() => { checkLayout('.grid'); })">
    76 <!-- The test cases with vertical-rl wirting-mode will fail becauuse of bug 779105 -->
    7776<div class="grid">
    7877  <div data-offset-x="13"  data-offset-y="2"   data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
    79   <div data-offset-x="180" data-offset-y="60"  data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    80   <div data-offset-x="0"   data-offset-y="160" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn RTL">X XX X</div>
    81   <div data-offset-x="105" data-offset-y="160" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     78  <div data-offset-x="190" data-offset-y="64"  data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
     79  <div data-offset-x="8"   data-offset-y="162" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn RTL">X XX X</div>
     80  <div data-offset-x="113" data-offset-y="162" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalLR RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    8281</div>
    8382
    8483<div class="grid RTL">
    85   <div data-offset-x="155" data-offset-y="0"   data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
    86   <div data-offset-x="80"  data-offset-y="60"  data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
    87   <div data-offset-x="160" data-offset-y="160" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn LTR">X XX X</div>
    88   <div data-offset-x="35"  data-offset-y="160" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     84  <div data-offset-x="163" data-offset-y="2"   data-expected-width="26" data-expected-height="70" class="firstRowFirstColumn verticalLR">X XX X</div>
     85  <div data-offset-x="90"  data-offset-y="64"  data-expected-width="46" data-expected-height="80" class="firstRowSecondColumn verticalRL">XX X<br>X XXX X<br>XX XXX</div>
     86  <div data-offset-x="170" data-offset-y="162" data-expected-width="76" data-expected-height="20" class="secondRowFirstColumn LTR">X XX X</div>
     87  <div data-offset-x="13"  data-offset-y="162" data-expected-width="56" data-expected-height="70" class="secondRowSecondColumn verticalRL RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    8988</div>
    9089
     
    9291
    9392<div class="grid verticalLR">
    94   <div data-offset-x="5"   data-offset-y="70"  data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
    95   <div data-offset-x="40"  data-offset-y="150" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    96   <div data-offset-x="180" data-offset-y="10"  data-expected-width="26" data-expected-height="20" class="secondRowFirstColumn verticalRL">X XX X</div>
    97   <div data-offset-x="155" data-offset-y="110" data-expected-width="76" data-expected-height="50" class="secondRowSecondColumn horizontal RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
     93  <div data-offset-x="13"  data-offset-y="74"  data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
     94  <div data-offset-x="50"  data-offset-y="153" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
     95  <div data-offset-x="189" data-offset-y="12"  data-expected-width="26" data-expected-height="70" class="secondRowFirstColumn verticalRL">X XX X</div>
     96  <div data-offset-x="163" data-offset-y="112" data-expected-width="76" data-expected-height="50" class="secondRowSecondColumn horizontal RTL">XX X<br>X XXX<br>X<br>XX XXX</div>
    9897</div>
    9998
    10099<div class="grid verticalRL">
    101   <div data-offset-x="105" data-offset-y="70"  data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
    102   <div data-offset-x="140" data-offset-y="150" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
    103   <div data-offset-x="5"   data-offset-y="10"  data-expected-width="76"  data-expected-height="20" class="secondRowFirstColumn horizontal RTL">X XX X</div>
    104   <div data-offset-x="5"   data-offset-y="115" data-expected-width="56"  data-expected-height="70" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
     100  <div data-offset-x="113" data-offset-y="74"  data-expected-width="76" data-expected-height="20" class="firstRowFirstColumn horizontal">X XX X</div>
     101  <div data-offset-x="150" data-offset-y="153" data-expected-width="86" data-expected-height="40" class="firstRowSecondColumn horizontal">XX X<br>X XXX X<br>XX XXX</div>
     102  <div data-offset-x="14"  data-offset-y="12"  data-expected-width="76"  data-expected-height="20" class="secondRowFirstColumn horizontal RTL">X XX X</div>
     103  <div data-offset-x="13"  data-offset-y="112" data-expected-width="56"  data-expected-height="70" class="secondRowSecondColumn verticalLR">XX X<br>X XXX<br>X<br>XX XXX</div>
    105104</div>
    106105</body>
  • trunk/Source/WebCore/ChangeLog

    r277390 r277391  
     12021-05-12  Ziran Sun  <zsun@igalia.com>
     2
     3        Wrong position for orthogonal positioned element with writing-mode: vertical-rl
     4        https://bugs.webkit.org/show_bug.cgi?id=180633
     5
     6        Reviewed by Javier Fernandez.
     7
     8        When calculating offset position for orthogonal positioned element with writing mode vertical-rl,
     9        we also need to take into account of borders and paddings. This change corrects computations
     10        for both topOffset and leftOffset.
     11
     12        * rendering/RenderBox.cpp:
     13        (WebCore::RenderBox::computePositionedLogicalWidthUsing const):
     14        (WebCore::RenderBox::computePositionedLogicalHeightUsing const):
     15
    1162021-05-12  Jer Noble  <jer.noble@apple.com>
    217
  • trunk/Source/WebCore/rendering/RenderBox.cpp

    r277321 r277391  
    39933993
    39943994    computedValues.m_position = logicalLeftValue + marginLogicalLeftValue;
    3995     computeLogicalLeftPositionedOffset(computedValues.m_position, this, computedValues.m_extent, containerBlock, containerLogicalWidth);
     3995    computeLogicalLeftPositionedOffset(computedValues.m_position, this, computedValues.m_extent + bordersPlusPadding, containerBlock, containerLogicalWidth);
    39963996}
    39973997
     
    42874287    // Use computed values to calculate the vertical position.
    42884288    computedValues.m_position = logicalTopValue + computedValues.m_margins.m_before;
    4289     computeLogicalTopPositionedOffset(computedValues.m_position, this, logicalHeightValue, containerBlock, containerLogicalHeight);
     4289    computeLogicalTopPositionedOffset(computedValues.m_position, this, logicalHeightValue + bordersPlusPadding, containerBlock, containerLogicalHeight);
    42904290}
    42914291
     
    44554455
    44564456    LayoutUnit logicalLeftPos = logicalLeftValue + marginLogicalLeftAlias;
     4457    // Border and padding have already been included in computedValues.m_extent.
    44574458    computeLogicalLeftPositionedOffset(logicalLeftPos, this, computedValues.m_extent, containerBlock, containerLogicalWidth);
    44584459    computedValues.m_position = logicalLeftPos;
     
    45844585    // Use computed values to calculate the vertical position.
    45854586    LayoutUnit logicalTopPos = logicalTopValue + marginBeforeAlias;
     4587    // Border and padding have already been included in computedValues.m_extent.
    45864588    computeLogicalTopPositionedOffset(logicalTopPos, this, computedValues.m_extent, containerBlock, containerLogicalHeight);
    45874589    computedValues.m_position = logicalTopPos;
Note: See TracChangeset for help on using the changeset viewer.