prosemirror: Does not work in Shadow DOM in Safari 10.

When ProseMirror adopts an element inside a Shadow DOM in Safari 10, an exception is thrown.

The reason appears to be that in Safari 10 the extensions to DocumentOrShadowRoot don’t appear to have all been applied to the shadow root.

This means that in rangeToDOM, getSelection is undefined, which when invoked throws an exception.

var sel = this.pm.root.getSelection(),

We’ve raised https://bugs.webkit.org/show_bug.cgi?id=163921 to track this against Safari.

About this issue

Original URL
State: open
Created 8 years ago
Reactions: 5
Comments: 24 (11 by maintainers)

Commits related to this issue

Distinguish between DOM Selection objects and selection ranges FIX: Work around the five-year-old Safari bug where it won't accurately report the selection inside shadow roots, which would break Pros... — committed to ProseMirror/prosemirror-view by marijnh 2 years ago
Add an updateRoot method FEATURE: The new `EditorView.updateRoot` method can be used to make the editor update its DOM root when it is moved to a new document or shadow tree. Issue https://github.co... — committed to ProseMirror/prosemirror-view by marijnh 9 months ago

Most upvoted comments

We found a (somehow horrible) kludge for this in CodeMirror 6 that seems to mostly work. If this is still important for someone, we could look into porting that to ProseMirror.

marijnh on May 1, 2021

Could people who are interested in this issue test the current master branch?

marijnh on Sep 30, 2022

I’ve tagged this as 1.28.3

marijnh on Oct 5, 2022

Tagged as 1.32.0

marijnh on Sep 27, 2023

Looks like this might be an answer: https://github.com/GoogleChromeLabs/shadow-selection-polyfill

Could just flag in docs and encourage users to bundle the polyfill for safari. Note haven’t tested it myself yet, was just released. Will spin up a fresh env to see if it resolves the issue when I get a mo.

madeleineostoja on Apr 19, 2018