diff --git a/__tests__/processPlugins.test.js b/__tests__/processPlugins.test.js index 09a422d6c..b7f3db639 100644 --- a/__tests__/processPlugins.test.js +++ b/__tests__/processPlugins.test.js @@ -314,3 +314,25 @@ test('the "@" sign is optional in at-rules', () => { } `) }) + +test('variants are optional when adding utilities', () => { + const [components, utilities] = processPlugins({ + plugins: [ + function ({ rule, addUtilities }) { + addUtilities([ + rule('.border-collapse', { + 'border-collapse': 'collapse' + }) + ]) + } + ], + }) + + expect(css(utilities)).toMatchCss(` + @variants { + .border-collapse { + border-collapse: collapse + } + } + `) +}) diff --git a/src/util/processPlugins.js b/src/util/processPlugins.js index 6b04297f5..6e2f49238 100644 --- a/src/util/processPlugins.js +++ b/src/util/processPlugins.js @@ -35,7 +35,7 @@ export default function(config) { rule: defineRule, atRule: defineAtRule, e: escapeClassName, - addUtilities: (utilities, variants) => { + addUtilities: (utilities, variants = []) => { pluginUtilities.push(wrapWithVariants(utilities, variants)) }, addComponents: components => {