diff --git a/__tests__/applyAtRule.test.js b/__tests__/applyAtRule.test.js new file mode 100644 index 000000000..652b44940 --- /dev/null +++ b/__tests__/applyAtRule.test.js @@ -0,0 +1,53 @@ +import postcss from 'postcss' +import plugin from '../src/lib/substituteClassApplyAtRules' + +function run(input, opts) { + return postcss([plugin(opts)]).process(input) +} + +test("it copies a class's declarations into itself", () => { + const output = '.a { color: red; } .b { color: red; }' + + return run('.a { color: red; } .b { @apply .a; }', {}).then(result => { + expect(result.css).toEqual(output) + expect(result.warnings().length).toBe(0) + }) +}) + +test("it doesn't copy a media query definition into itself", () => { + const output = `.a { + color: red; + } + + @media (min-width: 300px) { + .a { color: blue; } + } + + .b { + color: red; + }` + + return run( + `.a { + color: red; + } + + @media (min-width: 300px) { + .a { color: blue; } + } + + .b { + @apply .a; + }`, + {} + ).then(result => { + expect(result.css).toEqual(output) + expect(result.warnings().length).toBe(0) + }) +}) + +test('it fails if the class does not exist', () => { + run('.b { @apply .a; }', {}).catch(error => { + expect(error.reason).toEqual('No .a class found.') + }) +}) diff --git a/src/util/findMixin.js b/src/util/findMixin.js index d01aad233..b07372a4e 100644 --- a/src/util/findMixin.js +++ b/src/util/findMixin.js @@ -4,7 +4,7 @@ export default function findMixin(css, mixin, onError) { const matches = [] css.walkRules(rule => { - if (rule.selectors.includes(mixin)) { + if (rule.selectors.includes(mixin) && rule.parent.type == 'root') { matches.push(rule) } })