diff --git a/packages/emotion/src/index.js b/packages/emotion/src/index.js index d34425417..a27aeb056 100644 --- a/packages/emotion/src/index.js +++ b/packages/emotion/src/index.js @@ -147,7 +147,7 @@ function isLastCharDot(string) { let hash let name -const labelPattern = /label:\s*([^\s;\n]+)\s*[;\n]/g +const labelPattern = /label:\s*([^\s;\n{]+)\s*;/g function createStyles(strings, ...interpolations) { let stringMode = true diff --git a/packages/emotion/test/__snapshots__/label-pattern.test.js.snap b/packages/emotion/test/__snapshots__/label-pattern.test.js.snap new file mode 100644 index 000000000..ee4fe87e5 --- /dev/null +++ b/packages/emotion/test/__snapshots__/label-pattern.test.js.snap @@ -0,0 +1,17 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`label pattern input + label styled 1`] = ` +.glamor-0 + label::after { + color: pink; + background: orange; +} + +
+ + +
+`; diff --git a/packages/emotion/test/label-pattern.test.js b/packages/emotion/test/label-pattern.test.js new file mode 100644 index 000000000..064091b43 --- /dev/null +++ b/packages/emotion/test/label-pattern.test.js @@ -0,0 +1,28 @@ +import React from 'react' +import styled from 'react-emotion' +import renderer from 'react-test-renderer' +import { flush } from 'emotion' + +describe('label pattern', () => { + afterEach(() => flush()) + + test('input + label styled', () => { + const Input = styled.input` + & + label::after { + color: pink; + background: orange; + } + ` + + const tree = renderer + .create( +
+ + +
+ ) + .toJSON() + + expect(tree).toMatchSnapshot() + }) +})