fix(820): check if media has captions

src/compiler/compile/nodes/Element.ts

@@ -507,6 +507,26 @@ export default class Element extends Node {
 			}
 		}
 
+
+		if (this.is_media_node()) {
+			if (attribute_map.has('muted')) {
+				return;
+			}
+
+			let has_caption;
+			const track = this.children.find((i: Element) => i.name === 'track');
+			if (track) {
+				has_caption = track.attributes.find(a => a.name === "kind" && a.get_static_value() === "captions");
+			}
+
+			if (!has_caption) {
+				component.warn(this, {
+					code: `a11y-media-has-caption`,
+					message: `A11y: Media elements such as <audio> and <video> must have a <track> for captions.`
+				});
+			}
+		}
+
 		if (a11y_no_onchange.has(this.name)) {
 			if (handlers_map.has('change') && !handlers_map.has('blur')) {
 				component.warn(this, {

test/validator/samples/a11y-media-has-caption/input.svelte

@@ -0,0 +1,4 @@
+<video><track kind="captions"/></video>
+<video></video>
+<video><track /></video>
+<audio muted></audio>

test/validator/samples/a11y-media-has-caption/warnings.json

@@ -0,0 +1,32 @@
+[
+  {
+    "code": "a11y-media-has-caption",
+    "end": {
+      "character": 55,
+      "column": 15,
+      "line": 2
+    },
+    "message": "A11y: Media elements such as <audio> and <video> must have a <track> for captions.",
+    "pos": 40,
+    "start": {
+      "character": 40,
+      "column": 0,
+      "line": 2
+    }
+  },
+  {
+    "code": "a11y-media-has-caption",
+    "end": {
+      "character": 80,
+      "column": 24,
+      "line": 3
+    },
+    "message": "A11y: Media elements such as <audio> and <video> must have a <track> for captions.",
+    "pos": 56,
+    "start": {
+      "character": 56,
+      "column": 0,
+      "line": 3
+    }
+  }
+]