@nordcraft/search 1.0.59 → 1.0.61

package/dist/rules/issues/dom/createRequiredElementAttributeRule.js

@@ -1,5 +1,14 @@
-import { isDefined } from '@nordcraft/core/dist/utils/util';
+import { isDefined, toBoolean } from '@nordcraft/core/dist/utils/util';
+import { contextlessEvaluateFormula } from '../../../util/contextlessEvaluateFormula';
+/**
+ * @param tag - The HTML tag of the element to check (e.g., 'img', 'a').
+ * @param attribute - The required attribute that must be present on the element (e.g., 'alt', 'href'). Can also be an array of attributes to check where any one being present is sufficient. Only the first attribute will be reported in the issue details.
+ * @param level - The severity level of the issue ('warning' by default).
+ * @param allowEmptyString - Whether to allow the attribute to be an empty string (false by default).
+ * @returns An issue rule that reports when an element of the specified tag is missing the specified attribute.
+ */
 export function createRequiredElementAttributeRule({ tag, attribute, level = 'warning', allowEmptyString = false, }) {
+    const mainAttribute = Array.isArray(attribute) ? attribute[0] : attribute;
     return {
         code: 'required element attribute',
         level: level,
@@ -8,19 +17,23 @@ export function createRequiredElementAttributeRule({ tag, attribute, level = 'wa
             if (nodeType === 'component-node' &&
                 value.type === 'element' &&
                 value.tag === tag) {
-                const attributeValue = value.attrs[attribute];
-                // Report the missing attribute if it is not defined or statically empty/nullish
-                if (!isDefined(attributeValue)) {
-                    return report(path, { tag, attribute });
-                }
-                if (attributeValue.type === 'value') {
-                    if (!isDefined(attributeValue.value)) {
-                        return report(path, { tag, attribute });
-                    }
-                    if (!allowEmptyString && attributeValue.value === '') {
-                        return report(path, { tag, attribute });
+                const attributes = Array.isArray(attribute) ? attribute : [attribute];
+                if (attributes.some((attr) => {
+                    if (!isDefined(value.attrs[attr])) {
+                        return false;
                     }
+                    const { isStatic, result } = contextlessEvaluateFormula(value.attrs[attr]);
+                    return (
+                    // Dynamic attributes are considered valid
+                    !isStatic ||
+                        // Static attributes must be truthy as falsy values are not rendered
+                        (isDefined(result) &&
+                            toBoolean(result) &&
+                            (allowEmptyString || result !== '')));
+                })) {
+                    return;
                 }
+                report(path, { tag, attribute: mainAttribute });
             }
         },
     };

package/dist/rules/issues/dom/createRequiredElementAttributeRule.js.map

@@ -1 +1 @@
-{"version":3,"file":"createRequiredElementAttributeRule.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/createRequiredElementAttributeRule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAA;AAG3D,MAAM,UAAU,kCAAkC,CAAC,EACjD,GAAG,EACH,SAAS,EACT,KAAK,GAAG,SAAS,EACjB,gBAAgB,GAAG,KAAK,GAMzB;IAIC,OAAO;QACL,IAAI,EAAE,4BAA4B;QAClC,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,eAAe;QACzB,KAAK,EAAE,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;YAC3C,IACE,QAAQ,KAAK,gBAAgB;gBAC7B,KAAK,CAAC,IAAI,KAAK,SAAS;gBACxB,KAAK,CAAC,GAAG,KAAK,GAAG,EACjB,CAAC;gBACD,MAAM,cAAc,GAAG,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;gBAC7C,gFAAgF;gBAChF,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,CAAC;oBAC/B,OAAO,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;gBACzC,CAAC;gBACD,IAAI,cAAc,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;oBACpC,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;wBACrC,OAAO,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;oBACzC,CAAC;oBACD,IAAI,CAAC,gBAAgB,IAAI,cAAc,CAAC,KAAK,KAAK,EAAE,EAAE,CAAC;wBACrD,OAAO,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAA;oBACzC,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;KACF,CAAA;AACH,CAAC"}
+{"version":3,"file":"createRequiredElementAttributeRule.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/createRequiredElementAttributeRule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAA;AAEtE,OAAO,EAAE,0BAA0B,EAAE,MAAM,0CAA0C,CAAA;AAErF;;;;;;GAMG;AACH,MAAM,UAAU,kCAAkC,CAAC,EACjD,GAAG,EACH,SAAS,EACT,KAAK,GAAG,SAAS,EACjB,gBAAgB,GAAG,KAAK,GAMzB;IAIC,MAAM,aAAa,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IACzE,OAAO;QACL,IAAI,EAAE,4BAA4B;QAClC,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,eAAe;QACzB,KAAK,EAAE,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;YAC3C,IACE,QAAQ,KAAK,gBAAgB;gBAC7B,KAAK,CAAC,IAAI,KAAK,SAAS;gBACxB,KAAK,CAAC,GAAG,KAAK,GAAG,EACjB,CAAC;gBACD,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;gBACrE,IACE,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;oBACvB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;wBAClC,OAAO,KAAK,CAAA;oBACd,CAAC;oBACD,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,0BAA0B,CACrD,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAClB,CAAA;oBACD,OAAO;oBACL,0CAA0C;oBAC1C,CAAC,QAAQ;wBACT,oEAAoE;wBACpE,CAAC,SAAS,CAAC,MAAM,CAAC;4BAChB,SAAS,CAAC,MAAM,CAAC;4BACjB,CAAC,gBAAgB,IAAI,MAAM,KAAK,EAAE,CAAC,CAAC,CACvC,CAAA;gBACH,CAAC,CAAC,EACF,CAAC;oBACD,OAAM;gBACR,CAAC;gBAED,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC,CAAA;YACjD,CAAC;QACH,CAAC;KACF,CAAA;AACH,CAAC"}

package/dist/rules/issues/dom/createRequiredElementAttributeRule.test.js

@@ -144,5 +144,98 @@ describe('requiredElementAttributeRule', () => {
         }));
         expect(problems).toHaveLength(0);
     });
+    test('should report if attribute is false or null, as such attributes are not rendered', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    alt: { type: 'value', value: null },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {},
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                    test2: {
+                        name: 'test2',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    alt: { type: 'value', value: false },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {},
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [
+                createRequiredElementAttributeRule({ tag: 'img', attribute: 'alt' }),
+            ],
+        }));
+        expect(problems).toHaveLength(2);
+        expect(problems[0].code).toBe('required element attribute');
+        expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root']);
+        expect(problems[1].code).toBe('required element attribute');
+        expect(problems[1].path).toEqual(['components', 'test2', 'nodes', 'root']);
+    });
+    test('should handle multiple acceptable attributes', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    'aria-hidden': { type: 'value', value: 'true' },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'a',
+                                children: [],
+                                style: {},
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [
+                createRequiredElementAttributeRule({
+                    tag: 'a',
+                    attribute: ['alt', 'aria-hidden'],
+                }),
+            ],
+        }));
+        expect(problems).toHaveLength(0);
+    });
 });
 //# sourceMappingURL=createRequiredElementAttributeRule.test.js.map

package/dist/rules/issues/dom/createRequiredElementAttributeRule.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"createRequiredElementAttributeRule.test.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/createRequiredElementAttributeRule.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AACtD,OAAO,EAAE,kCAAkC,EAAE,MAAM,sCAAsC,CAAA;AAEzF,QAAQ,CAAC,8BAA8B,EAAE,GAAG,EAAE;IAC5C,IAAI,CAAC,kDAAkD,EAAE,GAAG,EAAE;QAC5D,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CACzB,aAAa,CAAC;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,UAAU,EAAE;oBACV,IAAI,EAAE;wBACJ,IAAI,EAAE,MAAM;wBACZ,KAAK,EAAE;4BACL,IAAI,EAAE;gCACJ,IAAI,EAAE,SAAS;gCACf,KAAK,EAAE,EAAE;gCACT,OAAO,EAAE,EAAE;gCACX,MAAM,EAAE,EAAE;gCACV,GAAG,EAAE,KAAK;gCACV,QAAQ,EAAE,EAAE;gCACZ,KAAK,EAAE,EAAE;6BACV;yBACF;wBACD,QAAQ,EAAE,EAAE;wBACZ,IAAI,EAAE,EAAE;wBACR,UAAU,EAAE,EAAE;wBACd,SAAS,EAAE,EAAE;qBACd;iBACF;aACF;YACD,KAAK,EAAE;gBACL,kCAAkC,CAAC;oBACjC,GAAG,EAAE,KAAK;oBACV,SAAS,EAAE,KAAK;oBAChB,gBAAgB,EAAE,IAAI;iBACvB,CAAC;aACH;SACF,CAAC,CACH,CAAA;QAED,MAAM,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAA;QAChC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,4BAA4B,CAAC,CAAA;QAC3D,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,CAAA;IAC3E,CAAC,CAAC,CAAA;IACF,IAAI,CAAC,gDAAgD,EAAE,GAAG,EAAE;QAC1D,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CACzB,aAAa,CAAC;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,UAAU,EAAE;oBACV,IAAI,EAAE;wBACJ,IAAI,EAAE,MAAM;wBACZ,KAAK,EAAE;4BACL,IAAI,EAAE;gCACJ,IAAI,EAAE,SAAS;gCACf,KAAK,EAAE;oCACL,GAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;iCAClC;gCACD,OAAO,EAAE,EAAE;gCACX,MAAM,EAAE,EAAE;gCACV,GAAG,EAAE,KAAK;gCACV,QAAQ,EAAE,EAAE;gCACZ,KAAK,EAAE,EAAE;6BACV;yBACF;wBACD,QAAQ,EAAE,EAAE;wBACZ,IAAI,EAAE,EAAE;wBACR,UAAU,EAAE,EAAE;wBACd,SAAS,EAAE,EAAE;qBACd;iBACF;aACF;YACD,KAAK,EAAE;gBACL,kCAAkC,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;aACrE;SACF,CAAC,CACH,CAAA;QAED,MAAM,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAA;QAChC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,4BAA4B,CAAC,CAAA;QAC3D,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,CAAA;IAC3E,CAAC,CAAC,CAAA;IACF,IAAI,CAAC,kEAAkE,EAAE,GAAG,EAAE;QAC5E,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CACzB,aAAa,CAAC;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,UAAU,EAAE;oBACV,IAAI,EAAE;wBACJ,IAAI,EAAE,MAAM;wBACZ,KAAK,EAAE;4BACL,IAAI,EAAE;gCACJ,IAAI,EAAE,SAAS;gCACf,KAAK,EAAE;oCACL,GAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;iCAClC;gCACD,OAAO,EAAE,EAAE;gCACX,MAAM,EAAE,EAAE;gCACV,GAAG,EAAE,KAAK;gCACV,QAAQ,EAAE,EAAE;gCACZ,KAAK,EAAE,EAAE;6BACV;yBACF;wBACD,QAAQ,EAAE,EAAE;wBACZ,IAAI,EAAE,EAAE;wBACR,UAAU,EAAE,EAAE;wBACd,SAAS,EAAE,EAAE;qBACd;iBACF;aACF;YACD,KAAK,EAAE;gBACL,kCAAkC,CAAC;oBACjC,GAAG,EAAE,KAAK;oBACV,SAAS,EAAE,KAAK;oBAChB,gBAAgB,EAAE,IAAI;iBACvB,CAAC;aACH;SACF,CAAC,CACH,CAAA;QAED,MAAM,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAA;IAClC,CAAC,CAAC,CAAA;IACF,IAAI,CAAC,qEAAqE,EAAE,GAAG,EAAE;QAC/E,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CACzB,aAAa,CAAC;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,UAAU,EAAE;oBACV,IAAI,EAAE;wBACJ,IAAI,EAAE,MAAM;wBACZ,KAAK,EAAE;4BACL,IAAI,EAAE;gCACJ,IAAI,EAAE,SAAS;gCACf,KAAK,EAAE;oCACL,GAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;iCACtC;gCACD,OAAO,EAAE,EAAE;gCACX,MAAM,EAAE,EAAE;gCACV,GAAG,EAAE,KAAK;gCACV,QAAQ,EAAE,EAAE;gCACZ,KAAK,EAAE,EAAE;6BACV;yBACF;wBACD,QAAQ,EAAE,EAAE;wBACZ,IAAI,EAAE,EAAE;wBACR,UAAU,EAAE,EAAE;wBACd,SAAS,EAAE,EAAE;qBACd;iBACF;aACF;YACD,KAAK,EAAE;gBACL,kCAAkC,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;aACrE;SACF,CAAC,CACH,CAAA;QAED,MAAM,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAA;IAClC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}
+{"version":3,"file":"createRequiredElementAttributeRule.test.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/createRequiredElementAttributeRule.test.ts"],"names":[],"mappings":"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"}

package/dist/rules/issues/dom/domRules.index.js

@@ -13,7 +13,7 @@ export default [
     }),
     createRequiredElementAttributeRule({
         tag: 'img',
-        attribute: 'alt',
+        attribute: ['alt', 'aria-hidden'],
         allowEmptyString: true,
     }),
     createRequiredElementAttributeRule({

package/dist/rules/issues/dom/domRules.index.js.map

@@ -1 +1 @@
-{"version":3,"file":"domRules.index.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/domRules.index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAA;AAC/E,OAAO,EAAE,8BAA8B,EAAE,MAAM,kCAAkC,CAAA;AACjF,OAAO,EAAE,kCAAkC,EAAE,MAAM,sCAAsC,CAAA;AACzF,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,EAAE,oCAAoC,EAAE,MAAM,wCAAwC,CAAA;AAC7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AAEnE,eAAe;IACb,uBAAuB;IACvB,kCAAkC,CAAC;QACjC,GAAG,EAAE,GAAG;QACR,SAAS,EAAE,MAAM;KAClB,CAAC;IACF,kCAAkC,CAAC;QACjC,GAAG,EAAE,KAAK;QACV,SAAS,EAAE,KAAK;QAChB,gBAAgB,EAAE,IAAI;KACvB,CAAC;IACF,kCAAkC,CAAC;QACjC,GAAG,EAAE,KAAK;QACV,SAAS,EAAE,KAAK;KACjB,CAAC;IACF,yBAAyB,CAAC,aAAa,CAAC;IACxC,yBAAyB,CAAC,OAAO,CAAC;IAClC,6BAA6B,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;IACzE,8BAA8B,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACpD,oFAAoF;IACpF,6BAA6B,CAC3B,CAAC,OAAO,CAAC,EACT,CAAC,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,CACzD;IACD,oFAAoF;IACpF,oFAAoF;IACpF,oFAAoF;IACpF,8BAA8B,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IACtE,iFAAiF;IACjF,6BAA6B,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;IACzE,iFAAiF;IACjF,iFAAiF;IACjF,8BAA8B,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACpD,qFAAqF;IACrF,6BAA6B,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;IACvE,uFAAuF;IACvF,6BAA6B,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IACvD,qFAAqF;IACrF,8BAA8B,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IACxD,iFAAiF;IACjF,6BAA6B,CAC3B,CAAC,IAAI,CAAC,EACN,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC1C;IACD,oCAAoC;IACpC,yBAAyB;CAC1B,CAAA"}
+{"version":3,"file":"domRules.index.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/domRules.index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAA;AAC/E,OAAO,EAAE,8BAA8B,EAAE,MAAM,kCAAkC,CAAA;AACjF,OAAO,EAAE,kCAAkC,EAAE,MAAM,sCAAsC,CAAA;AACzF,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,EAAE,oCAAoC,EAAE,MAAM,wCAAwC,CAAA;AAC7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AAEnE,eAAe;IACb,uBAAuB;IACvB,kCAAkC,CAAC;QACjC,GAAG,EAAE,GAAG;QACR,SAAS,EAAE,MAAM;KAClB,CAAC;IACF,kCAAkC,CAAC;QACjC,GAAG,EAAE,KAAK;QACV,SAAS,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC;QACjC,gBAAgB,EAAE,IAAI;KACvB,CAAC;IACF,kCAAkC,CAAC;QACjC,GAAG,EAAE,KAAK;QACV,SAAS,EAAE,KAAK;KACjB,CAAC;IACF,yBAAyB,CAAC,aAAa,CAAC;IACxC,yBAAyB,CAAC,OAAO,CAAC;IAClC,6BAA6B,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;IACzE,8BAA8B,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACpD,oFAAoF;IACpF,6BAA6B,CAC3B,CAAC,OAAO,CAAC,EACT,CAAC,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,CACzD;IACD,oFAAoF;IACpF,oFAAoF;IACpF,oFAAoF;IACpF,8BAA8B,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IACtE,iFAAiF;IACjF,6BAA6B,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;IACzE,iFAAiF;IACjF,iFAAiF;IACjF,8BAA8B,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACpD,qFAAqF;IACrF,6BAA6B,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;IACvE,uFAAuF;IACvF,6BAA6B,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IACvD,qFAAqF;IACrF,8BAA8B,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IACxD,iFAAiF;IACjF,6BAA6B,CAC3B,CAAC,IAAI,CAAC,EACN,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC1C;IACD,oCAAoC;IACpC,yBAAyB;CAC1B,CAAA"}

package/dist/rules/issues/dom/imageWithoutDimensionRule.js

@@ -1,4 +1,6 @@
 import { isDefined } from '@nordcraft/core/dist/utils/util';
+import { contextlessEvaluateFormula } from '../../../util/contextlessEvaluateFormula';
+const nonStaticDimensionKeywords = ['', 'auto'];
 /**
  * Lighthouse reports a similar issue:
  * https://web.dev/articles/optimize-cls?utm_source=lighthouse&utm_medium=devtools#images_without_dimensions
@@ -13,28 +15,44 @@ export const imageWithoutDimensionRule = {
             !['img', 'source'].includes(value.tag)) {
             return;
         }
-        // Aspect ratio can be calculated from width and height attributes
-        if (isDefined(value.attrs.width) && isDefined(value.attrs.height)) {
-            return;
+        let hasValidWidth = false;
+        let hasValidHeight = false;
+        let hasValidAspectRatio = false;
+        if (isDefined(value.attrs.width)) {
+            const widthEval = contextlessEvaluateFormula(value.attrs.width);
+            // If dynamic, we assume it is valid
+            hasValidWidth ||= !widthEval.isStatic || checkValue(widthEval.result);
+        }
+        if (isDefined(value.attrs.height)) {
+            const heightEval = contextlessEvaluateFormula(value.attrs.height);
+            // If dynamic, we assume it is valid
+            hasValidHeight ||= !heightEval.isStatic || checkValue(heightEval.result);
         }
-        if ([
+        ;
+        [
             value.style,
-            // We don't know the circumstances under which the style is applied, so we assume it is Okay if just one of the variants has correct style
+            // We don't know the circumstances under which the style is applied, so we assume it is fine if just one of the variants has correct dimensions
             ...(value.variants?.map((variant) => variant.style) ?? []),
-        ].some((style) => {
-            // Aspect ratio is not required if width and height are fixed
-            if (isDefined(style.width) && isDefined(style.height)) {
-                return true;
-            }
-            // Aspect ratio is set explicitly
-            if (isDefined(style['aspect-ratio'])) {
-                return true;
-            }
-            return false;
-        })) {
+        ].forEach((style) => {
+            hasValidWidth ||= checkValue(style?.width);
+            hasValidHeight ||= checkValue(style?.height);
+            hasValidAspectRatio ||= checkValue(style?.['aspect-ratio']);
+        });
+        // If two of the three values are truthy, the third can be derived
+        if ([hasValidWidth, hasValidHeight, hasValidAspectRatio].filter(Boolean)
+            .length >= 2) {
             return;
         }
         report(path);
     },
 };
+function checkValue(value) {
+    if (!isDefined(value)) {
+        return false;
+    }
+    if (nonStaticDimensionKeywords.includes(value)) {
+        return false;
+    }
+    return true;
+}
 //# sourceMappingURL=imageWithoutDimensionRule.js.map

package/dist/rules/issues/dom/imageWithoutDimensionRule.js.map

@@ -1 +1 @@
-{"version":3,"file":"imageWithoutDimensionRule.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/imageWithoutDimensionRule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAA;AAG3D;;;GAGG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAS;IAC7C,IAAI,EAAE,yBAAyB;IAC/B,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,aAAa;IACvB,KAAK,EAAE,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;QAC3C,IACE,QAAQ,KAAK,gBAAgB;YAC7B,KAAK,CAAC,IAAI,KAAK,SAAS;YACxB,CAAC,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EACtC,CAAC;YACD,OAAM;QACR,CAAC;QAED,kEAAkE;QAClE,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;YAClE,OAAM;QACR,CAAC;QAED,IACE;YACE,KAAK,CAAC,KAAK;YACX,0IAA0I;YAC1I,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;SAC3D,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE;YACf,6DAA6D;YAC7D,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;gBACtD,OAAO,IAAI,CAAA;YACb,CAAC;YAED,iCAAiC;YACjC,IAAI,SAAS,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC;gBACrC,OAAO,IAAI,CAAA;YACb,CAAC;YAED,OAAO,KAAK,CAAA;QACd,CAAC,CAAC,EACF,CAAC;YACD,OAAM;QACR,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,CAAA;IACd,CAAC;CACF,CAAA"}
+{"version":3,"file":"imageWithoutDimensionRule.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/imageWithoutDimensionRule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAA;AAE3D,OAAO,EAAE,0BAA0B,EAAE,MAAM,0CAA0C,CAAA;AAErF,MAAM,0BAA0B,GAAG,CAAC,EAAE,EAAE,MAAM,CAAC,CAAA;AAC/C;;;GAGG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAS;IAC7C,IAAI,EAAE,yBAAyB;IAC/B,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,aAAa;IACvB,KAAK,EAAE,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;QAC3C,IACE,QAAQ,KAAK,gBAAgB;YAC7B,KAAK,CAAC,IAAI,KAAK,SAAS;YACxB,CAAC,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EACtC,CAAC;YACD,OAAM;QACR,CAAC;QAED,IAAI,aAAa,GAAG,KAAK,CAAA;QACzB,IAAI,cAAc,GAAG,KAAK,CAAA;QAC1B,IAAI,mBAAmB,GAAG,KAAK,CAAA;QAE/B,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YACjC,MAAM,SAAS,GAAG,0BAA0B,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;YAC/D,oCAAoC;YACpC,aAAa,KAAK,CAAC,SAAS,CAAC,QAAQ,IAAI,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;QACvE,CAAC;QAED,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;YAClC,MAAM,UAAU,GAAG,0BAA0B,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;YACjE,oCAAoC;YACpC,cAAc,KAAK,CAAC,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,UAAU,CAAC,MAAM,CAAC,CAAA;QAC1E,CAAC;QAED,CAAC;QAAA;YACC,KAAK,CAAC,KAAK;YACX,+IAA+I;YAC/I,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;SAC3D,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;YAClB,aAAa,KAAK,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;YAC1C,cAAc,KAAK,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;YAC5C,mBAAmB,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC,cAAc,CAAC,CAAC,CAAA;QAC7D,CAAC,CAAC,CAAA;QAEF,kEAAkE;QAClE,IACE,CAAC,aAAa,EAAE,cAAc,EAAE,mBAAmB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;aACjE,MAAM,IAAI,CAAC,EACd,CAAC;YACD,OAAM;QACR,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,CAAA;IACd,CAAC;CACF,CAAA;AAED,SAAS,UAAU,CAAC,KAAsB;IACxC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;QACtB,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,0BAA0B,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;QAC/C,OAAO,KAAK,CAAA;IACd,CAAC;IAED,OAAO,IAAI,CAAA;AACb,CAAC"}

package/dist/rules/issues/dom/imageWithoutDimensionRule.test.js

@@ -143,5 +143,204 @@ describe('imageWithoutDimensionRule', () => {
         expect(problems[0].code).toBe('image without dimension');
         expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root']);
     });
+    test('should report if only aspect-ratio is set', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {},
+                                classes: {},
+                                events: {},
+                                tag: 'source',
+                                children: [],
+                                style: {
+                                    'aspect-ratio': '16/9',
+                                },
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [imageWithoutDimensionRule],
+        }));
+        expect(problems).toHaveLength(1);
+        expect(problems[0].code).toBe('image without dimension');
+        expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root']);
+    });
+    test('should not report if aspect-ratio and one dimension is set', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    width: {
+                                        type: 'value',
+                                        value: '100',
+                                    },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {
+                                    'aspect-ratio': '16/9',
+                                },
+                            },
+                            other: {
+                                type: 'element',
+                                attrs: {},
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {
+                                    height: '200px',
+                                    'aspect-ratio': '4/3',
+                                },
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [imageWithoutDimensionRule],
+        }));
+        expect(problems).toHaveLength(0);
+    });
+    test('should not report if dimensions are dynamic', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    width: {
+                                        type: 'path',
+                                        path: ['Variables', 'imageWidth'],
+                                    },
+                                    height: {
+                                        type: 'path',
+                                        path: ['Variables', 'imageHeight'],
+                                    },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {},
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [imageWithoutDimensionRule],
+        }));
+        expect(problems).toHaveLength(0);
+    });
+    test('should not report non-image elements', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {},
+                                classes: {},
+                                events: {},
+                                tag: 'div',
+                                children: [],
+                                style: {},
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [imageWithoutDimensionRule],
+        }));
+        expect(problems).toHaveLength(0);
+    });
+    test('should report if dimensions are set to non-static keywords (auto | empty string)', () => {
+        const problems = Array.from(searchProject({
+            files: {
+                formulas: {},
+                components: {
+                    test: {
+                        name: 'test',
+                        nodes: {
+                            root: {
+                                type: 'element',
+                                attrs: {
+                                    width: {
+                                        type: 'value',
+                                        value: 'auto',
+                                    },
+                                },
+                                classes: {},
+                                events: {},
+                                tag: 'img',
+                                children: [],
+                                style: {
+                                    height: '',
+                                },
+                            },
+                            other: {
+                                type: 'element',
+                                attrs: {},
+                                classes: {},
+                                events: {},
+                                tag: 'source',
+                                children: [],
+                                style: {
+                                    width: '100%',
+                                    'aspect-ratio': 'auto',
+                                },
+                            },
+                        },
+                        formulas: {},
+                        apis: {},
+                        attributes: {},
+                        variables: {},
+                    },
+                },
+            },
+            rules: [imageWithoutDimensionRule],
+        }));
+        expect(problems).toHaveLength(2);
+        expect(problems[0].code).toBe('image without dimension');
+        expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root']);
+        expect(problems[1].path).toEqual(['components', 'test', 'nodes', 'other']);
+    });
 });
 //# sourceMappingURL=imageWithoutDimensionRule.test.js.map

package/dist/rules/issues/dom/imageWithoutDimensionRule.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"imageWithoutDimensionRule.test.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/imageWithoutDimensionRule.test.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"imageWithoutDimensionRule.test.js","sourceRoot":"","sources":["../../../../src/rules/issues/dom/imageWithoutDimensionRule.test.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -5,8 +5,8 @@
 "license": "Apache-2.0",
 "homepage": "https://github.com/nordcraftengine/nordcraft",
 "dependencies": {
-"@nordcraft/ssr": "1.0.59",
-"@nordcraft/core": "1.0.59",
+"@nordcraft/ssr": "1.0.61",
+"@nordcraft/core": "1.0.61",
 "jsondiffpatch": "0.7.3",
 "postcss": "8.5.6"
 },
@@ -20,5 +20,5 @@
 "test:watch:only": "bun test --watch --only"
 },
 "files": ["dist", "src"],
-"version": "1.0.59"
+"version": "1.0.61"
 }

package/src/rules/issues/dom/createRequiredElementAttributeRule.test.ts

@@ -157,4 +157,105 @@ describe('requiredElementAttributeRule', () => {
 
     expect(problems).toHaveLength(0)
   })
+
+  test('should report if attribute is false or null, as such attributes are not rendered', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    alt: { type: 'value', value: null },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {},
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+            test2: {
+              name: 'test2',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    alt: { type: 'value', value: false },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {},
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [
+          createRequiredElementAttributeRule({ tag: 'img', attribute: 'alt' }),
+        ],
+      }),
+    )
+
+    expect(problems).toHaveLength(2)
+    expect(problems[0].code).toBe('required element attribute')
+    expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root'])
+    expect(problems[1].code).toBe('required element attribute')
+    expect(problems[1].path).toEqual(['components', 'test2', 'nodes', 'root'])
+  })
+
+  test('should handle multiple acceptable attributes', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    'aria-hidden': { type: 'value', value: 'true' },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'a',
+                  children: [],
+                  style: {},
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [
+          createRequiredElementAttributeRule({
+            tag: 'a',
+            attribute: ['alt', 'aria-hidden'],
+          }),
+        ],
+      }),
+    )
+
+    expect(problems).toHaveLength(0)
+  })
 })

package/src/rules/issues/dom/createRequiredElementAttributeRule.ts

@@ -1,6 +1,14 @@
-import { isDefined } from '@nordcraft/core/dist/utils/util'
+import { isDefined, toBoolean } from '@nordcraft/core/dist/utils/util'
 import type { Level, Rule } from '../../../types'
+import { contextlessEvaluateFormula } from '../../../util/contextlessEvaluateFormula'
 
+/**
+ * @param tag - The HTML tag of the element to check (e.g., 'img', 'a').
+ * @param attribute - The required attribute that must be present on the element (e.g., 'alt', 'href'). Can also be an array of attributes to check where any one being present is sufficient. Only the first attribute will be reported in the issue details.
+ * @param level - The severity level of the issue ('warning' by default).
+ * @param allowEmptyString - Whether to allow the attribute to be an empty string (false by default).
+ * @returns An issue rule that reports when an element of the specified tag is missing the specified attribute.
+ */
 export function createRequiredElementAttributeRule({
   tag,
   attribute,
@@ -8,13 +16,14 @@ export function createRequiredElementAttributeRule({
   allowEmptyString = false,
 }: {
   tag: string
-  attribute: string
+  attribute: string | string[]
   level?: Level
   allowEmptyString?: boolean
 }): Rule<{
   tag: string
   attribute: string
 }> {
+  const mainAttribute = Array.isArray(attribute) ? attribute[0] : attribute
   return {
     code: 'required element attribute',
     level: level,
@@ -25,19 +34,29 @@ export function createRequiredElementAttributeRule({
         value.type === 'element' &&
         value.tag === tag
       ) {
-        const attributeValue = value.attrs[attribute]
-        // Report the missing attribute if it is not defined or statically empty/nullish
-        if (!isDefined(attributeValue)) {
-          return report(path, { tag, attribute })
-        }
-        if (attributeValue.type === 'value') {
-          if (!isDefined(attributeValue.value)) {
-            return report(path, { tag, attribute })
-          }
-          if (!allowEmptyString && attributeValue.value === '') {
-            return report(path, { tag, attribute })
-          }
+        const attributes = Array.isArray(attribute) ? attribute : [attribute]
+        if (
+          attributes.some((attr) => {
+            if (!isDefined(value.attrs[attr])) {
+              return false
+            }
+            const { isStatic, result } = contextlessEvaluateFormula(
+              value.attrs[attr],
+            )
+            return (
+              // Dynamic attributes are considered valid
+              !isStatic ||
+              // Static attributes must be truthy as falsy values are not rendered
+              (isDefined(result) &&
+                toBoolean(result) &&
+                (allowEmptyString || result !== ''))
+            )
+          })
+        ) {
+          return
         }
+
+        report(path, { tag, attribute: mainAttribute })
       }
     },
   }

package/src/rules/issues/dom/domRules.index.ts

@@ -14,7 +14,7 @@ export default [
   }),
   createRequiredElementAttributeRule({
     tag: 'img',
-    attribute: 'alt',
+    attribute: ['alt', 'aria-hidden'],
     allowEmptyString: true,
   }),
   createRequiredElementAttributeRule({

package/src/rules/issues/dom/imageWithoutDimensionRule.test.ts

@@ -159,4 +159,223 @@ describe('imageWithoutDimensionRule', () => {
     expect(problems[0].code).toBe('image without dimension')
     expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root'])
   })
+
+  test('should report if only aspect-ratio is set', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {},
+                  classes: {},
+                  events: {},
+                  tag: 'source',
+                  children: [],
+                  style: {
+                    'aspect-ratio': '16/9',
+                  },
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [imageWithoutDimensionRule],
+      }),
+    )
+
+    expect(problems).toHaveLength(1)
+    expect(problems[0].code).toBe('image without dimension')
+    expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root'])
+  })
+
+  test('should not report if aspect-ratio and one dimension is set', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    width: {
+                      type: 'value',
+                      value: '100',
+                    },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {
+                    'aspect-ratio': '16/9',
+                  },
+                },
+                other: {
+                  type: 'element',
+                  attrs: {},
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {
+                    height: '200px',
+                    'aspect-ratio': '4/3',
+                  },
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [imageWithoutDimensionRule],
+      }),
+    )
+
+    expect(problems).toHaveLength(0)
+  })
+
+  test('should not report if dimensions are dynamic', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    width: {
+                      type: 'path',
+                      path: ['Variables', 'imageWidth'],
+                    },
+                    height: {
+                      type: 'path',
+                      path: ['Variables', 'imageHeight'],
+                    },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {},
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [imageWithoutDimensionRule],
+      }),
+    )
+
+    expect(problems).toHaveLength(0)
+  })
+
+  test('should not report non-image elements', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {},
+                  classes: {},
+                  events: {},
+                  tag: 'div',
+                  children: [],
+                  style: {},
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [imageWithoutDimensionRule],
+      }),
+    )
+
+    expect(problems).toHaveLength(0)
+  })
+
+  test('should report if dimensions are set to non-static keywords (auto | empty string)', () => {
+    const problems = Array.from(
+      searchProject({
+        files: {
+          formulas: {},
+          components: {
+            test: {
+              name: 'test',
+              nodes: {
+                root: {
+                  type: 'element',
+                  attrs: {
+                    width: {
+                      type: 'value',
+                      value: 'auto',
+                    },
+                  },
+                  classes: {},
+                  events: {},
+                  tag: 'img',
+                  children: [],
+                  style: {
+                    height: '',
+                  },
+                },
+                other: {
+                  type: 'element',
+                  attrs: {},
+                  classes: {},
+                  events: {},
+                  tag: 'source',
+                  children: [],
+                  style: {
+                    width: '100%',
+                    'aspect-ratio': 'auto',
+                  },
+                },
+              },
+              formulas: {},
+              apis: {},
+              attributes: {},
+              variables: {},
+            },
+          },
+        },
+        rules: [imageWithoutDimensionRule],
+      }),
+    )
+
+    expect(problems).toHaveLength(2)
+    expect(problems[0].code).toBe('image without dimension')
+    expect(problems[0].path).toEqual(['components', 'test', 'nodes', 'root'])
+    expect(problems[1].path).toEqual(['components', 'test', 'nodes', 'other'])
+  })
 })

package/src/rules/issues/dom/imageWithoutDimensionRule.ts

@@ -1,6 +1,8 @@
 import { isDefined } from '@nordcraft/core/dist/utils/util'
 import type { Rule } from '../../../types'
+import { contextlessEvaluateFormula } from '../../../util/contextlessEvaluateFormula'
 
+const nonStaticDimensionKeywords = ['', 'auto']
 /**
  * Lighthouse reports a similar issue:
  * https://web.dev/articles/optimize-cls?utm_source=lighthouse&utm_medium=devtools#images_without_dimensions
@@ -18,29 +20,36 @@ export const imageWithoutDimensionRule: Rule = {
       return
     }
 
-    // Aspect ratio can be calculated from width and height attributes
-    if (isDefined(value.attrs.width) && isDefined(value.attrs.height)) {
-      return
+    let hasValidWidth = false
+    let hasValidHeight = false
+    let hasValidAspectRatio = false
+
+    if (isDefined(value.attrs.width)) {
+      const widthEval = contextlessEvaluateFormula(value.attrs.width)
+      // If dynamic, we assume it is valid
+      hasValidWidth ||= !widthEval.isStatic || checkValue(widthEval.result)
     }
 
+    if (isDefined(value.attrs.height)) {
+      const heightEval = contextlessEvaluateFormula(value.attrs.height)
+      // If dynamic, we assume it is valid
+      hasValidHeight ||= !heightEval.isStatic || checkValue(heightEval.result)
+    }
+
+    ;[
+      value.style,
+      // We don't know the circumstances under which the style is applied, so we assume it is fine if just one of the variants has correct dimensions
+      ...(value.variants?.map((variant) => variant.style) ?? []),
+    ].forEach((style) => {
+      hasValidWidth ||= checkValue(style?.width)
+      hasValidHeight ||= checkValue(style?.height)
+      hasValidAspectRatio ||= checkValue(style?.['aspect-ratio'])
+    })
+
+    // If two of the three values are truthy, the third can be derived
     if (
-      [
-        value.style,
-        // We don't know the circumstances under which the style is applied, so we assume it is Okay if just one of the variants has correct style
-        ...(value.variants?.map((variant) => variant.style) ?? []),
-      ].some((style) => {
-        // Aspect ratio is not required if width and height are fixed
-        if (isDefined(style.width) && isDefined(style.height)) {
-          return true
-        }
-
-        // Aspect ratio is set explicitly
-        if (isDefined(style['aspect-ratio'])) {
-          return true
-        }
-
-        return false
-      })
+      [hasValidWidth, hasValidHeight, hasValidAspectRatio].filter(Boolean)
+        .length >= 2
     ) {
       return
     }
@@ -48,3 +57,15 @@ export const imageWithoutDimensionRule: Rule = {
     report(path)
   },
 }
+
+function checkValue(value: any | undefined): boolean {
+  if (!isDefined(value)) {
+    return false
+  }
+
+  if (nonStaticDimensionKeywords.includes(value)) {
+    return false
+  }
+
+  return true
+}