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

Make the directionality account for missing parent element #9554

Merged
merged 6 commits into from
Aug 29, 2023
Merged
Changes from 5 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
238 changes: 122 additions & 116 deletions source
Original file line number Diff line number Diff line change
Expand Up @@ -13443,161 +13443,167 @@ Transport Protocol">HTTP&lt;/abbr> today.&lt;/p></code></pre> <!-- DO NOT REWRAP
specifies the element's text directionality. The attribute is an <span>enumerated attribute</span>
with the following keywords and states:</p>

<dl>
<dt>The <dfn attr-value for="html-global/dir"><code data-x="attr-dir-ltr">ltr</code></dfn>
keyword, which maps to the <dfn data-x="attr-dir-ltr-state">ltr</dfn> state</dt>

<dd>
<p>Indicates that the contents of the element are explicitly directionally isolated
left-to-right text.</p>
</dd>

<dt>The <dfn attr-value for="html-global/dir"><code data-x="attr-dir-rtl">rtl</code></dfn>
keyword, which maps to the <dfn data-x="attr-dir-rtl-state">rtl</dfn> state</dt>

<dd>
<p>Indicates that the contents of the element are explicitly directionally isolated
right-to-left text.</p>
</dd>

<dt>The <dfn attr-value for="html-global/dir"><code data-x="attr-dir-auto">auto</code></dfn>
keyword, which maps to the <dfn data-x="attr-dir-auto-state">auto</dfn> state</dt>

<dd>
<p>Indicates that the contents of the element are explicitly directionally isolated text, but
that the direction is to be determined programmatically using the contents of the element (as
described below).</p>
<table>
<thead>
annevk marked this conversation as resolved.
Show resolved Hide resolved
<tr>
<th>Keyword</th>
<th>State</th>
<th>Brief description</th>
</tr>
</thead>
<tbody>
<tr>
<td><dfn attr-value for="html-global/dir"><code data-x="attr-dir-ltr">ltr</code></dfn></td>
<td><dfn data-x="attr-dir-ltr-state">ltr</dfn></td>
<td>The contents of the element are explicitly directionally isolated left-to-right text.</td>
</tr>
<tr>
<td><dfn attr-value for="html-global/dir"><code data-x="attr-dir-rtl">rtl</code></dfn></td>
<td><dfn data-x="attr-dir-rtl-state">rtl</dfn></td>
<td>The contents of the element are explicitly directionally isolated right-to-left text.</td>
annevk marked this conversation as resolved.
Show resolved Hide resolved
</tr>
<tr>
<td><dfn attr-value for="html-global/dir"><code data-x="attr-dir-auto">auto</code></dfn></td>
<td><dfn data-x="attr-dir-auto-state">auto</dfn></td>
<td>The contents of the element are explicitly directionally isolated text, but the direction
is to be determined programmatically using the contents of the element (as described
below).</td>
</tr>
</tbody>
</table>

<p class="note">The heuristic used by this state is very crude (it just looks at the first
character with a strong directionality, in a manner analogous to the Paragraph Level
determination in the bidirectional algorithm). Authors are urged to only use this value as a
last resort when the direction of the text is truly unknown and no better server-side heuristic
can be applied. <ref>BIDI</ref></p>
<div class="note">
<p>The heuristic used by the <span data-x="attr-dir-auto-state">auto</span> state is very crude
(it just looks at the first character with a strong directionality, in a manner analogous to the
Paragraph Level determination in the bidirectional algorithm). Authors are urged to only use this
value as a last resort when the direction of the text is truly unknown and no better server-side
heuristic can be applied. <ref>BIDI</ref></p>

<p class="note">For <code>textarea</code> and <code>pre</code> elements, the heuristic is
applied on a per-paragraph level.</p>
</dd>
</dl>
<p>For <code>textarea</code> and <code>pre</code> elements, the heuristic is applied on a
per-paragraph level.</p>
</div>

