Changeset 254816 in webkit


Ignore:
Timestamp:
Jan 20, 2020 1:49:34 AM (4 years ago)
Author:
commit-queue@webkit.org
Message:

[css-grid] Import grid-align-content-distribution tests to WebKit
​https://bugs.webkit.org/show_bug.cgi?id=205926

Patch by Rossana Monteriso <​rmonteriso@igalia.com> on 2020-01-20
Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Add align-content-distribution tests, checked and adapted to the WPT project,
to the css-grid/alignment folder for imported tests inside WebKit.

  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-expected.txt:
  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr-expected.txt:
  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl-expected.txt:
  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr.html:
  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl.html:
  • web-platform-tests/css/css-grid/alignment/grid-align-content-distribution.html:

LayoutTests:

Remove align-content-distribution tests that are being replaced by newer tests, adapted to the WPT project and imported
to the corresponding css-grid folder inside WebKit.

  • fast/css-grid-layout/grid-align-content-distribution-expected.txt: Removed.
  • fast/css-grid-layout/grid-align-content-distribution-vertical-lr-expected.txt: Removed.
  • fast/css-grid-layout/grid-align-content-distribution-vertical-rl-expected.txt: Removed.
  • fast/css-grid-layout/grid-align-content-distribution.html: Removed.
  • fast/css-grid-layout/grid-align-content-distribution-vertical-lr.html: Removed.
  • fast/css-grid-layout/grid-align-content-distribution-vertical-rl.html: Removed.
