cssinjs / cssinjs/jss

[bug] Docs say syntax one way, but output is another way.

Open
#845 11 comments 0 reactions 0 assignees View on GitHub
defect
Dominant language
JavaScript
Stars
7.1k
Forks
386
PR merge metrics
No merged PRs in 30d

Description

__Expected behavior:__

The docs on [Alternative syntax for space and comma separated values](http://cssinjs.org/json-api?v=v9.8.7#alternative-syntax-for-space-and-comma-separated-values) say that

```js
export default {
button: {
border: ['1px solid red', '1px solid blue'],
},
};
```

should compile to

```css
.button-0-1-179 {
border: 1px solid red, 1px solid blue;
}
```

__Describe the bug:__

But instead it is missing a comma, so the output looks like

```css
.button-0-1-179 {
border: 1px solid red 1px solid blue;
}
```

so there's either a bug with the docs, or a bug with the lib. Which one?

Note that the docs for [jss-extended Full syntax](http://cssinjs.org/jss-expand-full/?v=v5.3.0#using-arrays-for-space-separated-properties) conflict with the Core JSON syntax doc.

The output for

```js
a: {
border: [
// Numbers can become default unit automatically.
[1, 'solid', 'red'],
[1, 'solid', 'blue']
]
},
```

looks as expected, with a comma.

__Codesandbox link:__

Paste

```js
export default {
button: {
border: ['1px solid red', '1px solid blue'],
},
a: {
border: [
// Numbers can become default unit automatically.
[1, 'solid', 'red'],
[1, 'solid', 'blue']
]
},
};
```

into the [repl](http://cssinjs.org/repl).

(P.S. It would be neat if the repl updated the URL with a query so we can paste a repl URL and the visitor can see the same code, like the Babel repl).

__Versions (please complete the following information):__
- see repl

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.