Bug 197067 – [css-grid] grid shorthand props contain invalid property values, same even when valid longhand property values provided

• Component: CSS
• Status: RESOLVED DUPLICATE

[Clint Ayres]

The following list of shorthand properties all exhibit the same error in that values stored in CSSStyleDeclaration object are invalid.

 - grid
 - grid-area
 - grid-column
 - grid-row
 - grid-template

Simple example for grid-area property:

```
const style = document.createElement('style');
document.head.appendChild(style);

style.sheet.insertRule('.surprise { grid-area: 1 / 2 / 3 / 4; }');
console.log(style.sheet.cssRules[0].style.gridArea);
```

expected:

```
> "1 / 2 / 3 / 4"
```

actual:

```
> "1 2 3 4"
```

The same type of issue occurs for each of the css grid shorthand properties. Seems possibly related to the char '/' but could be a bad signal too.

[Radar WebKit Bug Importer]

<rdar://problem/50068305>

[Javier Fernandez]

I'll take a look

[Oriol Brufau]

The '/' problem has been fixed in bug 204508.
Other problems will be addressed in bug 204611.

*** This bug has been marked as a duplicate of bug 204508 ***