Skip to content

Commit

Permalink
Fix composition of styles without a final semicolon in a declaration …
Browse files Browse the repository at this point in the history
…block (#1560)
  • Loading branch information
Andarist authored and emmatown committed Oct 23, 2019
1 parent 11bea3a commit 57a767e
Show file tree
Hide file tree
Showing 7 changed files with 45 additions and 3 deletions.
8 changes: 8 additions & 0 deletions .changeset/plenty-monkeys-accept/changes.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"releases": [
{ "name": "@emotion/core", "type": "patch" },
{ "name": "@emotion/serialize", "type": "patch" },
{ "name": "@emotion/styled", "type": "patch" }
],
"dependents": []
}
1 change: 1 addition & 0 deletions .changeset/plenty-monkeys-accept/changes.md
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Fix composition of styles without a final semicolon in a declaration block
13 changes: 13 additions & 0 deletions packages/core/__tests__/__snapshots__/css.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,19 @@ exports[`handles camelCased custom properties in object styles properly 1`] = `
/>
`;

exports[`handles composition of styles without a final semi in a declaration block 1`] = `
.emotion-0 {
color: hotpink;
background-color: green;
}
<div
className="emotion-0"
>
I'm hotpink on the green background.
</div>
`;

exports[`label in css call 1`] = `
.emotion-0 {
color: hotpink;
Expand Down
2 changes: 1 addition & 1 deletion packages/core/__tests__/__snapshots__/keyframes.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ exports[`keyframes keyframes used in css call 1`] = `

exports[`keyframes keyframes used in css call 2`] = `
Array [
".css-1jqzi3u{-webkit-animation:animation-1bi8wtt 1s animation-1ajb83a;animation:animation-1bi8wtt 1s animation-1ajb83a;}",
".css-nq4jxu{-webkit-animation:animation-1bi8wtt 1s animation-1ajb83a;animation:animation-1bi8wtt 1s animation-1ajb83a;}",
"@-webkit-keyframes animation-1bi8wtt{from{color:green;}to{color:hotpink;}}",
"@keyframes animation-1bi8wtt{from{color:green;}to{color:hotpink;}}",
"@-webkit-keyframes animation-1ajb83a{from{color:green;}to{color:yellow;}}",
Expand Down
20 changes: 20 additions & 0 deletions packages/core/__tests__/css.js
Original file line number Diff line number Diff line change
Expand Up @@ -236,3 +236,23 @@ test('applies class when css prop is set to nil on wrapper component', () => {

expect(tree.toJSON()).toMatchSnapshot()
})

test('handles composition of styles without a final semi in a declaration block', () => {
const tree = renderer.create(
<div
css={[
// prettier-ignore
css`
color: hotpink
`,
css`
background-color: green;
`
]}
>
{"I'm hotpink on the green background."}
</div>
)

expect(tree.toJSON()).toMatchSnapshot()
})
2 changes: 1 addition & 1 deletion packages/serialize/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -168,7 +168,7 @@ function handleInterpolation(
next = next.next
}
}
let styles = interpolation.styles
let styles = `${interpolation.styles};`
if (
process.env.NODE_ENV !== 'production' &&
interpolation.map !== undefined
Expand Down
2 changes: 1 addition & 1 deletion packages/styled/test/__snapshots__/source-map.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ exports[`inserts source map 1`] = `
data-emotion="css"
>
.css-1igngve-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiLy8gQGZsb3dcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHJlbmRlcmVyIGZyb20gJ3JlYWN0LXRlc3QtcmVuZGVyZXInXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIHJlbmRlcmVyLmNyZWF0ZSg8Q29tcCAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
.css-1hytkh9-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiLy8gQGZsb3dcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHJlbmRlcmVyIGZyb20gJ3JlYWN0LXRlc3QtcmVuZGVyZXInXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIHJlbmRlcmVyLmNyZWF0ZSg8Q29tcCAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
</style>
</head>
<body />
Expand Down

0 comments on commit 57a767e

Please sign in to comment.