Merge branch 'browner12-empty-variant'

tailwindlabs · May 7, 2021 · b6286c9 · b6286c9
2 parents 86e9c34 + ba1902b
commit b6286c9
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 0 deletions.
diff --git a/src/lib/substituteVariantsAtRules.js b/src/lib/substituteVariantsAtRules.js
@@ -133,6 +133,7 @@ const defaultVariantGenerators = (config) => ({
   last: generatePseudoClassVariant('last-child', 'last'),
   odd: generatePseudoClassVariant('nth-child(odd)', 'odd'),
   even: generatePseudoClassVariant('nth-child(even)', 'even'),
+  empty: generatePseudoClassVariant('empty'),
 })
 
 function prependStackableVariants(atRule, variants, stackableVariants) {

diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
@@ -806,6 +806,7 @@ module.exports = {
     'even',
     'visited',
     'checked',
+    'empty',
     'group-hover',
     'group-focus',
     'focus-within',

diff --git a/tests/variantsAtRule.test.js b/tests/variantsAtRule.test.js
@@ -431,6 +431,27 @@ test('it can generate even variants', () => {
   })
 })
 
+test('it can generate empty variants', () => {
+  const input = `
+    @variants empty {
+      .banana { color: yellow; }
+      .chocolate { color: brown; }
+    }
+  `
+
+  const output = `
+    .banana { color: yellow; }
+    .chocolate { color: brown; }
+    .empty\\:banana:empty { color: yellow; }
+    .empty\\:chocolate:empty { color: brown; }
+  `
+
+  return run(input).then((result) => {
+    expect(result.css).toMatchCss(output)
+    expect(result.warnings().length).toBe(0)
+  })
+})
+
 test('it can generate group-hover variants', () => {
   const input = `
     @variants group-hover {