fix: #307

w-screen + h-screen ≠ size-screen

lib/rules/enforces-shorthand.js

@@ -243,7 +243,11 @@ module.exports = {
           }
           // Test if the body of the class matches, eg. 'h-' inside 'h-10'
           if (mode === 'value') {
-            return inputSet.some((inputClassPattern) => inputClassPattern === remainingClass.body);
+            const bodyMatch = inputSet.some((inputClassPattern) => inputClassPattern === remainingClass.body);
+            // w-screen + h-screen ≠ size-screen (Issue #307)
+            const validValue =
+              bodyMatch && !(['w-', 'h-'].includes(remainingClass.body) && ['screen'].includes(remainingClass.value));
+            return validValue;
           }
         });
 

lib/util/groupMethods.js

@@ -486,8 +486,8 @@ function getSuffix(className, separator = ':') {
 /**
  * Find the group of a classname
  *
- * @param {String} name Classname to be find using patterns
- * @param {Array} group The group bein tested
+ * @param {String} name Classname to be find using patterns (without modifiers)
+ * @param {Array} group The group being tested
  * @param {Object} config Tailwind CSS config
  * @param {String} parentType The name of the parent group
  * @returns {Object} The infos

package.json

@@ -18,7 +18,6 @@
   "bugs": "https://github.com/francoismassart/eslint-plugin-tailwindcss/issues",
   "main": "lib/index.js",
   "scripts": {
-    "wip": "mocha tests/lib/rules/no-arbitrary-value.js",
     "test": "mocha tests --recursive"
   },
   "files": [

tests/lib/rules/enforces-shorthand.js

@@ -129,6 +129,9 @@ ruleTester.run("shorthands", rule, {
     {
       code: "<div className={`absolute inset-y-0 left-0 w-1/3 rounded-[inherit] shadow-lg ${className}`}>issue #312</div>",
     },
+    {
+      code: "<div className={'w-screen h-screen'}>issue #307</div>",
+    },
   ],
 
   invalid: [