New issue
Advanced search Search tips

Issue 759665 link

Starred by 10 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Feature



Sign in to add a comment

[css-grid] Support transitions/animations on grid-template-columns|rows

Reported by graygilm...@gmail.com, Aug 28 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.101 Safari/537.36

Steps to reproduce the problem:
1. Create a grid layout using grid-template-columns
2. Have a modifier class that changes the values of grid-template-columns
3. Add a transition listener to the element

What is the expected behavior?
The new values should be transitioned into place.

What went wrong?
There are no transitions and the new values immediately snap into position.

An example: https://codepen.io/graygilmore/pen/ee3d2ac7a96be5e6d45409eb206eba42

Did this work before? No 

Does this work in other browsers? No
 Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=1348519

Chrome version: 60.0.3112.101  Channel: stable
OS Version: OS X 10.12.6
Flash Version: 

I'm not sure how useful this will be for developers but it's in the spec: https://drafts.csswg.org/css-grid/#track-sizing
 
Components: -Blink>CSS Blink>Animation
Labels: -Type-Bug Type-Feature
Status: Untriaged (was: Unconfirmed)
It looks like this probably should work https://www.w3.org/TR/css-grid-1/#track-sizing
Labels: -Pri-2 Pri-3
Status: Available (was: Untriaged)
Labels: Update-Quarterly
this is pretty important for me.  Is there any plans to get it working for grid-template-columns and grid-template-rows as defined in the spec?  It seems to work for grid-gap but not columns and rows
Cc: jfernan...@igalia.com r...@igalia.com obru...@igalia.com
Components: Blink>Layout>Grid
Labels: -OS-Mac Hotlist-Interop
Summary: [css-grid] Support transitions/animations on grid-template-columns|rows (was: CSS Grid does not transition/animate grid-template-columns)

Firefox has just implemented this and it'll be shipping in Firefox 66.
Project Member

Comment 6 by bugdroid1@chromium.org, Yesterday (45 hours ago)

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/047afe57067b8640321c9a1af355339e5b7ed51d

commit 047afe57067b8640321c9a1af355339e5b7ed51d
Author: Morten Stenshorne <mstensho@chromium.org>
Date: Mon Jan 21 21:50:18 2019

New CSS grid failures caused by missing animations support.

Bug: 759665
Change-Id: I674e8f9909aaa7b47e10d47629808aa713bb0f98
Reviewed-on: https://chromium-review.googlesource.com/c/1425725
Reviewed-by: Manuel Rego <rego@igalia.com>
Commit-Queue: Manuel Rego <rego@igalia.com>
Commit-Queue: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#624680}
[modify] https://crrev.com/047afe57067b8640321c9a1af355339e5b7ed51d/third_party/blink/web_tests/TestExpectations

Sign in to add a comment