New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-grid][css-multicol][css-flexbox][css-tables] Proposal for Various Gap Issues #1696

Closed
fantasai opened this Issue Aug 4, 2017 · 10 comments

Comments

Projects
None yet
7 participants
@fantasai
Contributor

fantasai commented Aug 4, 2017

We've had some feedback on gaps, the one prompting this discussion being that authors are finding it awkward that the grid shorthand resets the gaps, preferring that it does not and that it is treated similar to spacing controls such as grid container padding and grid item margins. (#1036)

Unwinding the threads of discussions and resolutions, and discussing with several people at the F2F here, we have the following proposal:

  • Disconnect the grid-gap properties from the grid shorthand, resolving #1036
  • Undo the resolution changing column-gap and row-gap to grid-column-gap and grid-row-gap.
    • As before that resolution, column-gap is shared with multi-col and normal computes to zero except on multi-column elements.
  • Apply column-gap and row-gap to flex containers, resolving a strong demand from flexbox users to have this spacing control. (See Rachel's message to www-style and #592 with special note of erikjung's comment)
  • As a clean-up measure, have these properties obsolete border-spacing (which inherits, which is weird) by having them defer to border-spacing when specified as normal and override it otherwise.
@fantasai

This comment has been minimized.

Show comment
Hide comment
@fantasai

fantasai Aug 4, 2017

Contributor

Note: We would need to (at least temporarily, possibly permanently) maintain aliases from grid-*-gap to the unprefixed properties like we do for page-break-*, since grid layouts are deployed already.

Contributor

fantasai commented Aug 4, 2017

Note: We would need to (at least temporarily, possibly permanently) maintain aliases from grid-*-gap to the unprefixed properties like we do for page-break-*, since grid layouts are deployed already.

@bdc-stripe

This comment has been minimized.

Show comment
Hide comment
@bdc-stripe

bdc-stripe Aug 4, 2017

I'm very sympathetic to that idea. Nitpick: does that mean we'd only have a shorthand gap property for grid (assuming we keep the aliases) ?

bdc-stripe commented Aug 4, 2017

I'm very sympathetic to that idea. Nitpick: does that mean we'd only have a shorthand gap property for grid (assuming we keep the aliases) ?

@rachelandrew

This comment has been minimized.

Show comment
Hide comment
@rachelandrew

rachelandrew Aug 4, 2017

Contributor

I'd be happy with that as long as we have the aliasing and I think authors would be very keen with getting these for flex.

Contributor

rachelandrew commented Aug 4, 2017

I'd be happy with that as long as we have the aliasing and I think authors would be very keen with getting these for flex.

@atanassov

This comment has been minimized.

Show comment
Hide comment
@atanassov

atanassov Aug 4, 2017

Collaborator

@bdc-stripe, no, the gap shorthand should work for any layout that accepts gaps

Collaborator

atanassov commented Aug 4, 2017

@bdc-stripe, no, the gap shorthand should work for any layout that accepts gaps

@bdc-stripe

This comment has been minimized.

Show comment
Hide comment
@bdc-stripe

bdc-stripe Aug 4, 2017

@atanassov Ok cool (didn't see a proposal for gap).

bdc-stripe commented Aug 4, 2017

@atanassov Ok cool (didn't see a proposal for gap).

@SelenIT

This comment has been minimized.

Show comment
Hide comment
@SelenIT

SelenIT Aug 4, 2017

Collaborator

@fantasai, does #1036 (comment) mean that the last bullet point regarding tables has just been rejected?

Collaborator

SelenIT commented Aug 4, 2017

@fantasai, does #1036 (comment) mean that the last bullet point regarding tables has just been rejected?

@tabatkins

This comment has been minimized.

Show comment
Hide comment
@tabatkins

tabatkins Aug 4, 2017

Member

Yes, at least for now (and probably permanently), we're not going to apply row-gap and column-gap to tables.

Member

tabatkins commented Aug 4, 2017

Yes, at least for now (and probably permanently), we're not going to apply row-gap and column-gap to tables.

@fantasai

This comment has been minimized.

Show comment
Hide comment
@fantasai

fantasai Aug 9, 2017

Contributor

WG resolution: https://logs.csswg.org/irc.w3.org/css/2017-08-04/#e847329
Proposal has been accepted, minus the tables part because nobody wants to deal with tables.

Contributor

fantasai commented Aug 9, 2017

WG resolution: https://logs.csswg.org/irc.w3.org/css/2017-08-04/#e847329
Proposal has been accepted, minus the tables part because nobody wants to deal with tables.

@fantasai

This comment has been minimized.

Show comment
Hide comment
@fantasai

fantasai Aug 11, 2017

Contributor

Edits checked in, closing issue. :) Expect to republish to /TR at the end of the month.

Contributor

fantasai commented Aug 11, 2017

Edits checked in, closing issue. :) Expect to republish to /TR at the end of the month.