Location:
trunk/LayoutTests
Files:
2 edited
6 moved

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r254814 r254816  
     12020-01-20  Rossana Monteriso  <rmonteriso@igalia.com>
     2
     3        [css-grid] Import grid-align-content-distribution tests to WebKit
     4        https://bugs.webkit.org/show_bug.cgi?id=205926
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Remove align-content-distribution tests that are being replaced by newer tests, adapted to the WPT project and imported
     9        to the corresponding css-grid folder inside WebKit.
     10
     11        * fast/css-grid-layout/grid-align-content-distribution-expected.txt: Removed.
     12        * fast/css-grid-layout/grid-align-content-distribution-vertical-lr-expected.txt: Removed.
     13        * fast/css-grid-layout/grid-align-content-distribution-vertical-rl-expected.txt: Removed.
     14        * fast/css-grid-layout/grid-align-content-distribution.html: Removed.
     15        * fast/css-grid-layout/grid-align-content-distribution-vertical-lr.html: Removed.
     16        * fast/css-grid-layout/grid-align-content-distribution-vertical-rl.html: Removed.
     17
     18
    1192020-01-20  youenn fablet  <youenn@apple.com>
    220

  • trunk/LayoutTests/imported/w3c/ChangeLog

    r254807 r254816  
     12020-01-20  Rossana Monteriso  <rmonteriso@igalia.com>
     2
     3        [css-grid] Import grid-align-content-distribution tests to WebKit
     4        https://bugs.webkit.org/show_bug.cgi?id=205926
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Add align-content-distribution tests, checked and adapted to the WPT project,
     9        to the css-grid/alignment folder for imported tests inside WebKit.
     10
     11        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-expected.txt:
     12        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr-expected.txt:
     13        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl-expected.txt:
     14        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr.html:
     15        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl.html:
     16        * web-platform-tests/css/css-grid/alignment/grid-align-content-distribution.html:
     17
    1182020-01-19  Cathie Chen  <cathiechen@igalia.com>
    219

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-expected.txt

    r254815 r254816  
    33direction: LTR | align-content: 'space-between'
    44
    5 PASS
    65direction: LTR | align-content: 'space-around'
    76
    8 PASS
    97direction: LTR | align-content: 'space-evenly'
    108
    11 PASS
    129direction: LTR | align-content: 'stretch'
    1310
    14 PASS
    1511direction: LTR | align-content: 'space-between'
    1612
    17 PASS
    1813direction: LTR | align-content: 'space-around'
    1914
    20 PASS
    2115direction: LTR | align-content: 'space-evenly'
    2216
    23 PASS
    2417direction: LTR | align-content: 'stretch'
    2518
    26 PASS
    2719direction: LTR | align-content: 'space-between'
    2820
    29 PASS
    3021direction: LTR | align-content: 'space-around'
    3122
    32 PASS
    3323direction: LTR | align-content: 'space-evenly'
    3424
    35 PASS
    3625direction: LTR | align-content: 'stretch'
    3726
    38 PASS
    3927direction: RTL | align-content: 'space-between'
    4028
    41 PASS
    4229direction: RTL | align-content: 'space-around'
    4330
    44 PASS
    4531direction: RTL | align-content: 'space-evenly'
    4632
    47 PASS
    4833direction: RTL | align-content: 'stretch'
    4934
    50 PASS
    5135direction: RTL | align-content: 'space-between'
    5236
    53 PASS
    5437direction: RTL | align-content: 'space-around'
    5538
    56 PASS
    5739direction: RTL | align-content: 'space-evenly'
    5840
    59 PASS
    6041direction: RTL | align-content: 'stretch'
    6142
    62 PASS
    6343direction: RTL | align-content: 'space-between'
    6444
    65 PASS
    6645direction: RTL | align-content: 'space-around'
    6746
    68 PASS
    6947direction: RTL | align-content: 'space-evenly'
    7048
    71 PASS
    7249direction: RTL | align-content: 'stretch'
    7350
    74 PASS
     51
     52PASS .grid 1
     53PASS .grid 2
     54PASS .grid 3
     55PASS .grid 4
     56PASS .grid 5
     57PASS .grid 6
     58PASS .grid 7
     59PASS .grid 8
     60PASS .grid 9
     61PASS .grid 10
     62PASS .grid 11
     63PASS .grid 12
     64PASS .grid 13
     65PASS .grid 14
     66PASS .grid 15
     67PASS .grid 16
     68PASS .grid 17
     69PASS .grid 18
     70PASS .grid 19
     71PASS .grid 20
     72PASS .grid 21
     73PASS .grid 22
     74PASS .grid 23
     75PASS .grid 24
     76

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr-expected.txt

    r254815 r254816  
    1 This test checks that the align-content property is applied correctly when using content-distribution values.
     1This test checks that the align-content property is applied correctly when using content-distribution values in vertical-lr writing mode.
    22
    33direction: LTR | align-content: 'space-between'
    44
    5 PASS
    65direction: LTR | align-content: 'space-around'
    76
    8 PASS
    97direction: LTR | align-content: 'space-evenly'
    108
    11 PASS
    129direction: LTR | align-content: 'stretch'
    1310
    14 PASS
    1511direction: LTR | align-content: 'space-between'
    1612
    17 PASS
    1813direction: LTR | align-content: 'space-around'
    1914
    20 PASS
    2115direction: LTR | align-content: 'space-evenly'
    2216
    23 PASS
    2417direction: LTR | align-content: 'stretch'
    2518
    26 PASS
    2719direction: LTR | align-content: 'space-between'
    2820
    29 PASS
    3021direction: LTR | align-content: 'space-around'
    3122
    32 PASS
    3323direction: LTR | align-content: 'space-evenly'
    3424
    35 PASS
    3625direction: LTR | align-content: 'stretch'
    3726
    38 PASS
    3927direction: RTL | align-content: 'space-between'
    4028
    41 PASS
    4229direction: RTL | align-content: 'space-around'
    4330
    44 PASS
    4531direction: RTL | align-content: 'space-evenly'
    4632
    47 PASS
    4833direction: RTL | align-content: 'stretch'
    4934
    50 PASS
    5135direction: RTL | align-content: 'space-between'
    5236
    53 PASS
    5437direction: RTL | align-content: 'space-around'
    5538
    56 PASS
    5739direction: RTL | align-content: 'space-evenly'
    5840
    59 PASS
    6041direction: RTL | align-content: 'stretch'
    6142
    62 PASS
    6343direction: RTL | align-content: 'space-between'
    6444
    65 PASS
    6645direction: RTL | align-content: 'space-around'
    6746
    68 PASS
    6947direction: RTL | align-content: 'space-evenly'
    7048
    71 PASS
    7249direction: RTL | align-content: 'stretch'
    7350
    74 PASS
     51
     52PASS .grid 1
     53PASS .grid 2
     54PASS .grid 3
     55PASS .grid 4
     56PASS .grid 5
     57PASS .grid 6
     58PASS .grid 7
     59PASS .grid 8
     60PASS .grid 9
     61PASS .grid 10
     62PASS .grid 11
     63PASS .grid 12
     64PASS .grid 13
     65PASS .grid 14
     66PASS .grid 15
     67PASS .grid 16
     68PASS .grid 17
     69PASS .grid 18
     70PASS .grid 19
     71PASS .grid 20
     72PASS .grid 21
     73PASS .grid 22
     74PASS .grid 23
     75PASS .grid 24
     76

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr.html

    r254815 r254816  
    1 <!DOCTYPE html>
    2 <html>
    3 <head>
    4 <link href="resources/grid.css" rel="stylesheet">
    5 <script src="../../resources/check-layout.js"></script>
     1<meta charset="utf-8">
     2<title>CSS Grid Layout Test: aligned content distribution for vertical lr</title>
     3<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
     4<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
     5<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values for the vertical-lr writing mode.">
     6<meta name="flags" content="ahem">
     7<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     8<link rel="stylesheet" href="/css/support/grid.css">
     9<link rel="stylesheet" href="/css/support/alignment.css">
     10
    611<style>
    7 body {
    8     margin: 0px;
    9 }
    1012
    1113.grid {
    … …  
    2123}
    2224
    23 .alignContentSpaceBetween {
    24     align-content: space-between;
    25 }
    26 
    27 .alignContentSpaceAround {
    28     align-content: space-around;
    29 }
    30 
    31 .alignContentSpaceEvenly {
    32     align-content: space-evenly;
    33 }
    34 
    35 .alignContentStretch {
    36     align-content: stretch;
    37 }
     25.width300height400 {
     26    width: 300px;
     27    height: 400px;
     28}
     29
     30.thirdRowFirstColumn {
     31    background-color: green;
     32    grid-column: 1;
     33    grid-row: 3;
     34}
     35
     36.fourthRowFirstColumn {
     37    background-color: deepskyblue;
     38    grid-column: 1;
     39    grid-row: 4;
     40}
     41
     42.fourthRowSecondColumn {
     43    background-color: maroon;
     44    grid-column: 2;
     45    grid-row: 4;
     46}
     47
     48.thirdRowFirstColumn {
     49    background-color: green;
     50    grid-column: 1;
     51    grid-row: 3;
     52}
     53
     54.fourthRowFirstColumn {
     55    background-color: deepskyblue;
     56    grid-column: 1;
     57    grid-row: 4;
     58}
     59
     60.fourthRowSecondColumn {
     61    background-color: maroon;
     62    grid-column: 2;
     63    grid-row: 4;
     64}
     65
    3866</style>
    39 </head>
     67
     68<script src="/resources/testharness.js"></script>
     69<script src="/resources/testharnessreport.js"></script>
     70<script src="/resources/check-layout-th.js"></script>
     71
    4072<body onload="checkLayout('.grid')">
    4173
    42 <p>This test checks that the align-content property is applied correctly when using content-distribution values.</p>
     74<p>This test checks that the align-content property is applied correctly when using content-distribution values in vertical-lr writing mode.</p>
    4375
    4476<div style="position: relative">
    … …  
    120152<div style="position: relative">
    121153    <p>direction: LTR | align-content: 'stretch'</p>
    122     <div class="grid stretchedGrid alignContentStretch verticalLR" data-expected-width="400" data-expected-height="300">
    123         <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    124         <div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
    125         <div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    126         <div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
    127         <div class="thirdRowFirstColumn" data-offset-x="267" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    128         <div class="thirdRowSecondColumn" data-offset-x="267" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
     154    <div class="grid stretchedGrid width300height400 alignContentStretch verticalLR" data-expected-width="300" data-expected-height="400">
     155        <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     156        <div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
     157        <div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     158        <div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
     159        <div class="thirdRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     160        <div class="thirdRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
    129161    </div>
    130162</div>
    … …  
    265297<div style="position: relative">
    266298    <p>direction: RTL | align-content: 'stretch'</p>
    267     <div class="grid stretchedGrid alignContentStretch verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
    268         <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    269         <div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
    270         <div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    271         <div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
    272         <div class="thirdRowFirstColumn" data-offset-x="267" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    273         <div class="thirdRowSecondColumn" data-offset-x="267" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
     299    <div class="grid stretchedGrid width300height400 alignContentStretch verticalLR directionRTL" data-expected-width="300" data-expected-height="400">
     300        <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     301        <div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
     302        <div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     303        <div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
     304        <div class="thirdRowFirstColumn" data-offset-x="200" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     305        <div class="thirdRowSecondColumn" data-offset-x="200" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
    274306    </div>
    275307</div>
    … …  
    331363</div>
    332364</body>
    333 </html>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl-expected.txt

    r254815 r254816  
    1 This test checks that the align-content property is applied correctly when using content-distribution values.
     1This test checks that the align-content property is applied correctly when using content-distribution values for vertical-rl mode.
    22
    33direction: LTR | align-content: 'space-between'
    44
    5 PASS
    65direction: LTR | align-content: 'space-around'
    76
    8 PASS
    97direction: LTR | align-content: 'space-evenly'
    108
    11 PASS
    129direction: LTR | align-content: 'stretch'
    1310
    14 PASS
    1511direction: LTR | align-content: 'space-between'
    1612
    17 PASS
    1813direction: LTR | align-content: 'space-around'
    1914
    20 PASS
    2115direction: LTR | align-content: 'space-evenly'
    2216
    23 PASS
    2417direction: LTR | align-content: 'stretch'
    2518
    26 PASS
    2719direction: LTR | align-content: 'space-between'
    2820
    29 PASS
    3021direction: LTR | align-content: 'space-around'
    3122
    32 PASS
    3323direction: LTR | align-content: 'space-evenly'
    3424
    35 PASS
    3625direction: LTR | align-content: 'stretch'
    3726
    38 PASS
    3927direction: RTL | align-content: 'space-between'
    4028
    41 PASS
    4229direction: RTL | align-content: 'space-around'
    4330
    44 PASS
    4531direction: RTL | align-content: 'space-evenly'
    4632
    47 PASS
    4833direction: RTL | align-content: 'stretch'
    4934
    50 PASS
    5135direction: RTL | align-content: 'space-between'
    5236
    53 PASS
    5437direction: RTL | align-content: 'space-around'
    5538
    56 PASS
    5739direction: RTL | align-content: 'space-evenly'
    5840
    59 PASS
    6041direction: RTL | align-content: 'stretch'
    6142
    62 PASS
    6343direction: RTL | align-content: 'space-between'
    6444
    65 PASS
    6645direction: RTL | align-content: 'space-around'
    6746
    68 PASS
    6947direction: RTL | align-content: 'space-evenly'
    7048
    71 PASS
    7249direction: RTL | align-content: 'stretch'
    7350
    74 PASS
     51
     52PASS .grid 1
     53PASS .grid 2
     54PASS .grid 3
     55PASS .grid 4
     56PASS .grid 5
     57PASS .grid 6
     58PASS .grid 7
     59PASS .grid 8
     60PASS .grid 9
     61PASS .grid 10
     62PASS .grid 11
     63PASS .grid 12
     64PASS .grid 13
     65PASS .grid 14
     66PASS .grid 15
     67PASS .grid 16
     68PASS .grid 17
     69PASS .grid 18
     70PASS .grid 19
     71PASS .grid 20
     72PASS .grid 21
     73PASS .grid 22
     74PASS .grid 23
     75PASS .grid 24
     76

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl.html

    r254815 r254816  
    1 <!DOCTYPE html>
    2 <html>
    3 <head>
    4 <link href="resources/grid.css" rel="stylesheet">
    5 <script src="../../resources/check-layout.js"></script>
     1<meta charset="utf-8">
     2<title>CSS Grid Layout Test: aligned content distribution for vertical rl</title>
     3<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
     4<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
     5<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values for the vertical-rl writing mode.">
     6<meta name="flags" content="ahem">
     7<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     8<link rel="stylesheet" href="/css/support/grid.css">
     9<link rel="stylesheet" href="/css/support/alignment.css">
     10
    611<style>
    7 body {
    8     margin: 0px;
    9 }
    1012
    1113.grid {
    … …  
    2123}
    2224
    23 .alignContentSpaceBetween {
    24     align-content: space-between;
    25 }
    26 
    27 .alignContentSpaceAround {
    28     align-content: space-around;
    29 }
    30 
    31 .alignContentSpaceEvenly {
    32     align-content: space-evenly;
    33 }
    34 
    35 .alignContentStretch {
    36     align-content: stretch;
    37 }
     25.width300height400 {
     26    width: 300px;
     27    height: 400px;
     28}
     29
     30.thirdRowFirstColumn {
     31    background-color: green;
     32    grid-column: 1;
     33    grid-row: 3;
     34}
     35
     36.fourthRowFirstColumn {
     37    background-color: deepskyblue;
     38    grid-column: 1;
     39    grid-row: 4;
     40}
     41
     42.fourthRowSecondColumn {
     43    background-color: maroon;
     44    grid-column: 2;
     45    grid-row: 4;
     46}
     47
     48.thirdRowFirstColumn {
     49    background-color: green;
     50    grid-column: 1;
     51    grid-row: 3;
     52}
     53
     54.fourthRowFirstColumn {
     55    background-color: deepskyblue;
     56    grid-column: 1;
     57    grid-row: 4;
     58}
     59
     60.fourthRowSecondColumn {
     61    background-color: maroon;
     62    grid-column: 2;
     63        grid-row: 4;
     64}
     65
    3866</style>
    39 </head>
     67
     68<script src="/resources/testharness.js"></script>
     69<script src="/resources/testharnessreport.js"></script>
     70<script src="/resources/check-layout-th.js"></script>
     71
    4072<body onload="checkLayout('.grid')">
    4173
    42 <p>This test checks that the align-content property is applied correctly when using content-distribution values.</p>
     74<p>This test checks that the align-content property is applied correctly when using content-distribution values for vertical-rl mode.</p>
    4375
    4476<div style="position: relative">
    … …  
    120152<div style="position: relative">
    121153    <p>direction: LTR | align-content: 'stretch'</p>
    122     <div class="grid stretchedGrid alignContentStretch verticalRL" data-expected-width="400" data-expected-height="300">
    123         <div class="firstRowFirstColumn" data-offset-x="267" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    124         <div class="firstRowSecondColumn" data-offset-x="267" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
    125         <div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    126         <div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
    127         <div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
    128         <div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
     154    <div class="grid stretchedGrid width300height400 alignContentStretch verticalRL" data-expected-width="300" data-expected-height="400">
     155        <div class="firstRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     156        <div class="firstRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
     157        <div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     158        <div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
     159        <div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
     160        <div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
    129161    </div>
    130162</div>
    … …  
    265297<div style="position: relative">
    266298    <p>direction: RTL | align-content: 'stretch'</p>
    267     <div class="grid stretchedGrid alignContentStretch verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
    268         <div class="firstRowFirstColumn" data-offset-x="267" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    269         <div class="firstRowSecondColumn" data-offset-x="267" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
    270         <div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    271         <div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
    272         <div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
    273         <div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
     299    <div class="grid stretchedGrid width300height400 alignContentStretch verticalRL directionRTL" data-expected-width="300" data-expected-height="400">
     300        <div class="firstRowFirstColumn" data-offset-x="200" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     301        <div class="firstRowSecondColumn" data-offset-x="200" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
     302        <div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     303        <div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
     304        <div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="380" data-expected-width="100" data-expected-height="20"></div>
     305        <div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="360" data-expected-width="100" data-expected-height="20"></div>
    274306    </div>
    275307</div>
    … …  
    331363</div>
    332364</body>
    333 </html>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution.html

    r254815 r254816  
    1 <!DOCTYPE html>
    2 <html>
    3 <head>
    4 <link href="resources/grid.css" rel="stylesheet">
    5 <script src="../../resources/check-layout.js"></script>
     1<meta charset="utf-8">
     2<title>CSS Grid Layout Test: aligned content distribution</title>
     3<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
     4<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
     5<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values.">
     6<meta name="flags" content="ahem">
     7<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     8<link rel="stylesheet" href="/css/support/grid.css">
     9<link rel="stylesheet" href="/css/support/alignment.css">
     10
    611<style>
    7 body {
    8     margin: 0px;
    9 }
    1012
    1113.grid {
    … …  
    2123}
    2224
    23 .alignContentSpaceBetween {
    24     align-content: space-between;
    25 }
    26 
    27 .alignContentSpaceAround {
    28     align-content: space-around;
    29 }
    30 
    31 .alignContentSpaceEvenly {
    32     align-content: space-evenly;
    33 }
    34 
    35 .alignContentStretch {
    36     align-content: stretch;
    37 }
     25.thirdRowFirstColumn {
     26    background-color: green;
     27    grid-column: 1;
     28    grid-row: 3;
     29}
     30
     31.fourthRowFirstColumn {
     32    background-color: deepskyblue;
     33    grid-column: 1;
     34    grid-row: 4;
     35}
     36
     37.fourthRowSecondColumn {
     38    background-color: maroon;
     39    grid-column: 2;
     40    grid-row: 4;
     41}
     42
     43.thirdRowFirstColumn {
     44    background-color: green;
     45    grid-column: 1;
     46    grid-row: 3;
     47}
     48
     49.fourthRowFirstColumn {
     50    background-color: deepskyblue;
     51    grid-column: 1;
     52    grid-row: 4;
     53}
     54
     55.fourthRowSecondColumn {
     56    background-color: maroon;
     57    grid-column: 2;
     58        grid-row: 4;
     59}
     60
    3861</style>
    39 </head>
     62
     63<script src="/resources/testharness.js"></script>
     64<script src="/resources/testharnessreport.js"></script>
     65<script src="/resources/check-layout-th.js"></script>
     66
    4067<body onload="checkLayout('.grid')">
    4168
    … …  
    331358</div>
    332359</body>
    333 </html>
Note: See TracChangeset for help on using the changeset viewer.