`require-ancestor`

HTML Living Standardに基づき、要素がコンテンツモデルで指定された必須の祖先要素(descendantOf)なしに出現している場合に警告します。設定は@markuplint/html-specにあります。

祖先は、その要素が属するツリーの中で探します。template要素の内容は別のドキュメントフラグメントに属し、マークアップからはその内容がどこに挿入されるか分かりません。そのため、探索はtemplate要素の内容の外に出ず、探索が内容の先頭で終わった要素は、template要素の外に該当する祖先があってもなくても警告しません。宣言的シャドウルート(<template shadowrootmode>)の内容もそれ自身のツリーで、その外にある祖先は数えないため、警告します。テンプレートエンジンのディレクティブを持つtemplate要素(Vueの<template v-if>)はHTMLのtemplate要素ではないため、探索はそれを通り抜けます。ReactとVueでは、ディレクティブのないtemplate要素は子要素が文書の中にある通常の要素なので、探索は他の要素と同じようにそれを通ります。

❌ 間違ったコード例

<div>
  <area href="/path" alt="Link" />
</div>

✅ 正しいコード例

<map name="example">
  <area href="/path" alt="Link" />
</map>

Interface

{
  "require-ancestor": boolean
}

Default Severity

error

Interface​

Default Severity​

Interface

Default Severity