@yisibl

This comment has been minimized.

Show comment
Hide comment
@yisibl

yisibl Nov 17, 2017

Please start the Flexbox 2 spec as soon as possible.

yisibl commented Nov 17, 2017

Please start the Flexbox 2 spec as soon as possible.

chromium-wpt-export-bot added a commit to web-platform-tests/wpt that referenced this issue Jan 29, 2018

[css-grid] Unprefix gutter properties
This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

That is:
* grid-column-gap => column-gap
* grid-row-gap => row-gap
* grid-gap => gap

column-gap already existed before, as it's part of Multicol,
and it already has an alias -webkit-column-gap.
For that reason it's not possible to implement another alias
for grid-column-gap, so it was done with a shorthand.
To follow the same pattern the shorthand approach was used for
grid-row-gap and grid-gap too.

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Intent to Implement and Ship thread:
https://groups.google.com/a/chromium.org/d/msg/blink-dev/UViBfJuuIq8/w7_2W7lLAgAJ

Converted grid-gutters-get-set.html in some WPT tests covering
a few extra cases.
Added WPT test to verify the animation of these properties too.

BUG=761904
TEST=external/wpt/css/css-align/gaps/

Change-Id: If49ec34116eff0b3b745fc89b01b15b14c71d4a9

chromium-wpt-export-bot added a commit to web-platform-tests/wpt that referenced this issue Feb 5, 2018

[css-grid] Unprefix gutter properties
This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

That is:
* grid-column-gap => column-gap
* grid-row-gap => row-gap
* grid-gap => gap

column-gap already existed before, as it's part of Multicol,
and it already has an alias -webkit-column-gap.
For that reason it's not possible to implement another alias
for grid-column-gap, so it was done with a shorthand.
To follow the same pattern the shorthand approach was used for
grid-row-gap and grid-gap too.

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Intent to Implement and Ship thread:
https://groups.google.com/a/chromium.org/d/msg/blink-dev/UViBfJuuIq8/w7_2W7lLAgAJ

Converted grid-gutters-get-set.html in some WPT tests covering
a few extra cases.
Added WPT test to verify the animation of these properties too.

BUG=761904
TEST=external/wpt/css/css-align/gaps/

Change-Id: If49ec34116eff0b3b745fc89b01b15b14c71d4a9
Reviewed-on: https://chromium-review.googlesource.com/890446
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Manuel Rego Casasnovas <rego@igalia.com>
Cr-Commit-Position: refs/heads/master@{#534351}

chromium-wpt-export-bot added a commit to web-platform-tests/wpt that referenced this issue Feb 5, 2018

[css-grid] Unprefix gutter properties
This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

That is:
* grid-column-gap => column-gap
* grid-row-gap => row-gap
* grid-gap => gap

column-gap already existed before, as it's part of Multicol,
and it already has an alias -webkit-column-gap.
For that reason it's not possible to implement another alias
for grid-column-gap, so it was done with a shorthand.
To follow the same pattern the shorthand approach was used for
grid-row-gap and grid-gap too.

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Intent to Implement and Ship thread:
https://groups.google.com/a/chromium.org/d/msg/blink-dev/UViBfJuuIq8/w7_2W7lLAgAJ

Converted grid-gutters-get-set.html in some WPT tests covering
a few extra cases.
Added WPT test to verify the animation of these properties too.

BUG=761904
TEST=external/wpt/css/css-align/gaps/

Change-Id: If49ec34116eff0b3b745fc89b01b15b14c71d4a9
Reviewed-on: https://chromium-review.googlesource.com/890446
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Manuel Rego Casasnovas <rego@igalia.com>
Cr-Commit-Position: refs/heads/master@{#534351}

bertogg pushed a commit to Igalia/webkit that referenced this issue Feb 5, 2018

rego@igalia.com
[css-grid] Rename gutter properties to remove "grid-" prefix
https://bugs.webkit.org/show_bug.cgi?id=180290

Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Imported WPT tests from css/css-align/gaps/.
And also update the tests on css/css-grid/alignment/ gutter tests.

* web-platform-tests/css/css-align/gaps/column-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004.html: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/w3c-import.log: Added.
* web-platform-tests/css/css-grid/alignment/grid-gutters-001-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-002-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-003-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-004-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-005-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-006-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-007-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-008-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-009-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-010-expected.html:

Source/WebCore:

This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

column-gap already existed before, as it's part of Multicol.
The patch adds the new properties row-gap and gap, and keep the legacy ones
as aliases:
- grid-column-gap => column-gap
- grid-row-gap => row-gap
- grid-gap => gap

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Tests: imported/w3c/web-platform-tests/css/css-align/gaps/

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
* css/CSSProperties.json:
* css/StyleProperties.cpp:
* css/parser/CSSParserFastPaths.cpp:
(WebCore::isSimpleLengthPropertyID):
* css/parser/CSSPropertyParser.cpp:
(WebCore::CSSPropertyParser::parseSingleValue):
(WebCore::CSSPropertyParser::parseShorthand):
* page/animation/CSSPropertyAnimation.cpp:
(WebCore::CSSPropertyAnimationWrapperMap::CSSPropertyAnimationWrapperMap):
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::availableSpaceForGutters const):
(WebCore::RenderGrid::gridGap const):
* rendering/style/RenderStyle.h:
(WebCore::RenderStyle::gridAutoRows const):
(WebCore::RenderStyle::columnGap const):
(WebCore::RenderStyle::rowGap const):
(WebCore::RenderStyle::setGridItemRowEnd):
(WebCore::RenderStyle::setColumnGap):
(WebCore::RenderStyle::setRowGap):
(WebCore::RenderStyle::initialRowGap):
* rendering/style/StyleGridData.cpp:
(WebCore::StyleGridData::StyleGridData):
* rendering/style/StyleGridData.h:
(WebCore::StyleGridData::operator== const):
* rendering/style/StyleMultiColData.cpp:
(WebCore::StyleMultiColData::StyleMultiColData):
(WebCore::StyleMultiColData::operator== const):
* rendering/style/StyleMultiColData.h:
* rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator== const):
* rendering/style/StyleRareNonInheritedData.h:

