do not run a11y validation on child component elements (#1110)

Author: Conduitry

src/validate/html/index.ts

@@ -19,14 +19,29 @@ export default function validateHtml(validator: Validator, html: Node) {
 	const elementStack: Node[] = [];
 
 	function visit(node: Node) {
-		a11y(validator, node, elementStack);
-
 		if (node.type === 'Element') {
 			if (meta.has(node.name)) {
 				return meta.get(node.name)(validator, node, refs, refCallees);
 			}
 
-			validateElement(validator, node, refs, refCallees, stack, elementStack);
+			const isComponent =
+				node.name === ':Self' ||
+				node.name === ':Component' ||
+				validator.components.has(node.name);
+
+			validateElement(
+				validator,
+				node,
+				refs,
+				refCallees,
+				stack,
+				elementStack,
+				isComponent
+			);
+
+			if (!isComponent) {
+				a11y(validator, node, elementStack);
+			}
 		} else if (node.type === 'EachBlock') {
 			if (validator.helpers.has(node.context)) {
 				let c = node.expression.end;

src/validate/html/validateElement.ts

@@ -11,11 +11,9 @@ export default function validateElement(
 	refs: Map<string, Node[]>,
 	refCallees: Node[],
 	stack: Node[],
-	elementStack: Node[]
+	elementStack: Node[],
+	isComponent: Boolean
 ) {
-	const isComponent =
-		node.name === ':Self' || node.name === ':Component' || validator.components.has(node.name);
-
 	if (isComponent) {
 		validator.used.components.add(node.name);
 	}

src/validate/html/validateHead.ts

@@ -11,6 +11,6 @@ export default function validateHead(validator: Validator, node: Node, refs: Map
 
 	node.children.forEach(node => {
 		if (node.type !== 'Element') return; // TODO handle {{#if}} and friends?
-		validateElement(validator, node, refs, refCallees, [], []);
+		validateElement(validator, node, refs, refCallees, [], [], false);
 	});
 }

test/validator/samples/a11y-not-on-components/input.html

@@ -0,0 +1,9 @@
+<Widget scope="foo">
+	<input autofocus>
+</Widget>
+
+<script>
+	export default {
+		components: { Widget },
+	};
+</script>

test/validator/samples/a11y-not-on-components/warnings.json

@@ -0,0 +1,10 @@
+[
+	{
+		"message": "A11y: Avoid using autofocus",
+		"loc": {
+			"column": 8,
+			"line": 2
+		},
+		"pos": 29
+	}
+]