Integrate OpaqueRange hooks into text controls (input/textarea) #11741
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
stephanieyzhang
changed the title
stephanieyzhang
changed the title
This was referenced Oct 9, 2025
stephanieyzhang
changed the title
stephanieyzhang
changed the title
annevk
reviewed
Jan 15, 2026
Member
annevk
left a comment
annevk
left a comment
There was a problem hiding this comment.
Where is "supports opaque ranges" defined?
| <th> <code data-x="dom-textarea/input-getValueRange">getValueRange()</code> | ||
| <td class="no"> · <!-- Hidden --> | ||
| <td class="yes"> Yes <!-- Text --> | ||
| <td class="yes"> Yes <!-- Search --> |
Member
There was a problem hiding this comment.
This seems wrong. Text and Search are the same column.
| <li><p>Let <var>delta</var> be <var>replacementLength</var> minus (<var>replaceEnd</var> − <var>replaceStart</var>).</p></li> | ||
|
|
||
| <li> | ||
| <p>For each <code data-x="dom-Range-OpaqueRange">OpaqueRange</code> object <var>range</var> associated with <var>element</var>, |
Member
There was a problem hiding this comment.
If elements have to hold onto a range object we should make that explicit.
| <ol> | ||
| <li> | ||
| <p>For each boundary offset of <var>range</var> (its <code data-x="dom-AbstractRange-startOffset">startOffset</code> and its | ||
| <code data-x="dom-AbstractRange-endOffset">endOffset</code>), run these substeps:</p> |
Member
There was a problem hiding this comment.
I think this also needs some rewording. Perhaps you can define a set of steps and then run them for both. But we also don't want to reference public API in the user agent processing model.
| <code data-x="dom-AbstractRange-endOffset">endOffset</code>), run these substeps:</p> | ||
|
|
||
| <ol> | ||
| <li><p>If the boundary offset is less than or equal to <var>replaceStart</var>, then continue.</p></li> |
Member
There was a problem hiding this comment.
continue needs to be referenced.
| <p>The <code data-x="dom-textarea-defaultValue">defaultValue</code> attribute's setter must | ||
| <span>string replace all</span> with the given value within this element.</p> | ||
| <span>string replace all</span> with the given value within this element. | ||
| If this changes the element's <span data-x="concept-textarea-raw-value">raw value</span>, and the |
Member
There was a problem hiding this comment.
We generally don't accept COMEFROM. And string replace all always changes the underlying node so "if this changes" is kinda moot anyway.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
OpaqueRange is a specialized, live AbstractRange subtype whose endpoints are offsets into a host-defined opaque string (e.g. the value space of
<input>/<textarea>today, with a path to custom elements in the future). It enables range-based operations over encapsulated value text while avoiding exposure of internal DOM nodes.Explainer: https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/OpaqueRange/explainer.md
WhatWG discussion: FormControlRange Interface #11478
Corresponding DOM Spec PR: Add OpaqueRange interface dom#1404
Corresponding CSSOM PR: [cssom-view-1] Define OpaqueRange geometry APIs (getClientRects/getBoundingClientRect) w3c/csswg-drafts#12904
At least two implementers are interested (and none opposed):
Tests are written and can be reviewed and commented upon at:
Implementation bugs are filed:
Corresponding HTML AAM & ARIA in HTML issues & PRs:
MDN issue is filed: …
The top of this comment includes a clear commit message to use.
(See WHATWG Working Mode: Changes for more details.)
/form-control-infrastructure.html ( diff )
/form-elements.html ( diff )
/index.html ( diff )
/input.html ( diff )