Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Meta: mark up definitions of element attributes as such #6752

Merged
merged 3 commits into from Jun 9, 2021
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
151 changes: 78 additions & 73 deletions source
Expand Up @@ -13416,13 +13416,13 @@ interface <dfn interface>HTMLLinkElement</dfn> : <span>HTMLElement</span> {
data-x="attr-link-imagesrcset">imagesrcset</code> attributes are absent, then the element does not
define a link.</p>

<p>The types of link indicated (the relationships) are given by the value of the <dfn><code
data-x="attr-link-rel">rel</code></dfn> attribute, which, if present, must have a value that is a
<span>unordered set of unique space-separated tokens</span>. The <a href="#linkTypes">allowed
keywords and their meanings</a> are defined in a later section. <span w-nodev>If the <code
data-x="attr-link-rel">rel</code> attribute is absent, has no keywords, or if none of the keywords
used are allowed according to the definitions in this specification, then the element does not
create any links.</span></p>
<p>The types of link indicated (the relationships) are given by the value of the <dfn element-attr
for="link"><code data-x="attr-link-rel">rel</code></dfn> attribute, which, if present, must have a
value that is a <span>unordered set of unique space-separated tokens</span>. The <a
href="#linkTypes">allowed keywords and their meanings</a> are defined in a later section. <span
w-nodev>If the <code data-x="attr-link-rel">rel</code> attribute is absent, has no keywords, or if
none of the keywords used are allowed according to the definitions in this specification, then the
element does not create any links.</span></p>

<div w-nodev>

Expand Down Expand Up @@ -23051,11 +23051,12 @@ document.body.appendChild(wbr);</code></pre>
filenames, and user agents are likely to adjust filenames accordingly.</p>


<p>The <dfn id="ping" data-x="attr-hyperlink-ping"><code>ping</code></dfn> attribute, if present,
gives the URLs of the resources that are interested in being notified if the user follows the
hyperlink. The value must be a <span>set of space-separated tokens</span>, each of which must be a
<span>valid non-empty URL</span> whose <span data-x="concept-url-scheme">scheme</span> is an
<span>HTTP(S) scheme</span>. <span w-nodev>The value is used by the user agent for <span>hyperlink
<p>The <dfn id="ping" element-attr for="a,area"
data-x="attr-hyperlink-ping"><code>ping</code></dfn> attribute, if present, gives the URLs of the
resources that are interested in being notified if the user follows the hyperlink. The value must
be a <span>set of space-separated tokens</span>, each of which must be a <span>valid non-empty
URL</span> whose <span data-x="concept-url-scheme">scheme</span> is an <span>HTTP(S)
scheme</span>. <span w-nodev>The value is used by the user agent for <span>hyperlink
auditing</span>.</span></p>

<p><span w-dev subdfn data-x="dom-a-rellist"></span>The <dfn element-attr for="a,area"><code
Expand Down Expand Up @@ -26249,8 +26250,8 @@ interface <dfn interface>HTMLSourceElement</dfn> : <span>HTMLElement</span> {
<span data-x="media resource">media resources</span> for <span data-x="media element">media
elements</span>. It does not <span data-x="represents">represent</span> anything on its own.</p>

<p>The <dfn data-x="attr-source-type"><code>type</code></dfn> attribute may be present. If
present, the value must be a <span>valid MIME type string</span>.</p>
<p>The <dfn element-attr for="source" data-x="attr-source-type"><code>type</code></dfn> attribute
may be present. If present, the value must be a <span>valid MIME type string</span>.</p>

<p>The remainder of the requirements depend on whether the parent is a <code>picture</code>
element or a <span>media element</span>:</p>
Expand All @@ -26259,24 +26260,24 @@ interface <dfn interface>HTMLSourceElement</dfn> : <span>HTMLElement</span> {
<dt><code>source</code> element's parent is a <code>picture</code> element</dt>

<dd>
<p>The <dfn data-x="attr-source-srcset"><code>srcset</code></dfn> attribute must be present, and
is a <span>srcset attribute</span>.</p>
<p>The <dfn element-attr for="source" data-x="attr-source-srcset"><code>srcset</code></dfn>
attribute must be present, and is a <span>srcset attribute</span>.</p>

<p>The <code data-x="attr-source-srcset">srcset</code> attribute contributes the <span
data-x="image source">image sources</span> to the <span>source set</span>, if the
<code>source</code> element is selected.</p>

<p>If the <code data-x="attr-source-srcset">srcset</code> attribute has any <span data-x="image
candidate string">image candidate strings</span> using a <span>width descriptor</span>, the <dfn
data-x="attr-source-sizes"><code>sizes</code></dfn> attribute must also be present, and is a
<span>sizes attribute</span>. The <code data-x="attr-source-sizes">sizes</code> attribute
contributes the <span>source size</span> to the <span>source set</span>, if the
<code>source</code> element is selected.</p>
element-attr for="source" data-x="attr-source-sizes"><code>sizes</code></dfn> attribute must
also be present, and is a <span>sizes attribute</span>. The <code
data-x="attr-source-sizes">sizes</code> attribute contributes the <span>source size</span> to
the <span>source set</span>, if the <code>source</code> element is selected.</p>

<p>The <dfn data-x="attr-source-media"><code>media</code></dfn> attributes may also be present.
If present, the value must contain a <span>valid media query list</span>. The user agent will
skip to the next <code>source</code> element if the value does not <span data-x="matches the
environment">match the environment</span>.</p>
<p>The <dfn element-attr for="source" data-x="attr-source-media"><code>media</code></dfn>
attribute may also be present. If present, the value must contain a <span>valid media query
list</span>. The user agent will skip to the next <code>source</code> element if the value does
not <span data-x="matches the environment">match the environment</span>.</p>

<p>The <code>source</code> element supports <span>dimension attributes</span>. The
<code>img</code> element can use the <code data-x="attr-dim-width">width</code> and <code
Expand Down Expand Up @@ -26554,13 +26555,13 @@ interface <dfn interface>HTMLImageElement</dfn> : <span>HTMLElement</span> {

-->

<p>The image given by the <dfn data-x="attr-img-src"><code>src</code></dfn> and <dfn
data-x="attr-img-srcset"><code>srcset</code></dfn> attributes, and any previous sibling
<code>source</code> elements' <code data-x="attr-source-srcset">srcset</code> attributes if the
parent is a <code>picture</code> element, is the embedded content; the value of the <dfn
data-x="attr-img-alt"><code>alt</code></dfn> attribute provides equivalent content for those who
cannot process images or who have image loading disabled (i.e. it is the <code>img</code>
element's <span>fallback content</span>).</p>
<p>The image given by the <dfn element-attr for="img" data-x="attr-img-src"><code>src</code></dfn>
and <dfn data-x="attr-img-srcset" element-attr for="img"><code>srcset</code></dfn> attributes, and
any previous sibling <code>source</code> elements' <code data-x="attr-source-srcset">srcset</code>
attributes if the parent is a <code>picture</code> element, is the embedded content; the value of
the <dfn element-attr for="img" data-x="attr-img-alt"><code>alt</code></dfn> attribute provides
equivalent content for those who cannot process images or who have image loading disabled (i.e. it
is the <code>img</code> element's <span>fallback content</span>).</p>

<p>The requirements on the <code data-x="attr-img-alt">alt</code> attribute's value are described
<a href="#alt">in a separate section</a>.</p>
Expand All @@ -26587,26 +26588,28 @@ interface <dfn interface>HTMLImageElement</dfn> : <span>HTMLElement</span> {

<p>If the <code data-x="attr-img-srcset">srcset</code> attribute is present and has any <span
data-x="image candidate string">image candidate strings</span> using a <span>width
descriptor</span>, the <dfn data-x="attr-img-sizes"><code>sizes</code></dfn> attribute must also
descriptor</span>, the <dfn element-attr for="img" data-x="attr-img-sizes"><code>sizes</code></dfn> attribute must also
be present, and is a <span>sizes attribute</span>. The <code data-x="attr-img-sizes">sizes</code>
attribute contributes the <span>source size</span> to the <span>source set</span> (if no
<code>source</code> element was selected).</p>

<p>The <dfn data-x="attr-img-crossorigin"><code>crossorigin</code></dfn> attribute is a <span>CORS
settings attribute</span>. Its purpose is to allow images from third-party sites that allow
cross-origin access to be used with <code>canvas</code>.</p>
<p>The <dfn element-attr for="img" data-x="attr-img-crossorigin"><code>crossorigin</code></dfn>
attribute is a <span>CORS settings attribute</span>. Its purpose is to allow images from
third-party sites that allow cross-origin access to be used with <code>canvas</code>.</p>

<p>The <dfn data-x="attr-img-referrerpolicy"><code>referrerpolicy</code></dfn> attribute is a
<span>referrer policy attribute</span>. Its purpose is to set the <span>referrer policy</span>
used when <span data-x="concept-fetch">fetching</span> the image. <ref spec=REFERRERPOLICY></p>
<p>The <dfn element-attr for="img"
data-x="attr-img-referrerpolicy"><code>referrerpolicy</code></dfn> attribute is a <span>referrer
policy attribute</span>. Its purpose is to set the <span>referrer policy</span> used when <span
data-x="concept-fetch">fetching</span> the image. <ref spec=REFERRERPOLICY></p>

<p>The <dfn data-x="attr-img-decoding"><code>decoding</code></dfn> attribute indicates the
preferred method to <span data-x="img-decoding-process">decode</span> this image. The attribute,
if present, must be an <span>image decoding hint</span>. This attribute's <i data-x="missing value
default">missing value default</i> and <i data-x="invalid value default">invalid value
default</i> are both the <span data-x="attr-img-decoding-auto-state">auto</span> state.</p>
<p>The <dfn element-attr for="img" data-x="attr-img-decoding"><code>decoding</code></dfn>
attribute indicates the preferred method to <span data-x="img-decoding-process">decode</span> this
image. The attribute, if present, must be an <span>image decoding hint</span>. This attribute's <i
data-x="missing value default">missing value default</i> and <i data-x="invalid value
default">invalid value default</i> are both the <span
data-x="attr-img-decoding-auto-state">auto</span> state.</p>

<p>The <dfn data-x="attr-img-loading"><code>loading</code></dfn> attribute is a <span>lazy
<p>The <dfn element-attr for="img" data-x="attr-img-loading"><code>loading</code></dfn> attribute is a <span>lazy
loading attribute</span>. Its purpose is to indicate the policy for loading images that are
outside the viewport.</p>

Expand Down Expand Up @@ -26785,13 +26788,11 @@ interface <dfn interface>HTMLImageElement</dfn> : <span>HTMLElement</span> {
if present, can indicate that the image has an associated
<span>image map</span>.</p>

<p>The <dfn data-x="attr-img-ismap"><code>ismap</code></dfn>
attribute, when used on an element that is a descendant of an
<code>a</code> element with an <code
data-x="attr-hyperlink-href">href</code> attribute, indicates by its
presence that the element provides access to a server-side image
map. This affects how events are handled on the corresponding
<code>a</code> element.</p>
<p>The <dfn element-attr for="img" data-x="attr-img-ismap"><code>ismap</code></dfn> attribute,
when used on an element that is a descendant of an <code>a</code> element with an <code
data-x="attr-hyperlink-href">href</code> attribute, indicates by its presence that the element
provides access to a server-side image map. This affects how events are handled on the
corresponding <code>a</code> element.</p>

<p>The <code data-x="attr-img-ismap">ismap</code> attribute is a
<span>boolean attribute</span>. The attribute must not be specified
Expand Down Expand Up @@ -30857,12 +30858,13 @@ interface <dfn interface>HTMLIFrameElement</dfn> : <span>HTMLElement</span> {

<hr> <!-- REFERRERPOLICY ATTRIBUTE -->

<p>The <dfn data-x="attr-iframe-referrerpolicy"><code>referrerpolicy</code></dfn> attribute is a
<p>The <dfn element-attr for="iframe"
data-x="attr-iframe-referrerpolicy"><code>referrerpolicy</code></dfn> attribute is a
<span>referrer policy attribute</span>. Its purpose is to set the <span>referrer policy</span>
used when <span data-x="process the iframe attributes">processing the <code>iframe</code>
attributes</span>. <ref spec=REFERRERPOLICY></p>

<p>The <dfn data-x="attr-iframe-loading"><code>loading</code></dfn> attribute is a <span>lazy
<p>The <dfn element-attr for="iframe" data-x="attr-iframe-loading"><code>loading</code></dfn> attribute is a <span>lazy
loading attribute</span>. Its purpose is to indicate the policy for loading <code>iframe</code>
elements that are outside the viewport.</p>

Expand Down Expand Up @@ -39249,7 +39251,7 @@ interface <dfn interface>HTMLAreaElement</dfn> : <span>HTMLElement</span> {
data-x="hyperlink">hyperlinks</span>.</p>

<p>An image, in the form of an <code>img</code> element, may be associated with an image map (in
the form of a <code>map</code> element) by specifying a <dfn element-attr><code
the form of a <code>map</code> element) by specifying a <dfn element-attr for="img"><code
data-x="attr-hyperlink-usemap">usemap</code></dfn> attribute on the <code>img</code> element. The
<code data-x="attr-hyperlink-usemap">usemap</code> attribute, if specified, must be a <span>valid
hash-name reference</span> to a <code>map</code> element.</p>
Expand Down Expand Up @@ -53070,11 +53072,12 @@ form.method === input; // => true</code></pre>

<h5>Limiting user input length: the <code data-x="attr-fe-maxlength">maxlength</code> attribute</h5>

<p>A <dfn data-x="attr-fe-maxlength">form control <code data-x="">maxlength</code>
attribute</dfn>, controlled by the <span data-x="concept-fe-dirty">dirty value flag</span>,
declares a limit on the number of characters a user can input. The "number of characters" is
measured using <span>length</span> and, in the case of <code>textarea</code> elements, with all
newlines normalized to a single character (as opposed to CRLF pairs).</p>
<p>A <dfn data-lt="maxlength" element-attr for="input,textarea" data-x="attr-fe-maxlength">form
control <code data-x="">maxlength</code> attribute</dfn>, controlled by the <span
data-x="concept-fe-dirty">dirty value flag</span>, declares a limit on the number of characters a
user can input. The "number of characters" is measured using <span>length</span> and, in the case
of <code>textarea</code> elements, with all newlines normalized to a single character (as opposed
to CRLF pairs).</p>

<p>If an element has its <span data-x="attr-fe-maxlength">form control <code
data-x="">maxlength</code> attribute</span> specified, the attribute's value must be a <span>valid
Expand Down Expand Up @@ -53107,11 +53110,12 @@ form.method === input; // => true</code></pre>

<h5>Setting minimum input length requirements: the <code data-x="attr-fe-minlength">minlength</code> attribute</h5>

<p>A <dfn data-x="attr-fe-minlength">form control <code data-x="">minlength</code>
attribute</dfn>, controlled by the <span data-x="concept-fe-dirty">dirty value flag</span>,
declares a lower bound on the number of characters a user can input. The "number of characters" is
measured using <span>length</span> and, in the case of <code>textarea</code> elements, with all
newlines normalized to a single character (as opposed to CRLF pairs).</p>
<p>A <dfn data-lt="minlength" element-attr for="input,textarea" data-x="attr-fe-minlength">form
control <code data-x="">minlength</code> attribute</dfn>, controlled by the <span
data-x="concept-fe-dirty">dirty value flag</span>, declares a lower bound on the number of
characters a user can input. The "number of characters" is measured using <span>length</span> and,
in the case of <code>textarea</code> elements, with all newlines normalized to a single character
(as opposed to CRLF pairs).</p>

<p class="note">The <code data-x="attr-fe-minlength">minlength</code> attribute does not imply the
<code data-x="">required</code> attribute. If the form control has no <code
Expand Down Expand Up @@ -59716,9 +59720,9 @@ dictionary <dfn dictionary>AssignedNodesOptions</dfn> {
typically used in a <span>shadow tree</span>. A <code>slot</code> element <span>represents</span>
its <span>assigned nodes</span>, if any, and its contents otherwise.</p>

<p>The <dfn data-x="attr-slot-name"><code>name</code></dfn> content attribute may contain any
string value. It represents a <span data-x="concept-slot">slot</span>'s <span
data-x="slot-name">name</span>.</p>
<p>The <dfn element-attr for="slot" data-x="attr-slot-name"><code>name</code></dfn> content
attribute may contain any string value. It represents a <span data-x="concept-slot">slot</span>'s
<span data-x="slot-name">name</span>.</p>

<p class="note">The <code data-x="attr-slot-name">name</code> attribute is used to <span
data-x="assign a slot">assign slots</span> to other elements: a <code>slot</code> element with a
Expand Down Expand Up @@ -67246,12 +67250,13 @@ document.body.append(parent);
data-x="attr-fae-form">form</code> attribute is used to explicitly associate the
<span>form-associated custom element</span> with its <span>form owner</span>.</p>

<p>The <dfn data-x="attr-face-readonly"><code>readonly</code></dfn> attribute of <span
data-x="form-associated custom element">form-associated custom elements</span> specifies that the
element is <span>barred from constraint validation</span>. User agents don't provide any other
behavior for the attribute, but custom element authors should, where possible, use its presence
to make their control non-editable in some appropriate fashion, similar to the behavior for the
<span data-x="attr-input-readonly">readonly</span> attribute on built-in form controls.</p>
<p>The <dfn element-attr for="form-associated custom elements"
data-x="attr-face-readonly"><code>readonly</code></dfn> attribute of <span data-x="form-associated
custom element">form-associated custom elements</span> specifies that the element is <span>barred
from constraint validation</span>. User agents don't provide any other behavior for the attribute,
but custom element authors should, where possible, use its presence to make their control
non-editable in some appropriate fashion, similar to the behavior for the <span
data-x="attr-input-readonly">readonly</span> attribute on built-in form controls.</p>

<p><strong>Constraint validation</strong>: If the <code
data-x="attr-face-readonly">readonly</code> attribute is specified on a <span>form-associated
Expand Down