Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.Sign up
Title: [Shadow]: Find a way for selection to work across shadow DOM subtrees (bugzilla: 15444)
Migrated from: https://www.w3.org/Bugs/Public/show_bug.cgi?id=15444
As specified in http://dvcs.w3.org/hg/webcomponents/rev/3fb19f98bead, window.getSelection() may never retrieve content from shadow DOM subtrees. Also, a user can't select content from both document tree and shadow DOM tree. We must fix that somehow.
Should we allow shadow DOM subtrees to specify whether they want to be treated as part of "as-rendered" structure or as a separate subtree?
Currently, for getSelection(), the WebKit implementation returns serialized value of the Selection object inside of a shadow DOM subtree, but node values are adjusted to avoid leaking shadow DOM nodes.
This is an important UX concern. I think it's fine to limit access to selection data as defined by the spec. However, users expect to be able to select and copy text in a web page. To have that limited by invisible ShadowDOM boundaries would be very annoying. Ideally, this just always works and is separate from the encapsulation provided via ShadowDOM.
One thing that Jonas suggested at the recent spec review is to make our selection language non-normative. It's a tough subject, so we shouldn't freeze this into the spec. The suggestion was to have the language along these lines:
"Selection is not defined. Implementation should do their best to do what's best for them. Here's one possible, admittedly naive way: <insert current normative wording, but make it informative>"
(In reply to Dimitri Glazkov from comment #3)
I'll keep this bug open until we have a better model, that is a tough issue for us.
(In reply to Hayato Ito from comment #4)
Maybe kill the 6.1.1 section title and remove the musty language from the non-normative parts?
(In reply to Dimitri Glazkov from comment #5)
Sure. Done at
*** Bug 25038 has been marked as a duplicate of this bug. ***
Status Update: This bug is still on our radar, but we couldn't spend much time on this issue in terms of the spec.
FYI. In Blink, we are working on supporting selection across shadow boundaries 1. However, there is no update on API in the spec yet.
I proposed updating Selection API for Shadow in TPAC:
@smaug----, do you have any opinion?
@yoichio and @rniwa (and others) discussed the topic off-meeting-room, which is not captured in the meeting notes. In a nutshell, I understand @rniwa's idea is to preserve the both ends of selection via opaque handles to point somewhere in the whole tree, not explicit node + offset pairs. Lots of details to be fleshed out, but sounded a feasible idea.
Basically, the idea is to provide a mechanism to refer to a specific position within a shadow DOM with a mechanism that can be also used to refer to a specific position in pseudo element, SVG use element's shadow tree, etc...
It's probably sensible to introduce an interface on
We also discussed that we need a mechanism to pick a mode between having a separate selection & having a selection that's shared with the parent tree. e.g. if you're creating an editor, you may want to have its own selection whereas if you're just an article, you probably want the selection to be shared with the rest of the document.
So the idea is to use (shadowHost, position identifier) pair for selection start & end where position identifier is an author-script defined location within each shadow tree. If a position lies within another shadow tree, then the identifier (some integer) should be able to distinguish any selection end points within the inner shadow tree (recursively).
For pseudo element, textarea, input, SVG use element, etc... UA defines this identifier (probably needs to be spec'ed).
…e drag https://bugs.webkit.org/show_bug.cgi?id=151380 <rdar://problem/24363872> Source/WebCore: Reviewed by Antti Koivisto and Wenson Hsieh. This patch adds the basic support for selecting content across shadow DOM boundaries to VisibleSelection, which is enough to allow users to select content across shadow DOM boundaries via a mouse drag. This is the first step in allowing users to select, copy and paste content across shadow DOM boundaries, which is a serious user experience regression right now. The new behavior is disabled by default under an interal debug feature flag: selectionAcrossShadowBoundariesEnabled. Like Chrome, we are not going to support selecting editable content across shadow DOM boundaries since we'd have to generalize every editing commands to make that work, and there aren't any HTML editors that use shadow DOM boundaries within an editable region yet. For simplicity, we also don't support extending a selection out of a shadow root which resides inside an editing region. The keyboard based navigation & manipulation of selection as well as allowing copy & paste of content across shadow DOM boundaries will be implemented by separate patches. DOMSelection will not expose this new behavior either. This is tracked in the spec as w3c/webcomponents#79 Tests: editing/selection/selection-across-shadow-boundaries-mixed-editability-1.html editing/selection/selection-across-shadow-boundaries-mixed-editability-2.html editing/selection/selection-across-shadow-boundaries-mixed-editability-3.html editing/selection/selection-across-shadow-boundaries-mixed-editability-4.html editing/selection/selection-across-shadow-boundaries-mixed-editability-5.html editing/selection/selection-across-shadow-boundaries-readonly-1.html editing/selection/selection-across-shadow-boundaries-readonly-2.html editing/selection/selection-across-shadow-boundaries-readonly-3.html editing/selection/selection-across-shadow-boundaries-user-select-all-1.html * editing/VisibleSelection.cpp: (WebCore::isInUserAgentShadowRootOrHasEditableShadowAncestor): Added. (WebCore::VisibleSelection::adjustSelectionToAvoidCrossingShadowBoundaries): When the feature is enabled, allow crossing shadow DOM boundaries except when either end is inside an user agent shadow root, or one of its shadow includign ancestor is inside an editable region. The latter check is needed to disallow an extension of a selection starting in a shadow tree inside a non-editable region inside an editable region to outside the editable region. The rest of the editing code is not ready to deal with selection like that. * page/Settings.yaml: Added an internal debug feature to enable this new behavior. Source/WebKit: Reviewed by Antti Koivisto. Added SelectionAcrossShadowBoundariesEnabled as an internal debug feature, and moved CSSCustomPropertiesAndValuesEnabled to where other experimental features are located. * Shared/WebPreferences.yaml: Source/WebKitLegacy/mac: Reviewed by Wenson Hsieh. Added selectionAcrossShadowBoundariesEnabled as a preference to be used in DumpRenderTree. * WebView/WebPreferenceKeysPrivate.h: * WebView/WebPreferences.mm: (+[WebPreferences initialize]): (-[WebPreferences selectionAcrossShadowBoundariesEnabled]): (-[WebPreferences setSelectionAcrossShadowBoundariesEnabled:]): * WebView/WebPreferencesPrivate.h: * WebView/WebView.mm: (-[WebView _preferencesChanged:]): Tools: Reviewed by Wenson Hsieh. Added the support for internal:selectionAcrossShadowBoundariesEnabled test option. * DumpRenderTree/TestOptions.cpp: (TestOptions::TestOptions): * DumpRenderTree/TestOptions.h: * DumpRenderTree/mac/DumpRenderTree.mm: (resetWebPreferencesToConsistentValues): (setWebPreferencesForTestOptions): LayoutTests: Reviewed by Antti Koivisto and Wenson Hsieh. Added regression tests using ref tests since getSelection() doesn't expose any node inside a shadow tree. * editing/selection/selection-across-shadow-boundaries-mixed-editability-1-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-1.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-2-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-2.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-3-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-3.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-4-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-4.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-5-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-mixed-editability-5.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-1-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-1.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-2-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-2.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-3-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-readonly-3.html: Added. * editing/selection/selection-across-shadow-boundaries-user-select-all-1-expected.html: Added. * editing/selection/selection-across-shadow-boundaries-user-select-all-1.html: Added. git-svn-id: http://svn.webkit.org/repository/webkit/trunk@236519 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Recently did some research on practical aspects while trying to get a WYSIWYG editor working in Shadow DOM, submitted the report to the polyfill repo: https://github.com/webcomponents/shadydom/issues/113#issuecomment-427066346
Hope to see some progress on this topic after F2F in October.
You'll find an example of it not working here: https://github.com/ckeditor/ckeditor5-engine/issues/692#issuecomment-427027745
Rough consensus at TPAC F2F:
Action Item: Figure out what happens to each method in