LayoutTests:

* TestExpectations: We're now passing some gutters tests,
so removing them from TestExpectations.
* fast/css-grid-layout/grid-gutters-get-set.html: Removed. This is now covered by WPT tests.
* fast/css-grid-layout/grid-shorthand-get-set-expected.txt: Update results for gutter properties
as default value is now "normal".
* fast/css-grid-layout/grid-shorthand-get-set.html: Update checks for gutter properties
as default value is now "normal".


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@228095 268f45cc-cd09-0410-ab3c-d52691b4dbfc

ardalanamini pushed a commit to siliconjs/chromium that referenced this issue Feb 5, 2018

[css-grid] Unprefix gutter properties
This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

That is:
* grid-column-gap => column-gap
* grid-row-gap => row-gap
* grid-gap => gap

column-gap already existed before, as it's part of Multicol,
and it already has an alias -webkit-column-gap.
For that reason it's not possible to implement another alias
for grid-column-gap, so it was done with a shorthand.
To follow the same pattern the shorthand approach was used for
grid-row-gap and grid-gap too.

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Intent to Implement and Ship thread:
https://groups.google.com/a/chromium.org/d/msg/blink-dev/UViBfJuuIq8/w7_2W7lLAgAJ

Converted grid-gutters-get-set.html in some WPT tests covering
a few extra cases.
Added WPT test to verify the animation of these properties too.

BUG=761904
TEST=external/wpt/css/css-align/gaps/

Change-Id: If49ec34116eff0b3b745fc89b01b15b14c71d4a9
Reviewed-on: https://chromium-review.googlesource.com/890446
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Manuel Rego Casasnovas <rego@igalia.com>
Cr-Commit-Position: refs/heads/master@{#534351}

moz-v2v-gh pushed a commit to mozilla/gecko-dev that referenced this issue Mar 1, 2018

Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…
…testonly

Automatic update from web-platform-tests
This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

That is:
* grid-column-gap => column-gap
* grid-row-gap => row-gap
* grid-gap => gap

column-gap already existed before, as it's part of Multicol,
and it already has an alias -webkit-column-gap.
For that reason it's not possible to implement another alias
for grid-column-gap, so it was done with a shorthand.
To follow the same pattern the shorthand approach was used for
grid-row-gap and grid-gap too.

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Intent to Implement and Ship thread:
https://groups.google.com/a/chromium.org/d/msg/blink-dev/UViBfJuuIq8/w7_2W7lLAgAJ

Converted grid-gutters-get-set.html in some WPT tests covering
a few extra cases.
Added WPT test to verify the animation of these properties too.

BUG=761904
TEST=external/wpt/css/css-align/gaps/

Change-Id: If49ec34116eff0b3b745fc89b01b15b14c71d4a9
Reviewed-on: https://chromium-review.googlesource.com/890446
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Manuel Rego Casasnovas <rego@igalia.com>
Cr-Commit-Position: refs/heads/master@{#534351}

<!-- Reviewable:start -->

<!-- Reviewable:end -->

wpt-commits: 147afee64f7df1bbb2b22451c2d479e5495f2405
wpt-pr: 9227
reapplied-commits: 370e267e160568862f1fd9ec246ab5bb840f586e, fe4514c84e7ad28e46bad5da93381deb99b177f3, 7806af854343c043a2645a4034fdc7812f65daad, 9ddfd21554293dec5a4bf2e5375ae4f3c9f2ded0, 75f63c4d1ebc949647184fd60972fc7b9fd4affb, 1f3a5b496acd2288cc8cf0c32af86cb35157ea4e, 88b42bd5847abac58a62c4d6b33c1509bfce5f3d, 15c2e4c690700c6c115f8afe5e44ded10d943538, c8d461ef1437641ae7d4ea1d21e1e60cd62910b0, a6088a5f48ee299386a84d2f771902267d7355b1, 0634cd8f08ebe0905a9188fb1398c7b5f889c5dc, c8ee4a012dae506ae06bb5b2ad50942b04c1aaaa, c2c352456a4cf62dcc12f851138b04397675a445, b93a8879555d2fa7e7d4e00a275513a3a6338b35, b86e1331cb36634fd33677043b61fc0c1d8485bc, 44ddf14fd3346658c3223f13652073fafbfa48fa, a1a5840a6bb53e305ba02bcbeb215659342d0edb, 7465cb110ae5ec2e2ca73182caf5293f0efc8fd5, aad5349b3458bc3414e274b33fa86a1123901ff2, eca0907980d2769c449894a6277c60c1a306792f, 38626987c0cfd6e715cfcc6f4f1a1209191a03c5, e4a67f7ddcde6cd99348e9104bd7ed07074da44a, bb3c9990840a0fae2afc840b5952d7874785b112, 042d7adef0bdb9dc80e825c3997ace7519477c42, 99f1ea44fc7915b8b7b33bce4732fa8765fd3ac2

bertogg pushed a commit to Igalia/webkit that referenced this issue Mar 6, 2018

carlosgc@webkit.org
Merge r228095 - [css-grid] Rename gutter properties to remove "grid-"…
… prefix

https://bugs.webkit.org/show_bug.cgi?id=180290

Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Imported WPT tests from css/css-align/gaps/.
And also update the tests on css/css-grid/alignment/ gutter tests.

* web-platform-tests/css/css-align/gaps/column-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004.html: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/w3c-import.log: Added.
* web-platform-tests/css/css-grid/alignment/grid-gutters-001-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-002-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-003-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-004-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-005-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-006-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-007-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-008-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-009-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-010-expected.html:

Source/WebCore:

This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

column-gap already existed before, as it's part of Multicol.
The patch adds the new properties row-gap and gap, and keep the legacy ones
as aliases:
- grid-column-gap => column-gap
- grid-row-gap => row-gap
- grid-gap => gap

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Tests: imported/w3c/web-platform-tests/css/css-align/gaps/

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
* css/CSSProperties.json:
* css/StyleProperties.cpp:
* css/parser/CSSParserFastPaths.cpp:
(WebCore::isSimpleLengthPropertyID):
* css/parser/CSSPropertyParser.cpp:
(WebCore::CSSPropertyParser::parseSingleValue):
(WebCore::CSSPropertyParser::parseShorthand):
* page/animation/CSSPropertyAnimation.cpp:
(WebCore::CSSPropertyAnimationWrapperMap::CSSPropertyAnimationWrapperMap):
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::availableSpaceForGutters const):
(WebCore::RenderGrid::gridGap const):
* rendering/style/RenderStyle.h:
(WebCore::RenderStyle::gridAutoRows const):
(WebCore::RenderStyle::columnGap const):
(WebCore::RenderStyle::rowGap const):
(WebCore::RenderStyle::setGridItemRowEnd):
(WebCore::RenderStyle::setColumnGap):
(WebCore::RenderStyle::setRowGap):
(WebCore::RenderStyle::initialRowGap):
* rendering/style/StyleGridData.cpp:
(WebCore::StyleGridData::StyleGridData):
* rendering/style/StyleGridData.h:
(WebCore::StyleGridData::operator== const):
* rendering/style/StyleMultiColData.cpp:
(WebCore::StyleMultiColData::StyleMultiColData):
(WebCore::StyleMultiColData::operator== const):
* rendering/style/StyleMultiColData.h:
* rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator== const):
* rendering/style/StyleRareNonInheritedData.h:

