Skip to content

Rule jsx-a11y/media-has-caption fails when it's conditional #1074

@binarykitchen

Description

@binarykitchen

Nice library, although I'm stuck with this one rule:

Media elements such as <audio> and <video> must have a <track> for captions.

As you can see in my code, it's conditional. When muted, then don't add VTT. Somehow, your plugin can't detect this and produces a false positive.

<video
  className="replay"
  crossOrigin="anonymous"
  autoPlay
  preload="auto"
  playsInline
  controls
  poster={videomail.poster}
  muted={!hasAudio}
  style={{ width: videomail.width, height: videomail.height }}
>
  {videomail.mp4 && <source src={videomail.mp4} type="video/mp4" />}
  {videomail.webm && <source src={videomail.webm} type="video/webm" />}
  {hasAudio && <track src={videomail.vtt} kind="captions" default />}
</video>

Using all the latest versions here.

Thanks for investigating this.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions