Skip to content

[css-grid] Doubts about specified and computed value of grid-auto-flow property #1834

@mrego

Description

@mrego

The spec text is the following:

Computed value: specified value
Canonical order: per grammar

I'm testing something like this:

  grid.style.gridAutoFlow = "row";
  console.log(".style: " + grid.style.gridAutoFlow);
  console.log("computedStyle: " + window.getComputedStyle(grid).gridAutoFlow);

And I'm setting different values than row.
The output is:

1) Set grid-auto-flow to 'row'
	1.1) .style: row
	1.2) computedStyle: row
----------------------------------------
2) Set grid-auto-flow to 'row dense'
	2.1) .style: row dense
	2.2) computedStyle: row dense
----------------------------------------
3) Set grid-auto-flow to 'dense row'
	3.1) .style: row dense
	3.2) computedStyle: row dense
----------------------------------------
4) Set grid-auto-flow to 'dense'
	4.1) .style: row dense
	4.2) computedStyle: row dense
----------------------------------------
5) Set grid-auto-flow to ''
	5.1) .style: 
	5.2) computedStyle: row

The implementations match in all the cases but 4.1) which is:

  • Firefox and Edge: row dense
  • Chrome and WebKit: dense

Which one is right (if any)?
And about the rest of the results, are they right? I guess they're right due to the Canonical order: per grammar but I'd like to confirm.

I'm asking this because we're upstreaming to WPT the Chromium/Blink tests and I realized that this one has a minor interoperability issue. 😃

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions