diff --git a/src/compiler/compile/nodes/Element.ts b/src/compiler/compile/nodes/Element.ts index 6636c6b87b46..94816881fcd4 100644 --- a/src/compiler/compile/nodes/Element.ts +++ b/src/compiler/compile/nodes/Element.ts @@ -287,6 +287,29 @@ export default class Element extends Node { } } + if (this.is_media_node()) { + const has_muted_attribute = this.attributes.some(attr => attr.name === 'muted'); + + if (has_muted_attribute) { + return; + } + + const is_track = (child: INode) => child.type === 'Element' && child.name === 'track'; + const is_caption = (attr: Attribute) => + attr.name === 'kind' && + attr.get_static_value().toString().toLowerCase() === 'captions'; + const has_captions = this.children.some( + child => !is_track(child) ? false : child.attributes.some(is_caption) + ); + + if (!has_captions) { + this.component.warn(this, { + code: `a11y-media-has-caption`, + message: `A11y: <${this.name}> should have a for captions` + }); + } + } + this.validate_attributes(); this.validate_special_cases(); this.validate_bindings(); diff --git a/test/validator/samples/a11y-media-has-caption/input.svelte b/test/validator/samples/a11y-media-has-caption/input.svelte index 105269cddb48..afaadd828a00 100644 --- a/test/validator/samples/a11y-media-has-caption/input.svelte +++ b/test/validator/samples/a11y-media-has-caption/input.svelte @@ -1,4 +1,8 @@ - - - - + +