diff --git a/__tests__/applyComplexClasses.test.js b/__tests__/applyComplexClasses.test.js index c4dd5ce48..f9fb36032 100644 --- a/__tests__/applyComplexClasses.test.js +++ b/__tests__/applyComplexClasses.test.js @@ -47,6 +47,53 @@ test('it copies class declarations into itself', () => { }) }) +test('apply values can contain tabs', () => { + const input = ` + .a { + @apply p-4\tm-4; + } + ` + + const expected = ` + .a { + margin: 1rem; + padding: 1rem; + } + ` + + expect.assertions(2) + + return run(input).then(result => { + expect(result.css).toMatchCss(expected) + expect(result.warnings().length).toBe(0) + }) +}) + +test('apply values can contain newlines', () => { + const input = ` + .a { + @apply p-4 m-4 + flex flex-col; + } + ` + + const expected = ` + .a { + display: flex; + flex-direction: column; + margin: 1rem; + padding: 1rem; + } + ` + + expect.assertions(2) + + return run(input).then(result => { + expect(result.css).toMatchCss(expected) + expect(result.warnings().length).toBe(0) + }) +}) + test('selectors with invalid characters do not need to be manually escaped', () => { const input = ` .a\\:1\\/2 { color: red; } diff --git a/src/flagged/applyComplexClasses.js b/src/flagged/applyComplexClasses.js index fe1ba1217..59316f77d 100644 --- a/src/flagged/applyComplexClasses.js +++ b/src/flagged/applyComplexClasses.js @@ -200,7 +200,7 @@ function processApplyAtRules(css, lookupTree, config) { importantEntries, applyUtilityNames, important = importantEntries.length > 0, - ] = _.partition(applyRule.params.split(' '), n => n === '!important') + ] = _.partition(applyRule.params.split(/[\s\t\n]+/g), n => n === '!important') const currentUtilityNames = extractUtilityNames(rule.selector)