LayoutTests:

* TestExpectations: We're now passing some gutters tests,
so removing them from TestExpectations.
* fast/css-grid-layout/grid-gutters-get-set.html: Removed. This is now covered by WPT tests.
* fast/css-grid-layout/grid-shorthand-get-set-expected.txt: Update results for gutter properties
as default value is now "normal".
* fast/css-grid-layout/grid-shorthand-get-set.html: Update checks for gutter properties
as default value is now "normal".

git-svn-id: http://svn.webkit.org/repository/webkit/releases/WebKitGTK/webkit-2.20@228611 268f45cc-cd09-0410-ab3c-d52691b4dbfc

ashkulz pushed a commit to ashkulz/webkit that referenced this issue Apr 13, 2018

carlosgc@webkit.org
Merge r228095 - [css-grid] Rename gutter properties to remove "grid-"…
… prefix

https://bugs.webkit.org/show_bug.cgi?id=180290

Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Imported WPT tests from css/css-align/gaps/.
And also update the tests on css/css-grid/alignment/ gutter tests.

* web-platform-tests/css/css-align/gaps/column-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-animation-004.html: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-column-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/grid-row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-001.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-002.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-animation-003.html: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001-expected.txt: Added.
* web-platform-tests/css/css-align/gaps/row-gap-parsing-001.html: Added.
* web-platform-tests/css/css-align/gaps/w3c-import.log: Added.
* web-platform-tests/css/css-grid/alignment/grid-gutters-001-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-002-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-003-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-004-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-005-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-006-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-007-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-008-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-009-expected.html:
* web-platform-tests/css/css-grid/alignment/grid-gutters-010-expected.html:

Source/WebCore:

This patch applies the resoultion of the CSS WG to unprefix
the CSS Grid Layout gutter properties:
w3c/csswg-drafts#1696

column-gap already existed before, as it's part of Multicol.
The patch adds the new properties row-gap and gap, and keep the legacy ones
as aliases:
- grid-column-gap => column-gap
- grid-row-gap => row-gap
- grid-gap => gap

As column-gap was already animatable, this change takes advantage
to make animatable row-gap too.

Tests: imported/w3c/web-platform-tests/css/css-align/gaps/

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
* css/CSSProperties.json:
* css/StyleProperties.cpp:
* css/parser/CSSParserFastPaths.cpp:
(WebCore::isSimpleLengthPropertyID):
* css/parser/CSSPropertyParser.cpp:
(WebCore::CSSPropertyParser::parseSingleValue):
(WebCore::CSSPropertyParser::parseShorthand):
* page/animation/CSSPropertyAnimation.cpp:
(WebCore::CSSPropertyAnimationWrapperMap::CSSPropertyAnimationWrapperMap):
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::availableSpaceForGutters const):
(WebCore::RenderGrid::gridGap const):
* rendering/style/RenderStyle.h:
(WebCore::RenderStyle::gridAutoRows const):
(WebCore::RenderStyle::columnGap const):
(WebCore::RenderStyle::rowGap const):
(WebCore::RenderStyle::setGridItemRowEnd):
(WebCore::RenderStyle::setColumnGap):
(WebCore::RenderStyle::setRowGap):
(WebCore::RenderStyle::initialRowGap):
* rendering/style/StyleGridData.cpp:
(WebCore::StyleGridData::StyleGridData):
* rendering/style/StyleGridData.h:
(WebCore::StyleGridData::operator== const):
* rendering/style/StyleMultiColData.cpp:
(WebCore::StyleMultiColData::StyleMultiColData):
(WebCore::StyleMultiColData::operator== const):
* rendering/style/StyleMultiColData.h:
* rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator== const):
* rendering/style/StyleRareNonInheritedData.h:

LayoutTests:

* TestExpectations: We're now passing some gutters tests,
so removing them from TestExpectations.
* fast/css-grid-layout/grid-gutters-get-set.html: Removed. This is now covered by WPT tests.
* fast/css-grid-layout/grid-shorthand-get-set-expected.txt: Update results for gutter properties
as default value is now "normal".
* fast/css-grid-layout/grid-shorthand-get-set.html: Update checks for gutter properties
as default value is now "normal".

git-svn-id: http://svn.webkit.org/repository/webkit/releases/WebKitGTK/webkit-2.20@228611 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment