template-require-iframe-title.md

ember/template-require-iframe-title

💼 This rule is enabled in the 📋 template-lint-migration config.

<iframe>

<iframe> elements must have a unique title property so assistive technology can convey their content to the user. The normative requirement is WCAG SC 4.1.2 (Name, Role, Value); the title attribute is one sufficient technique for meeting it (sufficient technique H64).

Examples

This rule allows the following:

<template>
  <iframe title='This is a unique title' />
  <iframe title={{someValue}} />
</template>

This rule forbids the following:

<template>
  <iframe />
  <iframe title='' />
  <iframe title='   ' />
  <iframe title={{null}} />
  <iframe title={{undefined}} />
  <iframe title={{42}} />
</template>

Whitespace-only title (" ") is flagged by default as an authoring-hygiene check: HTML and ACCNAME technically permit it (step 2I doesn't trim), but a whitespace-only accessible name is useless in practice. Suppress this specific strictness via allowWhitespaceOnlyTitle: true if your codebase needs it.

Configuration

• allowWhitespaceOnlyTitle (boolean, default false): when true, <iframe title=" "> is accepted. Empty-string title="" and non-string mustache literals ({{null}}, {{undefined}}, {{42}}) are still flagged.

module.exports = {
  rules: {
    'ember/template-require-iframe-title': ['error', { allowWhitespaceOnlyTitle: true }],
  },
};

References

• WCAG SC 4.1.2 — Name, Role, Value — the normative requirement.
• WCAG Technique H64 — Using the title attribute of the iframe element — a sufficient technique for SC 4.1.2, not itself normative.
• WCAG Success Criterion 2.4.1 — Bypass Blocks
• ACCNAME 1.2 — accessible-name computation
• axe-core rule frame-title