Allow scrolling to initial EditorState's selection #196
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "sch/prosemirror-view:initial-focus"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
I support an app where we need to be able to preserve the user's rough scroll position when re-opening a document. It's not enough to keep track of the scroll offset: we keep track of the pos and both focus the document and scroll you to it once the view exists.
For some time, we've needed to add a 50ms delay before calling
tr.scrollIntoView(). This patch to the demo app simulates it, scrolling to the text at the bottom of the editor:I tracked this down the other day to #1503. That fix makes sense: you want to guard against selection in another editor being used as the starting point for the
scrollRectIntoViewwalk. Instead of returning early though, we should fall back to the dom element of the view that is handling the scroll. That's what this commit does, allowing the scroll position to be adjusted even if the editor is not yet focused.Let me know if this patch works for you or if there's a better way to initialize the view.
I support an app where we need to be able to preserve the user's rough scroll position when re-opening a document. It's not enough to keep track of that offset: we keep track of the pos and both focus the document and scroll you to it once the view exists. For some time, we've needed to add a 50ms delay before calling `tr.scrollIntoView()`. This patch to the demo app simulates it, scrolling to the text at the bottom of the editor: `` diff --git a/demo/demo.css b/demo/demo.css index 06bfe78..813bf22 100644 --- a/demo/demo.css +++ b/demo/demo.css @@ -17,6 +17,8 @@ textarea { .full { max-width: 50em; + height: 300px; + overflow-y: auto; } .marked { diff --git a/demo/demo.ts b/demo/demo.ts index 48e2c34..80632ec 100644 --- a/demo/demo.ts +++ b/demo/demo.ts @@ -1,6 +1,6 @@ import {Schema, DOMParser} from "prosemirror-model" import {EditorView} from "prosemirror-view" -import {EditorState} from "prosemirror-state" +import {EditorState, TextSelection} from "prosemirror-state" import {schema} from "prosemirror-schema-basic" import {addListNodes} from "prosemirror-schema-list" import {exampleSetup} from "prosemirror-example-setup" @@ -10,7 +10,13 @@ const demoSchema = new Schema({ marks: schema.spec.marks }) -let state = EditorState.create({doc: DOMParser.fromSchema(demoSchema).parse(document.querySelector("#content")!), - plugins: exampleSetup({schema: demoSchema})}) +const doc = DOMParser.fromSchema(demoSchema).parse(document.querySelector("#content")!) +const state = EditorState.create({ + doc, + selection: TextSelection.atEnd(doc), + plugins: exampleSetup({schema: demoSchema}) +}) -;(window as any).view = new EditorView(document.querySelector(".full"), {state}) +const view = new EditorView(document.querySelector(".full"), {state}) +view.dispatch(view.state.tr.scrollIntoView()) +;(window as any).view = view diff --git a/demo/index.html b/demo/index.html index 4b76a94..e9ad42c 100644 --- a/demo/index.html +++ b/demo/index.html @@ -13,6 +13,7 @@ <div class="full"></div> + <div id=content style="display: none"> <h2>Demonstration Text</h2> ``` I tracked this down the other day to #1503. That fix makes sense: you want to guard against selection in another editor being used as the starting point for the `scrollRectIntoView` walk. Instead of returning early though, we should fall back to the dom element of the view that is handling the scroll. That's what this commit does, allowing the scroll position to be adjusted even if the editor is not yet focused. Let me know if this patch works for you or if there's a better way to initialize the view@ -239,2 +237,2 @@// Ignore selections outside the editor} else if (this.someProp("handleScrollToSelection", f => f(this))) {let focusNode = this.domSelectionRange().focusNodelet startDOM = focusNode && this.dom.contains(focusNode) ? focusNode : this.domI dropped the
nodeTypecheck the previous code had. Seems to work just fine for text nodes and element nodes alike, but maybe I'm missing something.Allow scrolling to intiial EditorState's selectionto Allow scrolling to initial EditorState's selectionView command line instructions
Checkout
From your project repository, check out a new branch and test the changes.Merge
Merge the changes and update on Forgejo.Warning: The "Autodetect manual merge" setting is not enabled for this repository, you will have to mark this pull request as manually merged afterwards.