<p>The attribute has no <i data-x="invalid value default">invalid value default</i> and no <i data-x="missing value default">missing value default</i>.</p>
<p>The <code data-x="attr-dir">dir</code> attribute's <i data-x="invalid value default">invalid
value default</i> and <i data-x="missing value default">missing value default</i> are both the
<dfn data-x="attr-dir-undefined-state">undefined</dfn> state.</p>

<hr>

<p><dfn>The directionality</dfn> of an element (any element, not just an <span data-x="HTML
elements">HTML element</span>) is either '<dfn data-x="concept-ltr">ltr</dfn>' or '<dfn
data-x="concept-rtl">rtl</dfn>', and is determined as per the first appropriate set of steps from
the following list:</p>
<p>The <dfn data-x="the directionality">directionality</dfn> of an element (any element, not just
Copy link
Contributor

@fantasai fantasai Aug 28, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it be appropriate to actually make this term actually be "directionality" rather than look like "directionality" in the defining instance but actually export/cross-link as "the directionality"? (maybe as a follow-up commit?) It's kinda weird as-is imho.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This term isn't exported at all.

The data-x is purely a HTML-internal mechanism and doesn't show up anywhere.

an <span data-x="HTML elements">HTML element</span>) is either '<dfn
data-x="concept-ltr">ltr</dfn>' or '<dfn data-x="concept-rtl">rtl</dfn>'. To compute the <span
data-x="the directionality">directionality</span> given an element <var>element</var>, switch on
<var>element</var>'s <code data-x="attr-dir">dir</code> attribute state:</p>

<dl class="switch">
<dt><span data-x="attr-dir-ltr-state">ltr</span></dt>
<dd><p>Return '<span data-x="concept-ltr">ltr</span>'.</p></dd>

<dt><span data-x="attr-dir-rtl-state">rtl</span></dt>
<dd><p>Return '<span data-x="concept-rtl">rtl</span>'.</p></dd>

<dt>If the element's <code data-x="attr-dir">dir</code> attribute is in the <span
data-x="attr-dir-ltr-state">ltr</span> state</dt>

<dt>If the element is a <span>document element</span> and the <code data-x="attr-dir">dir</code>
attribute is not in a defined state (i.e. it is not present or has an invalid value)</dt>

<dt>If the element is an <code>input</code> element whose <code
data-x="attr-input-type">type</code> attribute is in the <span
data-x="attr-input-type-tel">Telephone</span> state, and the <code data-x="attr-dir">dir</code>
attribute is not in a defined state (i.e. it is not present or has an invalid value)</dt>

<dd><p><span>The directionality</span> of the element is '<span
data-x="concept-ltr">ltr</span>'.</p></dd>


<dt>If the element's <code data-x="attr-dir">dir</code> attribute is in the <span
data-x="attr-dir-rtl-state">rtl</span> state</dt>

<dd><p><span>The directionality</span> of the element is '<span
data-x="concept-rtl">rtl</span>'.</p></dd>

<dt>If the element is an <code>input</code> element whose <code
data-x="attr-input-type">type</code> attribute is in the <span
data-x="attr-input-type-text">Text</span>, <span data-x="attr-input-type-search">Search</span>,
<span data-x="attr-input-type-tel">Telephone</span>, <span
data-x="attr-input-type-url">URL</span>, or <span data-x="attr-input-type-email">Email</span>
state, and the <code data-x="attr-dir">dir</code> attribute is in the <span
data-x="attr-dir-auto-state">auto</span> state</dt>

<dt>If the element is a <code>textarea</code> element and the <code data-x="attr-dir">dir</code>
attribute is in the <span data-x="attr-dir-auto-state">auto</span> state</dt>
<dt><span data-x="attr-dir-auto-state">auto</span></dt>
<dd><p>Return the <span>auto directionality</span> of <var>element</var>.</p></dd>

<dt><span data-x="attr-dir-undefined-state">undefined</span></dt>
<dd>
<p>If the element's <span data-x="concept-fe-value">value</span> contains a character of
bidirectional character type AL or R, and there is no character of bidirectional character type
L anywhere before it in the element's <span data-x="concept-fe-value">value</span>, then
<span>the directionality</span> of the element is '<span data-x="concept-rtl">rtl</span>'.
<ref>BIDI</ref></p>
<ol>
<li><p>If <var>element</var> is a <code>bdi</code> element, then return the <span>auto
directionality</span> of <var>element</var>.</p></li>

<p>Otherwise, if the element's <span data-x="concept-fe-value">value</span> is not the empty
string, or if the element is a <span>document element</span>, <span>the directionality</span> of
the element is '<span data-x="concept-ltr">ltr</span>'.</p>
<li><p>If <var>element</var> is an <code>input</code> element whose <code
data-x="attr-input-type">type</code> attribute is in the <span
data-x="attr-input-type-tel">Telephone</span> state, then return '<span
data-x="concept-ltr">ltr</span>'.</p></li>

<p>Otherwise, <span>the directionality</span> of the element is the same as the element's parent
element's <span data-x="the directionality">directionality</span>.</p>
<li><p>Return the <span>parent directionality</span> of <var>element</var>.</p></li>
annevk marked this conversation as resolved.
Show resolved Hide resolved
</ol>
</dd>
</dl>

<p>To compute the <dfn>auto directionality</dfn> given an element <var>element</var>:</p>

<ol>
<li>
<p>If <var>element</var> is an <code>input</code> element whose <code
data-x="attr-input-type">type</code> attribute is in the <span
data-x="attr-input-type-text">Text</span>, <span data-x="attr-input-type-search">Search</span>,
<span data-x="attr-input-type-tel">Telephone</span>, <span
data-x="attr-input-type-url">URL</span>, or <span data-x="attr-input-type-email">Email</span>
state, or <var>element</var> is a <code>textarea</code> element, then:</p>

<dt>If the element's <code data-x="attr-dir">dir</code> attribute is in the <span
data-x="attr-dir-auto-state">auto</span> state</dt>

<dt>If the element is a <code>bdi</code> element and the <code data-x="attr-dir">dir</code>
attribute is not in a defined state (i.e. it is not present or has an invalid value)</dt>
<ol>
<li><p>If <var>element</var>'s <span data-x="concept-fe-value">value</span> contains a
character of bidirectional character type AL or R, and there is no character of bidirectional
character type L anywhere before it in the element's <span
data-x="concept-fe-value">value</span>, then return '<span data-x="concept-rtl">rtl</span>'.
<ref>BIDI</ref></p></li>

<dd>
<p>Find the first character in <span>tree order</span> that matches the following criteria:</p>
<li><p>If <var>element</var>'s <span data-x="concept-fe-value">value</span> is not the empty
string, then return '<span data-x="concept-ltr">ltr</span>'.</p></li>

<ul>
<li><p>Return the <span>parent directionality</span> of <var>element</var>.</p></li>
</ol>
</li>

annevk marked this conversation as resolved.
Show resolved Hide resolved
<li><p>The character is from a <code>Text</code> node that is a descendant of the element whose
<span data-x="the directionality">directionality</span> is being determined.</p></li>
<li><p>Let <var>codePoint</var> be null.</p></li>

<li><p>The character is of bidirectional character type L, AL, or R. <ref>BIDI</ref></li>
<li>
<p>For each <code>Text</code> node <var>text</var> that is a descendant of <var>element</var>,
in <span>tree order</span>:</p>

<ol>
<li>
<p>The character is not in a <code>Text</code> node that has an ancestor element that is a
descendant of the element whose <span data-x="the directionality">directionality</span> is
being determined and that is either:</p>
<p>If <var>text</var> has an ancestor element that is a descendant of <var>element</var> and
is also one of</p>
annevk marked this conversation as resolved.
Show resolved Hide resolved

<ul class="brief">
<li>A <code>bdi</code> element.
<li>A <code>script</code> element.
<li>A <code>style</code> element.
<li>A <code>textarea</code> element.
<li>An element with a <code data-x="attr-dir">dir</code> attribute in a defined state.
<li>a <code>bdi</code> element</li>
<li>a <code>script</code> element</li>
<li>a <code>style</code> element</li>
<li>a <code>textarea</code> element</li>
<li>an element whose <code data-x="attr-dir">dir</code> attribute is not in the <span
data-x="attr-dir-undefined-state">undefined</span> state</li>
</ul>

<p>then <span>continue</span>.</p>
</li>

</ul>
<li><p>If <var>text</var>'s <span data-x="concept-cd-data">data</span> does not contain a code
point whose bidirectional character type is L, AL, or R, then <span>continue</span>.
<ref>BIDI</ref></p></li>

<p>If such a character is found and it is of bidirectional character type AL or R, <span>the
directionality</span> of the element is '<span data-x="concept-rtl">rtl</span>'.</p>
<li><p>Set <var>codePoint</var> to the first code point in <var>text</var>'s <span
data-x="concept-cd-data">data</span> whose bidirectional character type is L, AL, or
R.</p></li>

<p>If such a character is found and it is of bidirectional character type L, <span>the
directionality</span> of the element is '<span data-x="concept-ltr">ltr</span>'.</p>
<li><p><span>Break</span>.</p></li>
</ol>
annevk marked this conversation as resolved.
Show resolved Hide resolved
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would combine these last two bullet points as ", then break", to mirror the structure of the previous line's ", then continue".

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We use then after an if statement, but not after a set. They could be combined with "and", but this is clearer.

</li>

<p>Otherwise, if the element is a <span>document element</span>, <span>the directionality</span>
of the element is '<span data-x="concept-ltr">ltr</span>'.</p>
<li><p>If <var>codePoint</var> is null, then return the <span>parent directionality</span> of
annevk marked this conversation as resolved.
Show resolved Hide resolved
<var>element</var>.</p></li>

<p>Otherwise, <span>the directionality</span> of the element is the same as the element's parent
element's <span data-x="the directionality">directionality</span>.</p>
</dd>
<li><p>If <var>codePoint</var> is of bidirectional character type AL or R, then return '<span
annevk marked this conversation as resolved.
Show resolved Hide resolved
data-x="concept-rtl">rtl</span>'.</p></li>

<li><p>If <var>codePoint</var> is of bidirectional character type L, then return '<span
data-x="concept-ltr">ltr</span>'.</p></li>
Copy link
Contributor

@fantasai fantasai Aug 28, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this comment got lost in the GitHub interface, so copying it out here:

Might consider putting "If codepoint is ..." as a switch with 3 branches rather than 3 independent steps. They're not really ordered steps...

This helps group them conceptually, which imho makes the algorithm a little more structured and easier to understand as a series of higher-level steps.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like it as ordered steps; it's more clear how to translate into code.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If the tests were of a different nature, that's more reasonable, but I think when it's purely dispatching based on different categorization of a single variable that's precisely what we have <dl class=switch> for.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not if the type of check you do on the variable differs.

</ol>

<dt>If the element has a parent element and the <code data-x="attr-dir">dir</code> attribute is
not in a defined state (i.e. it is not present or has an invalid value)</dt>
<p>To compute the <dfn>parent directionality</dfn> given an element <var>element</var>:</p>

<dd><p><span>The directionality</span> of the element is the same as the element's parent
element's <span data-x="the directionality">directionality</span>.</p></dd>
</dl>
<ol>
<li><p>If <var>element</var> has no <span>parent element</span>, then return '<span
data-x="concept-ltr">ltr</span>'.</p></li>

<li><p>Return <span data-x="the directionality">directionality</span> of <var>element</var>'s
<span data-x="parent element">parent</span>.</p></li>
</ol>

<p class="note">Since the <code data-x="attr-dir">dir</code> attribute is only defined for
<span>HTML elements</span>, it cannot be present on elements from other namespaces. Thus, elements
from other namespaces always just inherit their <span data-x="the
directionality">directionality</span> from their parent element, or, if they don't have one,
default to '<span data-x="concept-ltr">ltr</span>'.</p>
from other namespaces always end up using the <span>parent directionality</span>.</p>
annevk marked this conversation as resolved.
Show resolved Hide resolved

<div w-nodev>

Expand Down