Account for additional control elements in label-has-associated-control

jsx-eslint · Jun 21, 2020 · 2234df7 · 2234df7
1 parent 1614b85
commit 2234df7
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/__tests__/src/rules/label-has-associated-control-test.js b/__tests__/src/rules/label-has-associated-control-test.js
@@ -48,6 +48,11 @@ const nestingValid = [
   { code: '<label><span><span><span><span>A label</span><input /></span></span></span></label>', options: [{ depth: 5 }] },
   { code: '<label><span><span><span><span aria-label="A label" /><input /></span></span></span></label>', options: [{ depth: 5 }] },
   { code: '<label><span><span><span><input aria-label="A label" /></span></span></span></label>', options: [{ depth: 5 }] },
+  // Other controls
+  { code: '<label>foo<meter /></label>' },
+  { code: '<label>foo<output /></label>' },
+  { code: '<label>foo<progress /></label>' },
+  { code: '<label>foo<textarea /></label>' },
   // Custom controlComponents.
   { code: '<label><span>A label<CustomInput /></span></label>', options: [{ controlComponents: ['CustomInput'] }] },
   { code: '<CustomLabel><span>A label<CustomInput /></span></CustomLabel>', options: [{ controlComponents: ['CustomInput'], labelComponents: ['CustomLabel'] }] },

diff --git a/src/rules/label-has-associated-control.js b/src/rules/label-has-associated-control.js
@@ -57,7 +57,14 @@ module.exports = {
       if (componentNames.indexOf(elementType(node.openingElement)) === -1) {
         return;
       }
-      const controlComponents = ['input', 'select', 'textarea'].concat((options.controlComponents || []));
+      const controlComponents = [
+        'input',
+        'meter',
+        'output',
+        'progress',
+        'select',
+        'textarea',
+      ].concat((options.controlComponents || []));
       // Prevent crazy recursion.
       const recursionDepth = Math.min(
         options.depth === undefined ? 2 : options.depth,