Changeset 152479 in webkit


Ignore:
Timestamp:
Jul 8, 2013 8:09:02 PM (11 years ago)
Author:
Martin Robinson
Message:

[CSS Grid Layout] Rename grid-{rows|columns} to grid-definition-{rows|columns}
https://bugs.webkit.org/show_bug.cgi?id=103336

Reviewed by Tony Chang.

Source/WebCore:

Rename -webkit-grid-{rows|columns} to -webkit-grid-definition-{rows|columns}.
The latest version of the spec has renamed these properties.

  • css/CSSComputedStyleDeclaration.cpp:

(WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue): Handle the new names.

  • css/CSSParser.cpp:

(WebCore::CSSParser::parseValue): Ditto.

  • css/CSSProperty.cpp:

(WebCore::CSSProperty::isInheritedProperty): Ditto.

  • css/CSSPropertyNames.in: Add support for the new names.
  • css/StyleResolver.cpp:

(WebCore::StyleResolver::applyProperty): Handle the new names.

LayoutTests:

Update tests to reflect the rename of -webkit-grid-{rows|columns} to
-webkit-grid-definition-{rows|columns}.

  • fast/css-grid-layout: Mass search and replace for the new name.
Location:
trunk
Files:
83 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r152478 r152479  
     12013-07-08  Martin Robinson  <mrobinson@igalia.com>
     2
     3        [CSS Grid Layout] Rename grid-{rows|columns} to grid-definition-{rows|columns}
     4        https://bugs.webkit.org/show_bug.cgi?id=103336
     5
     6        Reviewed by Tony Chang.
     7
     8        Update tests to reflect the rename of -webkit-grid-{rows|columns} to
     9        -webkit-grid-definition-{rows|columns}.
     10
     11        * fast/css-grid-layout: Mass search and replace for the new name.
     12
    1132013-07-08  Enrica Casucci  <enrica@apple.com>
    214
  • trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns.html

    r142798 r152479  
    88<style>
    99.gridAutoContent {
    10     -webkit-grid-columns: auto;
    11     -webkit-grid-rows: 50px;
     10    -webkit-grid-definition-columns: auto;
     11    -webkit-grid-definition-rows: 50px;
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows.html

    r142798 r152479  
    88<style>
    99.gridAutoContent {
    10     -webkit-grid-columns: 50px;
    11     -webkit-grid-rows: auto;
     10    -webkit-grid-definition-columns: 50px;
     11    -webkit-grid-definition-rows: auto;
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/breadth-size-resolution-grid.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 100px 10vw;
    11     -webkit-grid-rows: 10vh 100px;
     10    -webkit-grid-definition-columns: 100px 10vw;
     11    -webkit-grid-definition-rows: 10vh 100px;
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/calc-resolution-grid-item.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 100px 300px;
    11     -webkit-grid-rows: 50px 150px;
     10    -webkit-grid-definition-columns: 100px 300px;
     11    -webkit-grid-definition-rows: 50px 150px;
    1212    height: 200px;
    1313    width: 400px;
  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-auto-flow-resolution.html

    r146467 r152479  
    99<style>
    1010.grid {
    11     -webkit-grid-rows: 5px;
    12     -webkit-grid-columns: 10px;
     11    -webkit-grid-definition-rows: 5px;
     12    -webkit-grid-definition-columns: 10px;
    1313}
    1414
  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-resolution.html

    r146467 r152479  
    99<style>
    1010.grid {
    11     -webkit-grid-rows: 20px;
    12     -webkit-grid-columns: 10px;
     11    -webkit-grid-definition-rows: 20px;
     12    -webkit-grid-definition-columns: 10px;
    1313}
    1414
  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-update.html

    r146467 r152479  
    99<style>
    1010.grid {
    11     -webkit-grid-rows: 20px;
    12     -webkit-grid-columns: 10px;
     11    -webkit-grid-definition-rows: 20px;
     12    -webkit-grid-definition-columns: 10px;
    1313    -webkit-grid-auto-rows: 30px;
    1414    -webkit-grid-auto-columns: 50px;
  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html

    r145240 r152479  
    88<style>
    99.smallGrid {
    10     -webkit-grid-columns: 50px 100px;
    11     -webkit-grid-rows: 50px 100px;
     10    -webkit-grid-definition-columns: 50px 100px;
     11    -webkit-grid-definition-rows: 50px 100px;
    1212}
    1313
    1414.bigGrid {
    15     -webkit-grid-columns: 50px 100px 150px 200px;
    16     -webkit-grid-rows: 50px 100px 150px 200px;
     15    -webkit-grid-definition-columns: 50px 100px 150px 200px;
     16    -webkit-grid-definition-rows: 50px 100px 150px 200px;
    1717}
    1818
  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-update.html

    r146098 r152479  
    99<style>
    1010.grid {
    11     -webkit-grid-columns: 50px 100px;
    12     -webkit-grid-rows: 50px 100px;
     11    -webkit-grid-definition-columns: 50px 100px;
     12    -webkit-grid-definition-rows: 50px 100px;
    1313}
    1414</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-expected.txt

    r137478 r152479  
    1 Test that setting and getting grid-columns and grid-rows works as expected
     1Test that setting and getting grid-definition-columns and grid-definition-rows works as expected
    22
    33On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
    44
    55
    6 Test getting -webkit-grid-columns and -webkit-grid-rows set through CSS
    7 PASS getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-columns') is 'none'
    8 PASS getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-rows') is 'none'
    9 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-columns') is '10px'
    10 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-rows') is '15px'
    11 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-columns') is '53%'
    12 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-rows') is '27%'
    13 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-columns') is 'auto'
    14 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows') is 'auto'
    15 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns') is '100px'
    16 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px'
    17 PASS getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-columns') is '64px'
    18 PASS getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-rows') is '60px'
    19 PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-columns') is 'minmax(10%, 15px)'
    20 PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-rows') is 'minmax(20px, 50%)'
    21 PASS getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-columns') is '-webkit-min-content'
    22 PASS getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-rows') is '-webkit-min-content'
    23 PASS getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-columns') is '-webkit-max-content'
    24 PASS getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-rows') is '-webkit-max-content'
     6Test getting -webkit-grid-definition-columns and -webkit-grid-definition-rows set through CSS
     7PASS getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     8PASS getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     9PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-columns') is '10px'
     10PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-rows') is '15px'
     11PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-columns') is '53%'
     12PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-rows') is '27%'
     13PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-columns') is 'auto'
     14PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-rows') is 'auto'
     15PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-columns') is '100px'
     16PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-rows') is '150px'
     17PASS getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-definition-columns') is '64px'
     18PASS getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-definition-rows') is '60px'
     19PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(10%, 15px)'
     20PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(20px, 50%)'
     21PASS getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-definition-columns') is '-webkit-min-content'
     22PASS getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-definition-rows') is '-webkit-min-content'
     23PASS getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-definition-columns') is '-webkit-max-content'
     24PASS getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-definition-rows') is '-webkit-max-content'
    2525
    26 Test getting wrong values for -webkit-grid-columns and -webkit-grid-rows through CSS (they should resolve to the default: 'none')
    27 PASS getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-columns') is 'none'
    28 PASS getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-rows') is 'none'
    29 PASS getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-columns') is 'none'
    30 PASS getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-rows') is 'none'
     26Test getting wrong values for -webkit-grid-definition-columns and -webkit-grid-definition-rows through CSS (they should resolve to the default: 'none')
     27PASS getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     28PASS getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     29PASS getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     30PASS getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    3131
    3232Test the initial value
    33 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    34 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
     33PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     34PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    3535
    36 Test getting and setting -webkit-grid-columns and -webkit-grid-rows through JS
    37 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '18px'
    38 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '66px'
    39 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '55%'
    40 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '40%'
    41 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto'
    42 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto'
    43 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '80px'
    44 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '150px'
    45 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '-webkit-min-content'
    46 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '-webkit-min-content'
    47 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '-webkit-max-content'
    48 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '-webkit-max-content'
     36Test getting and setting -webkit-grid-definition-columns and -webkit-grid-definition-rows through JS
     37PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '18px'
     38PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '66px'
     39PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '55%'
     40PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '40%'
     41PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'auto'
     42PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'auto'
     43PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '80px'
     44PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '150px'
     45PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '-webkit-min-content'
     46PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '-webkit-min-content'
     47PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '-webkit-max-content'
     48PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '-webkit-max-content'
    4949
    50 Test getting and setting -webkit-grid-columns and -webkit-grid-rows to minmax() values through JS
    51 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(55%, 45px)'
    52 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(30px, 40%)'
    53 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(220px, 48px)'
    54 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(80px, 50px)'
    55 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(-webkit-min-content, 48px)'
    56 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(80px, -webkit-min-content)'
    57 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(220px, -webkit-max-content)'
    58 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(-webkit-max-content, 50px)'
    59 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(220px, -webkit-max-content)'
    60 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(-webkit-max-content, 50px)'
    61 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(-webkit-min-content, -webkit-max-content)'
    62 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(-webkit-max-content, -webkit-min-content)'
     50Test getting and setting -webkit-grid-definition-columns and -webkit-grid-definition-rows to minmax() values through JS
     51PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(55%, 45px)'
     52PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(30px, 40%)'
     53PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(220px, 48px)'
     54PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(80px, 50px)'
     55PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(-webkit-min-content, 48px)'
     56PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(80px, -webkit-min-content)'
     57PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(220px, -webkit-max-content)'
     58PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(-webkit-max-content, 50px)'
     59PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(220px, -webkit-max-content)'
     60PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(-webkit-max-content, 50px)'
     61PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(-webkit-min-content, -webkit-max-content)'
     62PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(-webkit-max-content, -webkit-min-content)'
    6363
    64 Test setting grid-columns and grid-rows to bad minmax value through JS
    65 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    66 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    67 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    68 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    69 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    70 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    71 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    72 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
     64Test setting grid-definition-columns and grid-definition-rows to bad minmax value through JS
     65PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     66PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     67PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     68PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     69PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     70PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     71PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     72PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    7373
    74 Test setting grid-columns and grid-rows back to 'none' through JS
    75 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '18px'
    76 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '66px'
    77 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    78 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
     74Test setting grid-definition-columns and grid-definition-rows back to 'none' through JS
     75PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '18px'
     76PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '66px'
     77PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     78PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    7979PASS successfullyParsed is true
    8080
  • trunk/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt

    r137478 r152479  
    1 Test that setting and getting grid-columns and grid-rows works as expected
     1Test that setting and getting grid-definition-columns and grid-definition-rows works as expected
    22
    33On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
     
    55
    66Test getting |display| set through CSS
    7 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-columns') is '7px 11px'
    8 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-rows') is '17px 2px'
    9 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-columns') is '53% 99%'
    10 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-rows') is '27% 52%'
    11 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-columns') is 'auto auto'
    12 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows') is 'auto auto'
    13 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns') is '100px 120px'
    14 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px 170px'
    15 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns') is '15px auto 100px'
    16 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows') is '120px 18px auto'
    17 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-columns') is '50% 120px'
    18 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-rows') is '35% 168px'
    19 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-columns') is 'none'
    20 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-rows') is 'none'
    21 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-columns') is '-webkit-min-content -webkit-max-content'
    22 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-rows') is '-webkit-max-content -webkit-min-content'
    23 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-columns') is 'minmax(45px, 30%) 15px'
    24 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-rows') is '120px minmax(35%, 10px)'
    25 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-columns') is 'minmax(-webkit-min-content, 30%) 15px'
    26 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-rows') is '120px minmax(35%, -webkit-max-content)'
     7PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-columns') is '7px 11px'
     8PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-rows') is '17px 2px'
     9PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-columns') is '53% 99%'
     10PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-rows') is '27% 52%'
     11PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-columns') is 'auto auto'
     12PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-rows') is 'auto auto'
     13PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-columns') is '100px 120px'
     14PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-rows') is '150px 170px'
     15PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-definition-columns') is '15px auto 100px'
     16PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-definition-rows') is '120px 18px auto'
     17PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-definition-columns') is '50% 120px'
     18PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-definition-rows') is '35% 168px'
     19PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     20PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     21PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-definition-columns') is '-webkit-min-content -webkit-max-content'
     22PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-definition-rows') is '-webkit-max-content -webkit-min-content'
     23PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(45px, 30%) 15px'
     24PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-definition-rows') is '120px minmax(35%, 10px)'
     25PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-definition-columns') is 'minmax(-webkit-min-content, 30%) 15px'
     26PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-definition-rows') is '120px minmax(35%, -webkit-max-content)'
    2727
    2828Test the initial value
    29 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    30 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
     29PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     30PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    3131
    3232Test getting and setting display through JS
    33 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '18px 22px'
    34 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '66px 70px'
    35 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '55% 80%'
    36 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '40% 63%'
    37 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto auto'
    38 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto auto'
    39 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto 160px 22px'
    40 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '56% 100px auto'
    41 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '160px minmax(16px, 20px)'
    42 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(10%, 15%) auto'
     33PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '18px 22px'
     34PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '66px 70px'
     35PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '55% 80%'
     36PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '40% 63%'
     37PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'auto auto'
     38PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'auto auto'
     39PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'auto 160px 22px'
     40PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '56% 100px auto'
     41PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '160px minmax(16px, 20px)'
     42PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'minmax(10%, 15%) auto'
    4343
    4444Test getting wrong values set from CSS
    45 PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-columns') is 'none'
    46 PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-rows') is 'none'
    47 PASS getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-columns') is 'none'
    48 PASS getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-rows') is 'none'
     45PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     46PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     47PASS getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     48PASS getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    4949
    5050Test setting and getting wrong values from JS
    51 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    52 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    53 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    54 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    55 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    56 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    57 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    58 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    59 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    60 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    61 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '50% 96px'
    62 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '5% 510px'
    63 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    64 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
    65 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
    66 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
     51PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     52PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     53PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     54PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     55PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     56PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     57PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     58PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     59PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     60PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     61PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is '50% 96px'
     62PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is '5% 510px'
     63PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     64PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
     65PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is 'none'
     66PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows') is 'none'
    6767PASS successfullyParsed is true
    6868
  • trunk/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html

    r140480 r152479  
    99<style>
    1010.gridWithFixed {
    11     -webkit-grid-columns: 7px 11px;
    12     -webkit-grid-rows: 17px 2px;
     11    -webkit-grid-definition-columns: 7px 11px;
     12    -webkit-grid-definition-rows: 17px 2px;
    1313}
    1414
    1515.gridWithPercent {
    16     -webkit-grid-columns: 53% 99%;
    17     -webkit-grid-rows: 27% 52%;
     16    -webkit-grid-definition-columns: 53% 99%;
     17    -webkit-grid-definition-rows: 27% 52%;
    1818}
    1919.gridWithAuto {
    20     -webkit-grid-columns: auto auto;
    21     -webkit-grid-rows: auto auto;
     20    -webkit-grid-definition-columns: auto auto;
     21    -webkit-grid-definition-rows: auto auto;
    2222}
    2323.gridWithEM {
    24     -webkit-grid-columns: 10em 12em;
    25     -webkit-grid-rows: 15em 17em;
     24    -webkit-grid-definition-columns: 10em 12em;
     25    -webkit-grid-definition-rows: 15em 17em;
    2626    font: 10px Ahem;
    2727}
    2828.gridWithNoneAndAuto {
    29     -webkit-grid-columns: none auto;
    30     -webkit-grid-rows: none auto;
     29    -webkit-grid-definition-columns: none auto;
     30    -webkit-grid-definition-rows: none auto;
    3131}
    3232.gridNoneWithAndFixed {
    33     -webkit-grid-columns: none 15px;
    34     -webkit-grid-rows: none 22px;
     33    -webkit-grid-definition-columns: none 15px;
     34    -webkit-grid-definition-rows: none 22px;
    3535}
    3636.gridWithThreeItems {
    37     -webkit-grid-columns: 15px auto 10em;
    38     -webkit-grid-rows: 12em 18px auto;
     37    -webkit-grid-definition-columns: 15px auto 10em;
     38    -webkit-grid-definition-rows: 12em 18px auto;
    3939    font: 10px Ahem;
    4040}
    4141.gridWithPercentAndViewportPercent {
    42     -webkit-grid-columns: 50% 15vw;
    43     -webkit-grid-rows: 35% 28vh;
     42    -webkit-grid-definition-columns: 50% 15vw;
     43    -webkit-grid-definition-rows: 35% 28vh;
    4444}
    4545.gridWithFitContentAndFitAvailable {
    46     -webkit-grid-columns: -webkit-content-available;
    47     -webkit-grid-rows: -webkit-fitcontent -webkit-fit-available;
     46    -webkit-grid-definition-columns: -webkit-content-available;
     47    -webkit-grid-definition-rows: -webkit-fitcontent -webkit-fit-available;
    4848}
    4949.gridWithMinMaxContent {
    50     -webkit-grid-columns: -webkit-min-content -webkit-max-content;
    51     -webkit-grid-rows: -webkit-max-content -webkit-min-content;
     50    -webkit-grid-definition-columns: -webkit-min-content -webkit-max-content;
     51    -webkit-grid-definition-rows: -webkit-max-content -webkit-min-content;
    5252}
    5353.gridWithMinMaxAndFixed {
    54     -webkit-grid-columns: minmax(45px, 30%) 15px;
    55     -webkit-grid-rows: 12em minmax(35%, 10px);
     54    -webkit-grid-definition-columns: minmax(45px, 30%) 15px;
     55    -webkit-grid-definition-rows: 12em minmax(35%, 10px);
    5656    font: 10px Ahem;
    5757}
    5858.gridWithMinMaxAndMinMaxContent {
    59     -webkit-grid-columns: minmax(-webkit-min-content, 30%) 15px;
    60     -webkit-grid-rows: 12em minmax(35%, -webkit-max-content);
     59    -webkit-grid-definition-columns: minmax(-webkit-min-content, 30%) 15px;
     60    -webkit-grid-definition-rows: 12em minmax(35%, -webkit-max-content);
    6161    font: 10px Ahem;
    6262}
  • trunk/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set.html

    r140480 r152479  
    99<style>
    1010.gridWithNone {
    11     -webkit-grid-columns: none;
    12     -webkit-grid-rows: none;
     11    -webkit-grid-definition-columns: none;
     12    -webkit-grid-definition-rows: none;
    1313}
    1414.gridWithFixed {
    15     -webkit-grid-columns: 10px;
    16     -webkit-grid-rows: 15px;
     15    -webkit-grid-definition-columns: 10px;
     16    -webkit-grid-definition-rows: 15px;
    1717}
    1818.gridWithPercent {
    19     -webkit-grid-columns: 53%;
    20     -webkit-grid-rows: 27%;
     19    -webkit-grid-definition-columns: 53%;
     20    -webkit-grid-definition-rows: 27%;
    2121}
    2222.gridWithAuto {
    23     -webkit-grid-columns: auto;
    24     -webkit-grid-rows: auto;
     23    -webkit-grid-definition-columns: auto;
     24    -webkit-grid-definition-rows: auto;
    2525}
    2626.gridWithEM {
    27     -webkit-grid-columns: 10em;
    28     -webkit-grid-rows: 15em;
     27    -webkit-grid-definition-columns: 10em;
     28    -webkit-grid-definition-rows: 15em;
    2929    font: 10px Ahem;
    3030}
    3131.gridWithViewPortPercentage {
    32     -webkit-grid-columns: 8vw;
    33     -webkit-grid-rows: 10vh;
     32    -webkit-grid-definition-columns: 8vw;
     33    -webkit-grid-definition-rows: 10vh;
    3434}
    3535.gridWithFitContent {
    36     -webkit-grid-columns: -webkit-fit-content;
    37     -webkit-grid-rows: -webkit-fit-content;
     36    -webkit-grid-definition-columns: -webkit-fit-content;
     37    -webkit-grid-definition-rows: -webkit-fit-content;
    3838}
    3939.gridWithFitAvailable {
    40     -webkit-grid-columns: -webkit-fit-available;
    41     -webkit-grid-rows: -webkit-fit-available;
     40    -webkit-grid-definition-columns: -webkit-fit-available;
     41    -webkit-grid-definition-rows: -webkit-fit-available;
    4242}
    4343.gridWithMinMax {
    44     -webkit-grid-columns: minmax(10%, 15px);
    45     -webkit-grid-rows: minmax(20px, 50%);
     44    -webkit-grid-definition-columns: minmax(10%, 15px);
     45    -webkit-grid-definition-rows: minmax(20px, 50%);
    4646}
    4747.gridWithMinContent {
    48     -webkit-grid-columns: -webkit-min-content;
    49     -webkit-grid-rows: -webkit-min-content;
     48    -webkit-grid-definition-columns: -webkit-min-content;
     49    -webkit-grid-definition-rows: -webkit-min-content;
    5050}
    5151.gridWithMaxContent {
    52     -webkit-grid-columns: -webkit-max-content;
    53     -webkit-grid-rows: -webkit-max-content;
     52    -webkit-grid-definition-columns: -webkit-max-content;
     53    -webkit-grid-definition-rows: -webkit-max-content;
    5454}
    5555</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-dynamic-updates-relayout.html

    r146117 r152479  
    1111{
    1212    var gridElement = document.getElementById(gridElementID);
    13     gridElement.style.webkitGridColumns = gridTracks.columns;
    14     gridElement.style.webkitGridRows = gridTracks.rows;
     13    gridElement.style.webkitGridDefinitionColumns = gridTracks.columns;
     14    gridElement.style.webkitGridDefinitionRows = gridTracks.rows;
    1515    var gridItem = gridElement.firstChild.nextSibling;
    1616    gridItem.setAttribute("data-expected-width", size.width);
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-border-grid-item.html

    r147140 r152479  
    1313    border-bottom: 40px dotted blue;
    1414    border-left: 50px dotted blue;
    15     -webkit-grid-rows: 100px 100px;
    16     -webkit-grid-columns: 100px 100px;
     15    -webkit-grid-definition-rows: 100px 100px;
     16    -webkit-grid-definition-columns: 100px 100px;
    1717    width: 200px;
    1818}
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-border-padding-grid-item.html

    r147140 r152479  
    1414    border-bottom: 30px dotted blue;
    1515    border-left: 40px dotted blue;
    16     -webkit-grid-rows: 100px 100px;
    17     -webkit-grid-columns: 100px 100px;
     16    -webkit-grid-definition-rows: 100px 100px;
     17    -webkit-grid-definition-columns: 100px 100px;
    1818    width: 200px;
    1919}
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-change-columns-repaint-expected.txt

    r149608 r152479  
    1 This test checks that changing the grid-columns lead to a repaint. The final grid element should be 250px * 50px, the grid item should be 50px * 50px. No trace of the elements before the grid-columns change should be seen.
     1This test checks that changing the grid-definition-columns lead to a repaint. The final grid element should be 250px * 50px, the grid item should be 50px * 50px. No trace of the elements before the grid-defintion-columns change should be seen.
    22(repaint rects
    3   (rect 8 38 100 50)
    4   (rect 8 38 50 50)
    5   (rect 8 38 250 50)
     3  (rect 8 48 100 50)
     4  (rect 8 48 50 50)
     5  (rect 8 48 250 50)
    66)
    77
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-change-columns-repaint.html

    r146371 r152479  
    99{
    1010    var gridElement = document.getElementsByClassName("grid")[0];
    11     gridElement.style.webkitGridColumns = "minmax(50px, 180px) 100px 100px";
     11    gridElement.style.webkitGridDefinitionColumns = "minmax(50px, 180px) 100px 100px";
    1212}
    1313window.addEventListener("load", runRepaintTest, false);
     
    2121.grid {
    2222    width: -webkit-fit-content;
    23     -webkit-grid-rows: 50px;
    24     -webkit-grid-columns: minmax(100px, 180px) 100px minmax(50px, 100px);
     23    -webkit-grid-definition-rows: 50px;
     24    -webkit-grid-definition-columns: minmax(100px, 180px) 100px minmax(50px, 100px);
    2525}
    2626.sizedToGridArea {
     
    2929</style>
    3030<body>
    31 <div> This test checks that changing the grid-columns lead to a repaint. The final grid element should be 250px * 50px, the grid item should be 50px * 50px. No trace of the elements before the grid-columns change should be seen.</div>
     31<div> This test checks that changing the grid-definition-columns lead to a repaint. The final grid element should be 250px * 50px, the grid item should be 50px * 50px. No trace of the elements before the grid-defintion-columns change should be seen.</div>
    3232<div class="constrainedContainer">
    3333    <div class="grid">
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-change-rows-repaint-expected.txt

    r149608 r152479  
    1 This test checks that changing the grid-rows lead to a repaint. The final grid element should be 100px * 150px, the grid item should be 100px * 100px. No trace of the elements before the grid-rows change should be seen.
     1This test checks that changing the grid-definition-rows lead to a repaint. The final grid element should be 100px * 150px, the grid item should be 100px * 100px. No trace of the elements before the grid-definition-rows change should be seen.
    22(repaint rects
    3   (rect 8 38 100 50)
    4   (rect 8 38 100 100)
    5   (rect 8 38 100 150)
     3  (rect 8 48 100 50)
     4  (rect 8 48 100 100)
     5  (rect 8 48 100 150)
    66)
    77
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-change-rows-repaint.html

    r146371 r152479  
    99{
    1010    var gridElement = document.getElementsByClassName("grid")[0];
    11     gridElement.style.webkitGridRows = "100px 50px";
     11    gridElement.style.webkitGridDefinitionRows = "100px 50px";
    1212}
    1313window.addEventListener("load", runRepaintTest, false);
     
    2121.grid {
    2222    width: -webkit-fit-content;
    23     -webkit-grid-rows: 50px 100px;
    24     -webkit-grid-columns: 100px;
     23    -webkit-grid-definition-rows: 50px 100px;
     24    -webkit-grid-definition-columns: 100px;
    2525}
    2626.sizedToGridArea {
     
    2929</style>
    3030<body>
    31 <div>This test checks that changing the grid-rows lead to a repaint. The final grid element should be 100px * 150px, the grid item should be 100px * 100px. No trace of the elements before the grid-rows change should be seen.</div>
     31<div>This test checks that changing the grid-definition-rows lead to a repaint. The final grid element should be 100px * 150px, the grid item should be 100px * 100px. No trace of the elements before the grid-definition-rows change should be seen.</div>
    3232<div class="constrainedContainer">
    3333    <div class="grid">
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-empty-row-column.html

    r143331 r152479  
    77<style>
    88.gridNoRow {
    9     -webkit-grid-columns: 50px;
     9    -webkit-grid-definition-columns: 50px;
    1010    /* Make the grid shrink-to-fit. */
    1111    position: absolute;
    1212}
    1313.gridNoColumn {
    14     -webkit-grid-rows: 50px 80px;
     14    -webkit-grid-definition-rows: 50px 80px;
    1515    /* Make the grid shrink-to-fit. */
    1616    position: absolute;
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-min-max-width.html

    r145758 r152479  
    1010.minWidthGrid {
    1111    min-width: 100px;
    12     -webkit-grid-columns: 50px;
    13     -webkit-grid-rows: 40px;
     12    -webkit-grid-definition-columns: 50px;
     13    -webkit-grid-definition-rows: 40px;
    1414}
    1515.maxWidthGrid {
    1616    max-width: 100px;
    17     -webkit-grid-columns: 150px 50px;
    18     -webkit-grid-rows: 40px;
     17    -webkit-grid-definition-columns: 150px 50px;
     18    -webkit-grid-definition-rows: 40px;
    1919}
    2020
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-padding-grid-item.html

    r147140 r152479  
    1010.grid {
    1111    padding: 20px 30px 40px 50px;
    12     -webkit-grid-rows: 100px 100px;
    13     -webkit-grid-columns: 100px 100px;
     12    -webkit-grid-definition-rows: 100px 100px;
     13    -webkit-grid-definition-columns: 100px 100px;
    1414    width: 200px;
    1515}
  • trunk/LayoutTests/fast/css-grid-layout/grid-element-padding-margin.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 100px;
    11     -webkit-grid-rows: 50px;
     10    -webkit-grid-definition-columns: 100px;
     11    -webkit-grid-definition-rows: 50px;
    1212    /* Force the grid element to be shrink-to-fit. */
    1313    position: absolute;
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-addition-auto-placement-update.html

    r143535 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 50px 100px;
    11     -webkit-grid-rows: 50px 100px;
     10    -webkit-grid-definition-columns: 50px 100px;
     11    -webkit-grid-definition-rows: 50px 100px;
    1212}
    1313</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-addition-track-breadth-update.html

    r142798 r152479  
    88<style>
    99.gridFixedContent {
    10     -webkit-grid-columns: 50px minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 50px) minmax(50px, -webkit-min-content);
    11     -webkit-grid-rows: 70px minmax(-webkit-max-content, 70px) minmax(50px, -webkit-min-content) minmax(65px, -webkit-max-content);
     10    -webkit-grid-definition-columns: 50px minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 50px) minmax(50px, -webkit-min-content);
     11    -webkit-grid-definition-rows: 70px minmax(-webkit-max-content, 70px) minmax(50px, -webkit-min-content) minmax(65px, -webkit-max-content);
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-change-column-repaint.html

    r146371 r152479  
    2121.grid {
    2222    width: -webkit-fit-content;
    23     -webkit-grid-rows: 50px;
    24     -webkit-grid-columns: minmax(100px, 180px) 100px minmax(50px, 100px);
     23    -webkit-grid-definition-rows: 50px;
     24    -webkit-grid-definition-columns: minmax(100px, 180px) 100px minmax(50px, 100px);
    2525}
    2626.sizedToGridArea {
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-change-row-repaint.html

    r146371 r152479  
    2020
    2121.grid {
    22     -webkit-grid-rows: 50px 100px;
    23     -webkit-grid-columns: 100px 50px;
     22    -webkit-grid-definition-rows: 50px 100px;
     23    -webkit-grid-definition-columns: 100px 50px;
    2424    /* Make the grid shrink to fit. */
    2525    position: absolute;
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-multiple-minmax-content-resolution.html

    r146697 r152479  
    88<style>
    99.gridMinMaxAutoWithColumnMinMaxAuto {
    10     -webkit-grid-columns: minmax(50px, 180px) auto;
    11     -webkit-grid-rows: auto minmax(50px, 100px);
     10    -webkit-grid-definition-columns: minmax(50px, 180px) auto;
     11    -webkit-grid-definition-rows: auto minmax(50px, 100px);
    1212}
    1313</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html

    r143535 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 50px 100px;
    11     -webkit-grid-rows: 50px 100px;
     10    -webkit-grid-definition-columns: 50px 100px;
     11    -webkit-grid-definition-rows: 50px 100px;
    1212}
    1313</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-track-breadth-update.html

    r142798 r152479  
    88<style>
    99.gridAutoContent {
    10     -webkit-grid-columns: auto;
    11     -webkit-grid-rows: auto;
     10    -webkit-grid-definition-columns: auto;
     11    -webkit-grid-definition-rows: auto;
    1212}
    1313
    1414.gridMinContentFixed {
    15     -webkit-grid-columns: minmax(-webkit-min-content, 100px);
    16     -webkit-grid-rows: minmax(-webkit-min-content, 40px);
     15    -webkit-grid-definition-columns: minmax(-webkit-min-content, 100px);
     16    -webkit-grid-definition-rows: minmax(-webkit-min-content, 40px);
    1717}
    1818
    1919.gridMaxContentFixed {
    20     -webkit-grid-columns: minmax(-webkit-max-content, 150px);
    21     -webkit-grid-rows: minmax(-webkit-max-content, 40px);
     20    -webkit-grid-definition-columns: minmax(-webkit-max-content, 150px);
     21    -webkit-grid-definition-rows: minmax(-webkit-max-content, 40px);
    2222}
    2323
    2424.gridFixedMinContent {
    25     -webkit-grid-columns: minmax(100px, -webkit-min-content);
    26     -webkit-grid-rows: minmax(40px, -webkit-min-content);
     25    -webkit-grid-definition-columns: minmax(100px, -webkit-min-content);
     26    -webkit-grid-definition-rows: minmax(40px, -webkit-min-content);
    2727}
    2828
    2929.gridFixedMaxContent {
    30     -webkit-grid-columns: minmax(100px, -webkit-max-content);
    31     -webkit-grid-rows: minmax(40px, -webkit-max-content);
     30    -webkit-grid-definition-columns: minmax(100px, -webkit-max-content);
     31    -webkit-grid-definition-rows: minmax(40px, -webkit-max-content);
    3232}
    3333
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html

    r146482 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 40% 60%;
    11     -webkit-grid-rows: 30% 70%;
     10    -webkit-grid-definition-columns: 40% 60%;
     11    -webkit-grid-definition-rows: 30% 70%;
    1212    width: 400px;
    1313    height: 300px;
  • trunk/LayoutTests/fast/css-grid-layout/grid-item-with-percent-height-in-auto-height-grid-resolution.html

    r146697 r152479  
    88<style>
    99.gridMinMaxMinMax {
    10     -webkit-grid-columns: 50px 100px;
    11     -webkit-grid-rows: minmax(10px, -webkit-min-content) minmax(50px, 100px);
     10    -webkit-grid-definition-columns: 50px 100px;
     11    -webkit-grid-definition-rows: minmax(10px, -webkit-min-content) minmax(50px, 100px);
    1212}
    1313
    1414.gridAutoAuto {
    15     -webkit-grid-columns: 50px 100px;
    16     -webkit-grid-rows: auto auto;
     15    -webkit-grid-definition-columns: 50px 100px;
     16    -webkit-grid-definition-rows: auto auto;
    1717}
    1818</style>
  • trunk/LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html

    r141616 r152479  
    1010<style>
    1111.gridMinContentFixed {
    12     -webkit-grid-columns: minmax(-webkit-min-content, 40px) minmax(-webkit-min-content, 40px);
    13     -webkit-grid-rows: 10px;
     12    -webkit-grid-definition-columns: minmax(-webkit-min-content, 40px) minmax(-webkit-min-content, 40px);
     13    -webkit-grid-definition-rows: 10px;
    1414    font: 10px/1 Ahem;
    1515}
    1616
    1717.gridFixedMinContent {
    18     -webkit-grid-columns: minmax(30px, -webkit-min-content) minmax(30px, -webkit-min-content);
    19     -webkit-grid-rows: 10px;
     18    -webkit-grid-definition-columns: minmax(30px, -webkit-min-content) minmax(30px, -webkit-min-content);
     19    -webkit-grid-definition-rows: 10px;
    2020    font: 10px/1 Ahem;
    2121}
    2222
    2323.gridFixedMaxContent {
    24     -webkit-grid-columns: minmax(40px, -webkit-max-content) minmax(40px, -webkit-max-content);
    25     -webkit-grid-rows: 10px;
     24    -webkit-grid-definition-columns: minmax(40px, -webkit-max-content) minmax(40px, -webkit-max-content);
     25    -webkit-grid-definition-rows: 10px;
    2626    font: 10px/1 Ahem;
    2727}
    2828
    2929.gridFixedFixed {
    30     -webkit-grid-columns: minmax(30px, 40px) minmax(30px, 40px);
    31     -webkit-grid-rows: 10px;
     30    -webkit-grid-definition-columns: minmax(30px, 40px) minmax(30px, 40px);
     31    -webkit-grid-definition-rows: 10px;
    3232}
    3333
    3434.gridAutoContent {
    35     -webkit-grid-columns: auto auto;
    36     -webkit-grid-rows: 10px;
     35    -webkit-grid-definition-columns: auto auto;
     36    -webkit-grid-definition-rows: 10px;
    3737    font: 10px/1 Ahem;
    3838}
  • trunk/LayoutTests/fast/css-grid-layout/implicit-columns-auto-resolution.html

    r142798 r152479  
    88<style>
    99.gridAutoContent {
    10     /* -webkit-grid-columns is left unset so that the grid item's column is implicit. */
    11     -webkit-grid-rows: 50px;
     10    /* -webkit-grid-definition-columns is left unset so that the grid item's column is implicit. */
     11    -webkit-grid-definition-rows: 50px;
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/implicit-position-dynamic-change.html

    r143397 r152479  
    88<style>
    99.gridFixedContent {
    10     -webkit-grid-columns: 50px minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 50px) minmax(50px, -webkit-min-content);
    11     -webkit-grid-rows: 70px minmax(-webkit-max-content, 70px) minmax(50px, -webkit-min-content) minmax(65px, -webkit-max-content);
     10    -webkit-grid-definition-columns: 50px minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 50px) minmax(50px, -webkit-min-content);
     11    -webkit-grid-definition-rows: 70px minmax(-webkit-max-content, 70px) minmax(50px, -webkit-min-content) minmax(65px, -webkit-max-content);
    1212}
    1313</style>
  • trunk/LayoutTests/fast/css-grid-layout/implicit-rows-auto-resolution.html

    r142798 r152479  
    88<style>
    99.gridAutoContent {
    10     -webkit-grid-columns: 50px;
    11     /* -webkit-grid-rows is left unset so that the grid item's row is implicit. */
     10    -webkit-grid-definition-columns: 50px;
     11    /* -webkit-grid-definition-rows is left unset so that the grid item's row is implicit. */
    1212}
    1313
  • trunk/LayoutTests/fast/css-grid-layout/minmax-fixed-logical-height-only.html

    r140480 r152479  
    1313
    1414#grid1 {
    15     -webkit-grid-columns: 30px;
    16     -webkit-grid-rows: minmax(20px, 80px) 160px;
     15    -webkit-grid-definition-columns: 30px;
     16    -webkit-grid-definition-rows: minmax(20px, 80px) 160px;
    1717}
    1818
    1919#grid2 {
    20     -webkit-grid-columns: 30px;
    21     -webkit-grid-rows: minmax(50%, 120px) minmax(20px, 40%);
     20    -webkit-grid-definition-columns: 30px;
     21    -webkit-grid-definition-rows: minmax(50%, 120px) minmax(20px, 40%);
    2222}
    2323
    2424#grid3 {
    25     -webkit-grid-columns: 30px;
     25    -webkit-grid-definition-columns: 30px;
    2626    /* Overlapping range. */
    27     -webkit-grid-rows: minmax(10px, 180px) minmax(30px, 150px);
     27    -webkit-grid-definition-rows: minmax(10px, 180px) minmax(30px, 150px);
    2828}
    2929
    3030#grid4 {
    31     -webkit-grid-columns: 30px;
    32     -webkit-grid-rows: minmax(20px, 80px) 60px;
     31    -webkit-grid-definition-columns: 30px;
     32    -webkit-grid-definition-rows: minmax(20px, 80px) 60px;
    3333    -webkit-writing-mode: vertical-rl;
    3434}
    3535
    3636#grid5 {
    37     -webkit-grid-columns: 30px;
     37    -webkit-grid-definition-columns: 30px;
    3838    /* 90% > 80px, 80px should be ignored. */
    39     -webkit-grid-rows: minmax(90%, 80px) minmax(10px, 60%);
     39    -webkit-grid-definition-rows: minmax(90%, 80px) minmax(10px, 60%);
    4040    -webkit-writing-mode: vertical-lr;
    4141}
     
    4343#grid6 {
    4444    /* Overlapping range. */
    45     -webkit-grid-columns: 30px;
    46     -webkit-grid-rows: minmax(10px, 180px) minmax(30px, 150px);
     45    -webkit-grid-definition-columns: 30px;
     46    -webkit-grid-definition-rows: minmax(10px, 180px) minmax(30px, 150px);
    4747    -webkit-writing-mode: horizontal-bt;
    4848}
  • trunk/LayoutTests/fast/css-grid-layout/minmax-fixed-logical-width-only.html

    r140480 r152479  
    1313
    1414#grid1 {
    15     -webkit-grid-columns: minmax(20px, 80px) 60px;
    16     -webkit-grid-rows: 30px;
     15    -webkit-grid-definition-columns: minmax(20px, 80px) 60px;
     16    -webkit-grid-definition-rows: 30px;
    1717}
    1818
    1919#grid2 {
    2020    /* First minmax more constraining than available logical width. */
    21     -webkit-grid-columns: minmax(50%, 60px) minmax(10px, 40%);
    22     -webkit-grid-rows: 30px;
     21    -webkit-grid-definition-columns: minmax(50%, 60px) minmax(10px, 40%);
     22    -webkit-grid-definition-rows: 30px;
    2323}
    2424
    2525#grid3 {
    2626    /* Overlapping range. */
    27     -webkit-grid-columns: minmax(10px, 80px) minmax(20px, 50px);
    28     -webkit-grid-rows: 30px;
     27    -webkit-grid-definition-columns: minmax(10px, 80px) minmax(20px, 50px);
     28    -webkit-grid-definition-rows: 30px;
    2929}
    3030
    3131#grid4 {
    32     -webkit-grid-columns: minmax(20px, 80px) 160px;
    33     -webkit-grid-rows: 30px;
     32    -webkit-grid-definition-columns: minmax(20px, 80px) 160px;
     33    -webkit-grid-definition-rows: 30px;
    3434    -webkit-writing-mode: vertical-rl;
    3535}
     
    3737#grid5 {
    3838    /* 50% > 80px, 80px should be ignored. */
    39     -webkit-grid-columns: minmax(50%, 80px) minmax(10px, 60%);
    40     -webkit-grid-rows: 30px;
     39    -webkit-grid-definition-columns: minmax(50%, 80px) minmax(10px, 60%);
     40    -webkit-grid-definition-rows: 30px;
    4141    -webkit-writing-mode: vertical-lr;
    4242}
     
    4444#grid6 {
    4545    /* Overlapping range. */
    46     -webkit-grid-columns: minmax(10px, 180px) minmax(30px, 150px);
    47     -webkit-grid-rows: 30px;
     46    -webkit-grid-definition-columns: minmax(10px, 180px) minmax(30px, 150px);
     47    -webkit-grid-definition-rows: 30px;
    4848    -webkit-writing-mode: horizontal-bt;
    4949}
  • trunk/LayoutTests/fast/css-grid-layout/minmax-max-content-resolution-columns.html

    r142798 r152479  
    88<style>
    99.gridMinMaxContent {
    10     -webkit-grid-columns: minmax(-webkit-max-content, 50px);
    11     -webkit-grid-rows: 60px;
     10    -webkit-grid-definition-columns: minmax(-webkit-max-content, 50px);
     11    -webkit-grid-definition-rows: 60px;
    1212}
    1313
    1414.gridMaxMaxContent {
    15     -webkit-grid-columns: minmax(30px, -webkit-max-content);
    16     -webkit-grid-rows: 20px;
     15    -webkit-grid-definition-columns: minmax(30px, -webkit-max-content);
     16    -webkit-grid-definition-rows: 20px;
    1717}
    1818
  • trunk/LayoutTests/fast/css-grid-layout/minmax-max-content-resolution-rows.html

    r142798 r152479  
    88<style>
    99.gridMinMaxContent {
    10     -webkit-grid-columns: 20px;
    11     -webkit-grid-rows: minmax(-webkit-max-content, 50px);
     10    -webkit-grid-definition-columns: 20px;
     11    -webkit-grid-definition-rows: minmax(-webkit-max-content, 50px);
    1212}
    1313
    1414.gridMaxMaxContent {
    15     -webkit-grid-columns: 20px;
    16     -webkit-grid-rows: minmax(30px, -webkit-max-content);
     15    -webkit-grid-definition-columns: 20px;
     16    -webkit-grid-definition-rows: minmax(30px, -webkit-max-content);
    1717}
    1818
  • trunk/LayoutTests/fast/css-grid-layout/minmax-min-content-column-resolution-columns.html

    r142798 r152479  
    88<style>
    99.gridMinMinContent {
    10     -webkit-grid-columns: minmax(-webkit-min-content, 40px);
    11     -webkit-grid-rows: 50px;
     10    -webkit-grid-definition-columns: minmax(-webkit-min-content, 40px);
     11    -webkit-grid-definition-rows: 50px;
    1212}
    1313
    1414.gridMaxMinContent {
    15     -webkit-grid-columns: minmax(30px, -webkit-min-content);
    16     -webkit-grid-rows: 20px;
     15    -webkit-grid-definition-columns: minmax(30px, -webkit-min-content);
     16    -webkit-grid-definition-rows: 20px;
    1717}
    1818
  • trunk/LayoutTests/fast/css-grid-layout/minmax-min-content-column-resolution-rows.html

    r142798 r152479  
    88<style>
    99.gridMinMinContent {
    10     -webkit-grid-columns: 30px;
    11     -webkit-grid-rows: minmax(-webkit-min-content, 40px);
     10    -webkit-grid-definition-columns: 30px;
     11    -webkit-grid-definition-rows: minmax(-webkit-min-content, 40px);
    1212}
    1313
    1414.gridMaxMinContent {
    15     -webkit-grid-columns: 30px;
    16     -webkit-grid-rows: minmax(30px, -webkit-min-content);
     15    -webkit-grid-definition-columns: 30px;
     16    -webkit-grid-definition-rows: minmax(30px, -webkit-min-content);
    1717}
    1818
  • trunk/LayoutTests/fast/css-grid-layout/minmax-spanning-resolution-columns.html

    r146482 r152479  
    88<style>
    99.gridAutoAutoContent {
    10     -webkit-grid-columns: auto auto;
    11     -webkit-grid-rows: 50px 100px;
     10    -webkit-grid-definition-columns: auto auto;
     11    -webkit-grid-definition-rows: 50px 100px;
    1212}
    1313
    1414.gridFixedAutoContent {
    15     -webkit-grid-columns: 10px auto;
    16     -webkit-grid-rows: 50px 100px;
     15    -webkit-grid-definition-columns: 10px auto;
     16    -webkit-grid-definition-rows: 50px 100px;
    1717}
    1818
    1919.gridMinMaxMin {
    20     -webkit-grid-columns: minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 140px);
    21     -webkit-grid-rows: 50px 100px;
     20    -webkit-grid-definition-columns: minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 140px);
     21    -webkit-grid-definition-rows: 50px 100px;
    2222}
    2323
    2424.gridMinMaxMax {
    25     -webkit-grid-columns: minmax(50px, -webkit-min-content) minmax(40px, -webkit-max-content);
    26     -webkit-grid-rows: 50px 100px;
     25    -webkit-grid-definition-columns: minmax(50px, -webkit-min-content) minmax(40px, -webkit-max-content);
     26    -webkit-grid-definition-rows: 50px 100px;
    2727}
    2828
  • trunk/LayoutTests/fast/css-grid-layout/minmax-spanning-resolution-rows.html

    r146482 r152479  
    88<style>
    99.gridAutoAutoContent {
    10     -webkit-grid-columns: 50px 100px;
    11     -webkit-grid-rows: auto auto;
     10    -webkit-grid-definition-columns: 50px 100px;
     11    -webkit-grid-definition-rows: auto auto;
    1212}
    1313
    1414.gridFixedAutoContent {
    15     -webkit-grid-columns: 50px 100px;
    16     -webkit-grid-rows: 10px auto;
     15    -webkit-grid-definition-columns: 50px 100px;
     16    -webkit-grid-definition-rows: 10px auto;
    1717}
    1818
    1919.gridMinMaxMin {
    20     -webkit-grid-columns: 50px 100px;
    21     -webkit-grid-rows: minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 140px);
     20    -webkit-grid-definition-columns: 50px 100px;
     21    -webkit-grid-definition-rows: minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 140px);
    2222}
    2323
    2424.gridMinMaxMax {
    25     -webkit-grid-columns: 50px 100px;
    26     -webkit-grid-rows: minmax(50px, -webkit-min-content) minmax(40px, -webkit-max-content);
     25    -webkit-grid-definition-columns: 50px 100px;
     26    -webkit-grid-definition-rows: minmax(50px, -webkit-min-content) minmax(40px, -webkit-max-content);
    2727}
    2828</style>
  • trunk/LayoutTests/fast/css-grid-layout/percent-grid-item-in-percent-grid-track-in-percent-grid.html

    r140480 r152479  
    1414
    1515.grid {
    16     -webkit-grid-columns: 40% 60%;
    17     -webkit-grid-rows: 30% 70%;
     16    -webkit-grid-definition-columns: 40% 60%;
     17    -webkit-grid-definition-rows: 30% 70%;
    1818    width: 80%;
    1919    height: 50%;
  • trunk/LayoutTests/fast/css-grid-layout/percent-grid-item-in-percent-grid-track-update.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 70% 30%;
    11     -webkit-grid-rows: 40% 60%;
     10    -webkit-grid-definition-columns: 70% 30%;
     11    -webkit-grid-definition-rows: 40% 60%;
    1212    width: 400px;
    1313    height: 300px;
     
    4242    var grid2 = document.getElementsByClassName("grid")[2];
    4343    document.body.offsetLeft;
    44     grid0.style.webkitGridColumns = "40% 60%";
     44    grid0.style.webkitGridDefinitionColumns = "40% 60%";
    4545
    46     grid1.style.webkitGridRows = "30% 70%";
     46    grid1.style.webkitGridDefinitionRows = "30% 70%";
    4747
    48     grid2.style.webkitGridColumns = "40% 60%";
    49     grid2.style.webkitGridRows = "30% 70%";
     48    grid2.style.webkitGridDefinitionColumns = "40% 60%";
     49    grid2.style.webkitGridDefinitionRows = "30% 70%";
    5050
    5151    checkLayout('.grid');
  • trunk/LayoutTests/fast/css-grid-layout/percent-grid-item-in-percent-grid-track.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 40% 60%;
    11     -webkit-grid-rows: 30% 70%;
     10    -webkit-grid-definition-columns: 40% 60%;
     11    -webkit-grid-definition-rows: 30% 70%;
    1212    width: 400px;
    1313    height: 300px;
  • trunk/LayoutTests/fast/css-grid-layout/percent-padding-margin-resolution-grid-item-update.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 200px 200px;
    11     -webkit-grid-rows: 100px 100px;
     10    -webkit-grid-definition-columns: 200px 200px;
     11    -webkit-grid-definition-rows: 100px 100px;
    1212    height: 200px;
    1313    width: 400px;
     
    3939    var grid = document.getElementsByClassName("grid")[0];
    4040    grid.offsetLeft;
    41     grid.style.webkitGridColumns = "100px 300px";
    42     grid.style.webkitGridRows = "50px 150px";
     41    grid.style.webkitGridDefinitionColumns = "100px 300px";
     42    grid.style.webkitGridDefinitionRows = "50px 150px";
    4343    checkLayout('.grid');
    4444}
  • trunk/LayoutTests/fast/css-grid-layout/percent-padding-margin-resolution-grid-item.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 100px 300px;
    11     -webkit-grid-rows: 50px 150px;
     10    -webkit-grid-definition-columns: 100px 300px;
     11    -webkit-grid-definition-rows: 50px 150px;
    1212    height: 200px;
    1313    width: 400px;
  • trunk/LayoutTests/fast/css-grid-layout/percent-resolution-grid-item.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 100px 300px;
    11     -webkit-grid-rows: 50px 150px;
     10    -webkit-grid-definition-columns: 100px 300px;
     11    -webkit-grid-definition-rows: 50px 150px;
    1212    height: 200px;
    1313    width: 400px;
  • trunk/LayoutTests/fast/css-grid-layout/place-cell-by-index.html

    r140480 r152479  
    88<style>
    99.grid {
    10     -webkit-grid-columns: 50px 60px;
    11     -webkit-grid-rows: 20px 30px;
     10    -webkit-grid-definition-columns: 50px 60px;
     11    -webkit-grid-definition-rows: 20px 30px;
    1212    max-width: 110px;
    1313}
  • trunk/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js

    r137478 r152479  
    1 description('Test that setting and getting grid-columns and grid-rows works as expected');
     1description('Test that setting and getting grid-definition-columns and grid-definition-rows works as expected');
    22
    33debug("Test getting |display| set through CSS");
    44var gridWithFixedElement = document.getElementById("gridWithFixedElement");
    5 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-columns')", "'7px 11px'");
    6 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-rows')", "'17px 2px'");
     5shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'7px 11px'");
     6shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'17px 2px'");
    77
    88var gridWithPercentElement = document.getElementById("gridWithPercentElement");
    9 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-columns')", "'53% 99%'");
    10 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-rows')", "'27% 52%'");
     9shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'53% 99%'");
     10shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'27% 52%'");
    1111
    1212var gridWithAutoElement = document.getElementById("gridWithAutoElement");
    13 shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-columns')", "'auto auto'");
    14 shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows')", "'auto auto'");
     13shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'auto auto'");
     14shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'auto auto'");
    1515
    1616var gridWithEMElement = document.getElementById("gridWithEMElement");
    17 shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns')", "'100px 120px'");
    18 shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows')", "'150px 170px'");
     17shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'100px 120px'");
     18shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'150px 170px'");
    1919
    2020var gridWithThreeItems = document.getElementById("gridWithThreeItems");
    21 shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns')", "'15px auto 100px'");
    22 shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows')", "'120px 18px auto'");
     21shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-definition-columns')", "'15px auto 100px'");
     22shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-definition-rows')", "'120px 18px auto'");
    2323
    2424var gridWithPercentAndViewportPercent = document.getElementById("gridWithPercentAndViewportPercent");
    25 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-columns')", "'50% 120px'");
    26 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-rows')", "'35% 168px'");
     25shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-definition-columns')", "'50% 120px'");
     26shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('-webkit-grid-definition-rows')", "'35% 168px'");
    2727
    2828var gridWithFitContentAndFitAvailable = document.getElementById("gridWithFitContentAndFitAvailable");
    29 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    30 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     29shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     30shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    3131
    3232var gridWithMinMaxContent = document.getElementById("gridWithMinMaxContent");
    33 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-columns')", "'-webkit-min-content -webkit-max-content'");
    34 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-rows')", "'-webkit-max-content -webkit-min-content'");
     33shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-definition-columns')", "'-webkit-min-content -webkit-max-content'");
     34shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('-webkit-grid-definition-rows')", "'-webkit-max-content -webkit-min-content'");
    3535
    3636var gridWithMinMaxAndFixed = document.getElementById("gridWithMinMaxAndFixed");
    37 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-columns')", "'minmax(45px, 30%) 15px'");
    38 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-rows')", "'120px minmax(35%, 10px)'");
     37shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(45px, 30%) 15px'");
     38shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-definition-rows')", "'120px minmax(35%, 10px)'");
    3939
    4040var gridWithMinMaxAndMinMaxContent = document.getElementById("gridWithMinMaxAndMinMaxContent");
    41 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-columns')", "'minmax(-webkit-min-content, 30%) 15px'");
    42 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-rows')", "'120px minmax(35%, -webkit-max-content)'");
     41shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(-webkit-min-content, 30%) 15px'");
     42shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('-webkit-grid-definition-rows')", "'120px minmax(35%, -webkit-max-content)'");
    4343
    4444debug("");
     
    4646var element = document.createElement("div");
    4747document.body.appendChild(element);
    48 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    49 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     48shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     49shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    5050
    5151debug("");
    5252debug("Test getting and setting display through JS");
    53 element.style.webkitGridColumns = "18px 22px";
    54 element.style.webkitGridRows = "66px 70px";
    55 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'18px 22px'");
    56 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'66px 70px'");
     53element.style.webkitGridDefinitionColumns = "18px 22px";
     54element.style.webkitGridDefinitionRows = "66px 70px";
     55shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'18px 22px'");
     56shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'66px 70px'");
    5757
    5858element = document.createElement("div");
    5959document.body.appendChild(element);
    60 element.style.webkitGridColumns = "55% 80%";
    61 element.style.webkitGridRows = "40% 63%";
    62 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'55% 80%'");
    63 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'40% 63%'");
     60element.style.webkitGridDefinitionColumns = "55% 80%";
     61element.style.webkitGridDefinitionRows = "40% 63%";
     62shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'55% 80%'");
     63shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'40% 63%'");
    6464
    6565element = document.createElement("div");
    6666document.body.appendChild(element);
    67 element.style.webkitGridColumns = "auto auto";
    68 element.style.webkitGridRows = "auto auto";
    69 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto auto'");
    70 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'auto auto'");
     67element.style.webkitGridDefinitionColumns = "auto auto";
     68element.style.webkitGridDefinitionRows = "auto auto";
     69shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'auto auto'");
     70shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'auto auto'");
    7171
    7272element = document.createElement("div");
    7373document.body.appendChild(element);
    7474element.style.font = "10px Ahem";
    75 element.style.webkitGridColumns = "auto 16em 22px";
    76 element.style.webkitGridRows = "56% 10em auto";
    77 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto 160px 22px'");
    78 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'56% 100px auto'");
     75element.style.webkitGridDefinitionColumns = "auto 16em 22px";
     76element.style.webkitGridDefinitionRows = "56% 10em auto";
     77shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'auto 160px 22px'");
     78shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'56% 100px auto'");
    7979
    8080element = document.createElement("div");
    8181document.body.appendChild(element);
    8282element.style.font = "10px Ahem";
    83 element.style.webkitGridColumns = "16em minmax(16px, 20px)";
    84 element.style.webkitGridRows = "minmax(10%, 15%) auto";
    85 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'160px minmax(16px, 20px)'");
    86 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(10%, 15%) auto'");
     83element.style.webkitGridDefinitionColumns = "16em minmax(16px, 20px)";
     84element.style.webkitGridDefinitionRows = "minmax(10%, 15%) auto";
     85shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'160px minmax(16px, 20px)'");
     86shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(10%, 15%) auto'");
    8787
    8888debug("");
    8989debug("Test getting wrong values set from CSS");
    9090var gridWithNoneAndAuto = document.getElementById("gridWithNoneAndAuto");
    91 shouldBe("getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    92 shouldBe("getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     91shouldBe("getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     92shouldBe("getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    9393
    9494var gridWithNoneAndFixed = document.getElementById("gridWithNoneAndFixed");
    95 shouldBe("getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    96 shouldBe("getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     95shouldBe("getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     96shouldBe("getComputedStyle(gridWithNoneAndFixed, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    9797
    9898debug("");
     
    100100element = document.createElement("div");
    101101document.body.appendChild(element);
    102 element.style.webkitGridColumns = "none auto";
    103 element.style.webkitGridRows = "none auto";
    104 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    105 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     102element.style.webkitGridDefinitionColumns = "none auto";
     103element.style.webkitGridDefinitionRows = "none auto";
     104shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     105shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    106106
    107107element = document.createElement("div");
    108108document.body.appendChild(element);
    109 element.style.webkitGridColumns = "none 16em";
    110 element.style.webkitGridRows = "none 56%";
    111 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    112 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     109element.style.webkitGridDefinitionColumns = "none 16em";
     110element.style.webkitGridDefinitionRows = "none 56%";
     111shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     112shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    113113
    114114element = document.createElement("div");
    115115document.body.appendChild(element);
    116 element.style.webkitGridColumns = "none none";
    117 element.style.webkitGridRows = "none none";
    118 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    119 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     116element.style.webkitGridDefinitionColumns = "none none";
     117element.style.webkitGridDefinitionRows = "none none";
     118shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     119shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    120120
    121121element = document.createElement("div");
    122122document.body.appendChild(element);
    123 element.style.webkitGridColumns = "auto none";
    124 element.style.webkitGridRows = "auto none";
    125 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    126 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     123element.style.webkitGridDefinitionColumns = "auto none";
     124element.style.webkitGridDefinitionRows = "auto none";
     125shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     126shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    127127
    128128element = document.createElement("div");
    129129document.body.appendChild(element);
    130 element.style.webkitGridColumns = "auto none 16em";
    131 element.style.webkitGridRows = "auto 18em none";
    132 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    133 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     130element.style.webkitGridDefinitionColumns = "auto none 16em";
     131element.style.webkitGridDefinitionRows = "auto 18em none";
     132shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     133shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    134134
    135135element = document.createElement("div");
    136136document.body.appendChild(element);
    137 element.style.webkitGridColumns = "50% 12vw";
    138 element.style.webkitGridRows = "5% 85vh";
    139 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'50% 96px'");
    140 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'5% 510px'");
     137element.style.webkitGridDefinitionColumns = "50% 12vw";
     138element.style.webkitGridDefinitionRows = "5% 85vh";
     139shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'50% 96px'");
     140shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'5% 510px'");
    141141
    142142element = document.createElement("div");
    143143document.body.appendChild(element);
    144 element.style.webkitGridColumns = "-webkit-fit-content -webkit-fit-content";
    145 element.style.webkitGridRows = "-webkit-fit-available -webkit-fit-available";
    146 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    147 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     144element.style.webkitGridDefinitionColumns = "-webkit-fit-content -webkit-fit-content";
     145element.style.webkitGridDefinitionRows = "-webkit-fit-available -webkit-fit-available";
     146shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     147shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    148148
    149149element = document.createElement("div");
    150150document.body.appendChild(element);
    151 element.style.webkitGridColumns = "auto minmax(16px, auto)";
    152 element.style.webkitGridRows = "minmax(auto, 15%) 10vw";
    153 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    154 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     151element.style.webkitGridDefinitionColumns = "auto minmax(16px, auto)";
     152element.style.webkitGridDefinitionRows = "minmax(auto, 15%) 10vw";
     153shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     154shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
  • trunk/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js

    r137478 r152479  
    1 description('Test that setting and getting grid-columns and grid-rows works as expected');
     1description('Test that setting and getting grid-definition-columns and grid-definition-rows works as expected');
    22
    3 debug("Test getting -webkit-grid-columns and -webkit-grid-rows set through CSS");
     3debug("Test getting -webkit-grid-definition-columns and -webkit-grid-definition-rows set through CSS");
    44var gridWithNoneElement = document.getElementById("gridWithNoneElement");
    5 shouldBe("getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    6 shouldBe("getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     5shouldBe("getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     6shouldBe("getComputedStyle(gridWithNoneElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    77
    88var gridWithFixedElement = document.getElementById("gridWithFixedElement");
    9 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-columns')", "'10px'");
    10 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-rows')", "'15px'");
     9shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'10px'");
     10shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'15px'");
    1111
    1212var gridWithPercentElement = document.getElementById("gridWithPercentElement");
    13 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-columns')", "'53%'");
    14 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-rows')", "'27%'");
     13shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'53%'");
     14shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'27%'");
    1515
    1616var gridWithAutoElement = document.getElementById("gridWithAutoElement");
    17 shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-columns')", "'auto'");
    18 shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows')", "'auto'");
     17shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'auto'");
     18shouldBe("getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'auto'");
    1919
    2020var gridWithEMElement = document.getElementById("gridWithEMElement");
    21 shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns')", "'100px'");
    22 shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows')", "'150px'");
     21shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'100px'");
     22shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'150px'");
    2323
    2424var gridWithViewPortPercentageElement = document.getElementById("gridWithViewPortPercentageElement");
    25 shouldBe("getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-columns')", "'64px'");
    26 shouldBe("getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-rows')", "'60px'");
     25shouldBe("getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'64px'");
     26shouldBe("getComputedStyle(gridWithViewPortPercentageElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'60px'");
    2727
    2828var gridWithMinMax = document.getElementById("gridWithMinMax");
    29 shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-columns')", "'minmax(10%, 15px)'");
    30 shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-rows')", "'minmax(20px, 50%)'");
     29shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(10%, 15px)'");
     30shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(20px, 50%)'");
    3131
    3232var gridWithMinContent = document.getElementById("gridWithMinContent");
    33 shouldBe("getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-columns')", "'-webkit-min-content'");
    34 shouldBe("getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-rows')", "'-webkit-min-content'");
     33shouldBe("getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-definition-columns')", "'-webkit-min-content'");
     34shouldBe("getComputedStyle(gridWithMinContent, '').getPropertyValue('-webkit-grid-definition-rows')", "'-webkit-min-content'");
    3535
    3636var gridWithMaxContent = document.getElementById("gridWithMaxContent");
    37 shouldBe("getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-columns')", "'-webkit-max-content'");
    38 shouldBe("getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-rows')", "'-webkit-max-content'");
     37shouldBe("getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-definition-columns')", "'-webkit-max-content'");
     38shouldBe("getComputedStyle(gridWithMaxContent, '').getPropertyValue('-webkit-grid-definition-rows')", "'-webkit-max-content'");
    3939
    4040debug("");
    41 debug("Test getting wrong values for -webkit-grid-columns and -webkit-grid-rows through CSS (they should resolve to the default: 'none')");
     41debug("Test getting wrong values for -webkit-grid-definition-columns and -webkit-grid-definition-rows through CSS (they should resolve to the default: 'none')");
    4242var gridWithFitContentElement = document.getElementById("gridWithFitContentElement");
    43 shouldBe("getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    44 shouldBe("getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     43shouldBe("getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     44shouldBe("getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    4545
    4646var gridWithFitAvailableElement = document.getElementById("gridWithFitAvailableElement");
    47 shouldBe("getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    48 shouldBe("getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     47shouldBe("getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     48shouldBe("getComputedStyle(gridWithFitAvailableElement, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    4949
    5050debug("");
     
    5252var element = document.createElement("div");
    5353document.body.appendChild(element);
    54 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    55 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     54shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     55shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    5656
    5757debug("");
    58 debug("Test getting and setting -webkit-grid-columns and -webkit-grid-rows through JS");
    59 element.style.webkitGridColumns = "18px";
    60 element.style.webkitGridRows = "66px";
    61 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'18px'");
    62 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'66px'");
     58debug("Test getting and setting -webkit-grid-definition-columns and -webkit-grid-definition-rows through JS");
     59element.style.webkitGridDefinitionColumns = "18px";
     60element.style.webkitGridDefinitionRows = "66px";
     61shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'18px'");
     62shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'66px'");
    6363
    6464element = document.createElement("div");
    6565document.body.appendChild(element);
    66 element.style.webkitGridColumns = "55%";
    67 element.style.webkitGridRows = "40%";
    68 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'55%'");
    69 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'40%'");
     66element.style.webkitGridDefinitionColumns = "55%";
     67element.style.webkitGridDefinitionRows = "40%";
     68shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'55%'");
     69shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'40%'");
    7070
    7171element = document.createElement("div");
    7272document.body.appendChild(element);
    73 element.style.webkitGridColumns = "auto";
    74 element.style.webkitGridRows = "auto";
    75 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto'");
    76 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'auto'");
     73element.style.webkitGridDefinitionColumns = "auto";
     74element.style.webkitGridDefinitionRows = "auto";
     75shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'auto'");
     76shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'auto'");
    7777
    7878element = document.createElement("div");
    7979document.body.appendChild(element);
    80 element.style.webkitGridColumns = "10vw";
    81 element.style.webkitGridRows = "25vh";
    82 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'80px'");
    83 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'150px'");
     80element.style.webkitGridDefinitionColumns = "10vw";
     81element.style.webkitGridDefinitionRows = "25vh";
     82shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'80px'");
     83shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'150px'");
    8484
    8585element = document.createElement("div");
    8686document.body.appendChild(element);
    87 element.style.webkitGridColumns = "-webkit-min-content";
    88 element.style.webkitGridRows = "-webkit-min-content";
    89 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'-webkit-min-content'");
    90 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'-webkit-min-content'");
     87element.style.webkitGridDefinitionColumns = "-webkit-min-content";
     88element.style.webkitGridDefinitionRows = "-webkit-min-content";
     89shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'-webkit-min-content'");
     90shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'-webkit-min-content'");
    9191
    9292element = document.createElement("div");
    9393document.body.appendChild(element);
    94 element.style.webkitGridColumns = "-webkit-max-content";
    95 element.style.webkitGridRows = "-webkit-max-content";
    96 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'-webkit-max-content'");
    97 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'-webkit-max-content'");
     94element.style.webkitGridDefinitionColumns = "-webkit-max-content";
     95element.style.webkitGridDefinitionRows = "-webkit-max-content";
     96shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'-webkit-max-content'");
     97shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'-webkit-max-content'");
    9898
    9999debug("");
    100 debug("Test getting and setting -webkit-grid-columns and -webkit-grid-rows to minmax() values through JS");
     100debug("Test getting and setting -webkit-grid-definition-columns and -webkit-grid-definition-rows to minmax() values through JS");
    101101element = document.createElement("div");
    102102document.body.appendChild(element);
    103 element.style.webkitGridColumns = "minmax(55%, 45px)";
    104 element.style.webkitGridRows = "minmax(30px, 40%)";
    105 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(55%, 45px)'");
    106 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(30px, 40%)'");
     103element.style.webkitGridDefinitionColumns = "minmax(55%, 45px)";
     104element.style.webkitGridDefinitionRows = "minmax(30px, 40%)";
     105shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(55%, 45px)'");
     106shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(30px, 40%)'");
    107107
    108108element = document.createElement("div");
    109109document.body.appendChild(element);
    110110element.style.font = "10px Ahem";
    111 element.style.webkitGridColumns = "minmax(22em, 8vh)";
    112 element.style.webkitGridRows = "minmax(10vw, 5em)";
    113 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(220px, 48px)'");
    114 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(80px, 50px)'");
     111element.style.webkitGridDefinitionColumns = "minmax(22em, 8vh)";
     112element.style.webkitGridDefinitionRows = "minmax(10vw, 5em)";
     113shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(220px, 48px)'");
     114shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(80px, 50px)'");
    115115
    116116element = document.createElement("div");
    117117document.body.appendChild(element);
    118 element.style.webkitGridColumns = "minmax(-webkit-min-content, 8vh)";
    119 element.style.webkitGridRows = "minmax(10vw, -webkit-min-content)";
    120 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(-webkit-min-content, 48px)'");
    121 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(80px, -webkit-min-content)'");
     118element.style.webkitGridDefinitionColumns = "minmax(-webkit-min-content, 8vh)";
     119element.style.webkitGridDefinitionRows = "minmax(10vw, -webkit-min-content)";
     120shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(-webkit-min-content, 48px)'");
     121shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(80px, -webkit-min-content)'");
    122122
    123123element = document.createElement("div");
    124124document.body.appendChild(element);
    125125element.style.font = "10px Ahem";
    126 element.style.webkitGridColumns = "minmax(22em, -webkit-max-content)";
    127 element.style.webkitGridRows = "minmax(-webkit-max-content, 5em)";
    128 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(220px, -webkit-max-content)'");
    129 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(-webkit-max-content, 50px)'");
     126element.style.webkitGridDefinitionColumns = "minmax(22em, -webkit-max-content)";
     127element.style.webkitGridDefinitionRows = "minmax(-webkit-max-content, 5em)";
     128shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(220px, -webkit-max-content)'");
     129shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(-webkit-max-content, 50px)'");
    130130
    131131element = document.createElement("div");
    132132document.body.appendChild(element);
    133133element.style.font = "10px Ahem";
    134 element.style.webkitGridColumns = "minmax(22em, -webkit-max-content)";
    135 element.style.webkitGridRows = "minmax(-webkit-max-content, 5em)";
    136 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(220px, -webkit-max-content)'");
    137 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(-webkit-max-content, 50px)'");
     134element.style.webkitGridDefinitionColumns = "minmax(22em, -webkit-max-content)";
     135element.style.webkitGridDefinitionRows = "minmax(-webkit-max-content, 5em)";
     136shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(220px, -webkit-max-content)'");
     137shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(-webkit-max-content, 50px)'");
    138138
    139139element = document.createElement("div");
    140140document.body.appendChild(element);
    141 element.style.webkitGridColumns = "minmax(-webkit-min-content, -webkit-max-content)";
    142 element.style.webkitGridRows = "minmax(-webkit-max-content, -webkit-min-content)";
    143 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(-webkit-min-content, -webkit-max-content)'");
    144 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(-webkit-max-content, -webkit-min-content)'");
     141element.style.webkitGridDefinitionColumns = "minmax(-webkit-min-content, -webkit-max-content)";
     142element.style.webkitGridDefinitionRows = "minmax(-webkit-max-content, -webkit-min-content)";
     143shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'minmax(-webkit-min-content, -webkit-max-content)'");
     144shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'minmax(-webkit-max-content, -webkit-min-content)'");
    145145
    146146debug("");
    147 debug("Test setting grid-columns and grid-rows to bad minmax value through JS");
     147debug("Test setting grid-definition-columns and grid-definition-rows to bad minmax value through JS");
    148148element = document.createElement("div");
    149149document.body.appendChild(element);
    150150// No comma.
    151 element.style.webkitGridColumns = "minmax(10px 20px)";
     151element.style.webkitGridDefinitionColumns = "minmax(10px 20px)";
    152152// Only 1 argument provided.
    153 element.style.webkitGridRows = "minmax(10px)";
    154 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    155 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     153element.style.webkitGridDefinitionRows = "minmax(10px)";
     154shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     155shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    156156
    157157element = document.createElement("div");
    158158document.body.appendChild(element);
    159159// Nested minmax.
    160 element.style.webkitGridColumns = "minmax(minmax(10px, 20px), 20px)";
     160element.style.webkitGridDefinitionColumns = "minmax(minmax(10px, 20px), 20px)";
    161161// Only 2 arguments are allowed.
    162 element.style.webkitGridRows = "minmax(10px, 20px, 30px)";
    163 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    164 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     162element.style.webkitGridDefinitionRows = "minmax(10px, 20px, 30px)";
     163shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     164shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    165165
    166166element = document.createElement("div");
    167167document.body.appendChild(element);
    168168// No breadth value.
    169 element.style.webkitGridColumns = "minmax()";
     169element.style.webkitGridDefinitionColumns = "minmax()";
    170170// No comma.
    171 element.style.webkitGridRows = "minmax(30px 30% 30em)";
    172 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    173 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     171element.style.webkitGridDefinitionRows = "minmax(30px 30% 30em)";
     172shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     173shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    174174
    175175element = document.createElement("div");
    176176document.body.appendChild(element);
    177177// Auto is not allowed inside minmax.
    178 element.style.webkitGridColumns = "minmax(auto, 8vh)";
    179 element.style.webkitGridRows = "minmax(10vw, auto)";
    180 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    181 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     178element.style.webkitGridDefinitionColumns = "minmax(auto, 8vh)";
     179element.style.webkitGridDefinitionRows = "minmax(10vw, auto)";
     180shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     181shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
    182182
    183183debug("");
    184 debug("Test setting grid-columns and grid-rows back to 'none' through JS");
    185 element.style.webkitGridColumns = "18px";
    186 element.style.webkitGridRows = "66px";
    187 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'18px'");
    188 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'66px'");
    189 element.style.webkitGridColumns = "none";
    190 element.style.webkitGridRows = "none";
    191 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
    192 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
     184debug("Test setting grid-definition-columns and grid-definition-rows back to 'none' through JS");
     185element.style.webkitGridDefinitionColumns = "18px";
     186element.style.webkitGridDefinitionRows = "66px";
     187shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'18px'");
     188shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'66px'");
     189element.style.webkitGridDefinitionColumns = "none";
     190element.style.webkitGridDefinitionRows = "none";
     191shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "'none'");
     192shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-rows')", "'none'");
  • trunk/LayoutTests/ietestcenter/css3/grid/display-grid-001-expected.htm

    r114313 r152479  
    5353                -moz-grid-columns: auto 1fr;
    5454                -o-grid-columns: auto 1fr;
    55                 -webkit-grid-columns: auto 1fr;
     55                -webkit-grid-defintion-columns: auto 1fr;
    5656                grid-columns: auto 1fr;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-definition-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/display-grid-001.htm

    r114162 r152479  
    5353                -moz-grid-columns: auto 1fr;
    5454                -o-grid-columns: auto 1fr;
    55                 -webkit-grid-columns: auto 1fr;
     55                -webkit-grid-defintion-columns: auto 1fr;
    5656                grid-columns: auto 1fr;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-defintion-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/display-grid-002-expected.htm

    r114313 r152479  
    5353                -moz-grid-columns: auto 1fr;
    5454                -o-grid-columns: auto 1fr;
    55                 -webkit-grid-columns: auto 1fr;
     55                -webkit-grid-defintion-columns: auto 1fr;
    5656                grid-columns: auto 1fr;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-defintion-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/display-grid-002.htm

    r114162 r152479  
    5353                -moz-grid-columns: auto 1fr;
    5454                -o-grid-columns: auto 1fr;
    55                 -webkit-grid-columns: auto 1fr;
     55                -webkit-grid-defintion-columns: auto 1fr;
    5656                grid-columns: auto 1fr;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-defintion-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-001-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-001.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-002-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-002.htm

    r147430 r152479  
    4949                -moz-grid-columns: auto 1fr;
    5050                -o-grid-columns: auto 1fr;
    51                 -webkit-grid-columns: auto 1fr;
     51                -webkit-grid-defintion-columns: auto 1fr;
    5252                grid-columns: auto 1fr;
    5353                -ms-grid-rows: auto 1fr;
    5454                -moz-grid-rows: auto 1fr;
    5555                -o-grid-rows: auto 1fr;
    56                 -webkit-grid-rows: auto 1fr;
     56                -webkit-grid-defintion-rows: auto 1fr;
    5757                grid-rows: auto 1fr;
    5858            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-003-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-column-003.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-columns-001-expected.htm

    r114313 r152479  
    5353                -moz-grid-columns: -1em;
    5454                -o-grid-columns: -1em;
    55                 -webkit-grid-columns: -1em;
     55                -webkit-grid-defintion-columns: -1em;
    5656                grid-columns: -1em;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-defintion-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-columns-001.htm

    r114162 r152479  
    5353                -moz-grid-columns: -1em;
    5454                -o-grid-columns: -1em;
    55                 -webkit-grid-columns: -1em;
     55                -webkit-grid-defintion-columns: -1em;
    5656                grid-columns: -1em;
    5757                -ms-grid-rows: auto 1fr;
    5858                -moz-grid-rows: auto 1fr;
    5959                -o-grid-rows: auto 1fr;
    60                 -webkit-grid-rows: auto 1fr;
     60                -webkit-grid-defintion-rows: auto 1fr;
    6161                grid-rows: auto 1fr;
    6262            }
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-001-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-001.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-002-expected.htm

    r114313 r152479  
    4747                -moz-grid-columns: auto 1fr;
    4848                -o-grid-columns: auto 1fr;
    49                 -webkit-grid-columns: auto 1fr;
     49                -webkit-grid-defintion-columns: auto 1fr;
    5050                grid-columns: auto 1fr;
    5151                -ms-grid-rows: auto 1fr;
    5252                -moz-grid-rows: auto 1fr;
    5353                -o-grid-rows: auto 1fr;
    54                 -webkit-grid-rows: auto 1fr;
     54                -webkit-grid-defintion-rows: auto 1fr;
    5555                grid-rows: auto 1fr;
    5656                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-002.htm

    r114162 r152479  
    4747                -moz-grid-columns: auto 1fr;
    4848                -o-grid-columns: auto 1fr;
    49                 -webkit-grid-columns: auto 1fr;
     49                -webkit-grid-defintion-columns: auto 1fr;
    5050                grid-columns: auto 1fr;
    5151                -ms-grid-rows: auto 1fr;
    5252                -moz-grid-rows: auto 1fr;
    5353                -o-grid-rows: auto 1fr;
    54                 -webkit-grid-rows: auto 1fr;
     54                -webkit-grid-defintion-rows: auto 1fr;
    5555                grid-rows: auto 1fr;
    5656                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-003-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-003.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-004-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-004.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-005-expected.htm

    r114313 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/LayoutTests/ietestcenter/css3/grid/grid-items-005.htm

    r114162 r152479  
    4848                -moz-grid-columns: auto 1fr;
    4949                -o-grid-columns: auto 1fr;
    50                 -webkit-grid-columns: auto 1fr;
     50                -webkit-grid-defintion-columns: auto 1fr;
    5151                grid-columns: auto 1fr;
    5252                -ms-grid-rows: auto 1fr;
    5353                -moz-grid-rows: auto 1fr;
    5454                -o-grid-rows: auto 1fr;
    55                 -webkit-grid-rows: auto 1fr;
     55                -webkit-grid-defintion-rows: auto 1fr;
    5656                grid-rows: auto 1fr;
    5757                width: 12em;
  • trunk/Source/WebCore/ChangeLog

    r152478 r152479  
     12013-07-08  Martin Robinson  <mrobinson@igalia.com>
     2
     3        [CSS Grid Layout] Rename grid-{rows|columns} to grid-definition-{rows|columns}
     4        https://bugs.webkit.org/show_bug.cgi?id=103336
     5
     6        Reviewed by Tony Chang.
     7
     8        Rename -webkit-grid-{rows|columns} to -webkit-grid-definition-{rows|columns}.
     9        The latest version of the spec has renamed these properties.
     10
     11        * css/CSSComputedStyleDeclaration.cpp:
     12        (WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue): Handle the new names.
     13        * css/CSSParser.cpp:
     14        (WebCore::CSSParser::parseValue): Ditto.
     15        * css/CSSProperty.cpp:
     16        (WebCore::CSSProperty::isInheritedProperty): Ditto.
     17        * css/CSSPropertyNames.in: Add support for the new names.
     18        * css/StyleResolver.cpp:
     19        (WebCore::StyleResolver::applyProperty): Handle the new names.
     20
    1212013-07-08  Enrica Casucci  <enrica@apple.com>
    222
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp

    r152083 r152479  
    292292    CSSPropertyWebkitGridAutoFlow,
    293293    CSSPropertyWebkitGridAutoRows,
    294     CSSPropertyWebkitGridColumns,
    295     CSSPropertyWebkitGridRows,
     294    CSSPropertyWebkitGridDefinitionColumns,
     295    CSSPropertyWebkitGridDefinitionRows,
    296296    CSSPropertyWebkitGridStart,
    297297    CSSPropertyWebkitGridEnd,
     
    19741974        case CSSPropertyWebkitGridAutoRows:
    19751975            return valueForGridTrackSize(style->gridAutoRows(), style.get(), m_node->document()->renderView());
    1976         case CSSPropertyWebkitGridColumns:
     1976        case CSSPropertyWebkitGridDefinitionColumns:
    19771977            return valueForGridTrackList(style->gridColumns(), style.get(), m_node->document()->renderView());
    1978         case CSSPropertyWebkitGridRows:
     1978        case CSSPropertyWebkitGridDefinitionRows:
    19791979            return valueForGridTrackList(style->gridRows(), style.get(), m_node->document()->renderView());
    19801980
  • trunk/Source/WebCore/css/CSSParser.cpp

    r152083 r152479  
    26462646        break;
    26472647
    2648     case CSSPropertyWebkitGridColumns:
    2649     case CSSPropertyWebkitGridRows:
     2648    case CSSPropertyWebkitGridDefinitionColumns:
     2649    case CSSPropertyWebkitGridDefinitionRows:
    26502650        if (!cssGridLayoutEnabled())
    26512651            return false;
  • trunk/Source/WebCore/css/CSSProperty.cpp

    r152083 r152479  
    590590    case CSSPropertyWebkitGridAutoFlow:
    591591    case CSSPropertyWebkitGridAutoRows:
    592     case CSSPropertyWebkitGridColumns:
    593     case CSSPropertyWebkitGridRows:
     592    case CSSPropertyWebkitGridDefinitionColumns:
     593    case CSSPropertyWebkitGridDefinitionRows:
    594594    case CSSPropertyWebkitGridStart:
    595595    case CSSPropertyWebkitGridEnd:
  • trunk/Source/WebCore/css/CSSPropertyNames.in

    r152083 r152479  
    302302-webkit-grid-auto-columns
    303303-webkit-grid-auto-rows
    304 -webkit-grid-columns
    305 -webkit-grid-rows
     304-webkit-grid-definition-columns
     305-webkit-grid-definition-rows
    306306-webkit-grid-start
    307307-webkit-grid-end
  • trunk/Source/WebCore/css/StyleResolver.cpp

    r152440 r152479  
    28472847        return;
    28482848    }
    2849     case CSSPropertyWebkitGridColumns: {
     2849    case CSSPropertyWebkitGridDefinitionColumns: {
    28502850        Vector<GridTrackSize> trackSizes;
    28512851        if (!createGridTrackList(value, trackSizes, state))
     
    28542854        return;
    28552855    }
    2856     case CSSPropertyWebkitGridRows: {
     2856    case CSSPropertyWebkitGridDefinitionRows: {
    28572857        Vector<GridTrackSize> trackSizes;
    28582858        if (!createGridTrackList(value, trackSizes, state))
Note: See TracChangeset for help on using the changeset viewer.