@codemirror/view 0.19.32 → 0.19.36

package/CHANGELOG.md

@@ -1,3 +1,45 @@
+## 0.19.36 (2021-12-22)
+
+### Bug fixes
+
+Fix a crash in `posAtCoords` when the position lies in a block widget that is rendered but scrolled out of view.
+
+Adding block decorations from a plugin now raises an error. Replacing decorations that cross lines are ignored, when provided by a plugin.
+
+Fix inverted interpretation of the `precise` argument to `posAtCoords`.
+
+## 0.19.35 (2021-12-20)
+
+### Bug fixes
+
+The editor will now handle double-taps as if they are double-clicks, rather than letting the browser's native behavior happen (because the latter often does the wrong thing).
+
+Fix an issue where backspacing out a selection on Chrome Android would sometimes only delete the last character due to event order issues.
+
+`posAtCoords`, without second argument, will no longer return null for positions below or above the document.
+
+## 0.19.34 (2021-12-17)
+
+### Bug fixes
+
+Fix a bug where content line elements would in some cases lose their `cm-line` class. Move test to scrollIntoView
+
+## 0.19.33 (2021-12-16)
+
+### Breaking changes
+
+`EditorView.scrollTo` and `EditorView.centerOn` are deprecated in favor of `EditorView.scrollIntoView`, and will be removed in the next breaking release.
+
+### Bug fixes
+
+Fix an issue that could cause the editor to unnecessarily interfere with composition (especially visible on macOS Chrome).
+
+A composition started with multiple lines selected will no longer be interruptd by the editor.
+
+### New features
+
+The new `EditorView.scrollIntoView` function allows you to do more fine-grained scrolling.
+
 ## 0.19.32 (2021-12-15)
 
 ### Bug fixes

package/dist/index.cjs

@@ -101,8 +101,7 @@ function windowRect(win) {
     return { left: 0, right: win.innerWidth,
         top: 0, bottom: win.innerHeight };
 }
-const ScrollSpace = 5;
-function scrollRectIntoView(dom, rect, side, center) {
+function scrollRectIntoView(dom, rect, side, x, y, xMargin, yMargin, ltr) {
     let doc = dom.ownerDocument, win = doc.defaultView;
     for (let cur = dom; cur;) {
         if (cur.nodeType == 1) { // Element
@@ -121,38 +120,42 @@ function scrollRectIntoView(dom, rect, side, center) {
                     top: rect.top, bottom: rect.top + cur.clientHeight };
             }
             let moveX = 0, moveY = 0;
-            if (center) {
+            if (y == "nearest") {
+                if (rect.top < bounding.top) {
+                    moveY = -(bounding.top - rect.top + yMargin);
+                    if (side > 0 && rect.bottom > bounding.bottom + moveY)
+                        moveY = rect.bottom - bounding.bottom + moveY + yMargin;
+                }
+                else if (rect.bottom > bounding.bottom) {
+                    moveY = rect.bottom - bounding.bottom + yMargin;
+                    if (side < 0 && (rect.top - moveY) < bounding.top)
+                        moveY = -(bounding.top + moveY - rect.top + yMargin);
+                }
+            }
+            else {
                 let rectHeight = rect.bottom - rect.top, boundingHeight = bounding.bottom - bounding.top;
-                let targetTop;
-                if (rectHeight <= boundingHeight)
-                    targetTop = rect.top + rectHeight / 2 - boundingHeight / 2;
-                else if (side < 0)
-                    targetTop = rect.top - ScrollSpace;
-                else
-                    targetTop = rect.bottom + ScrollSpace - boundingHeight;
+                let targetTop = y == "center" && rectHeight <= boundingHeight ? rect.top + rectHeight / 2 - boundingHeight / 2 :
+                    y == "start" || y == "center" && side < 0 ? rect.top - yMargin :
+                        rect.bottom - boundingHeight + yMargin;
                 moveY = targetTop - bounding.top;
-                if (Math.abs(moveY) <= 1)
-                    moveY = 0;
-            }
-            else if (rect.top < bounding.top) {
-                moveY = -(bounding.top - rect.top + ScrollSpace);
-                if (side > 0 && rect.bottom > bounding.bottom + moveY)
-                    moveY = rect.bottom - bounding.bottom + moveY + ScrollSpace;
-            }
-            else if (rect.bottom > bounding.bottom) {
-                moveY = rect.bottom - bounding.bottom + ScrollSpace;
-                if (side < 0 && (rect.top - moveY) < bounding.top)
-                    moveY = -(bounding.top + moveY - rect.top + ScrollSpace);
             }
-            if (rect.left < bounding.left) {
-                moveX = -(bounding.left - rect.left + ScrollSpace);
-                if (side > 0 && rect.right > bounding.right + moveX)
-                    moveX = rect.right - bounding.right + moveX + ScrollSpace;
+            if (x == "nearest") {
+                if (rect.left < bounding.left) {
+                    moveX = -(bounding.left - rect.left + xMargin);
+                    if (side > 0 && rect.right > bounding.right + moveX)
+                        moveX = rect.right - bounding.right + moveX + xMargin;
+                }
+                else if (rect.right > bounding.right) {
+                    moveX = rect.right - bounding.right + xMargin;
+                    if (side < 0 && rect.left < bounding.left + moveX)
+                        moveX = -(bounding.left + moveX - rect.left + xMargin);
+                }
             }
-            else if (rect.right > bounding.right) {
-                moveX = rect.right - bounding.right + ScrollSpace;
-                if (side < 0 && rect.left < bounding.left + moveX)
-                    moveX = -(bounding.left + moveX - rect.left + ScrollSpace);
+            else {
+                let targetLeft = x == "center" ? rect.left + (rect.right - rect.left) / 2 - (bounding.right - bounding.left) / 2 :
+                    (x == "start") == ltr ? rect.left - xMargin :
+                        rect.right - (bounding.right - bounding.left) + xMargin;
+                moveX = targetLeft - bounding.left;
             }
             if (moveX || moveY) {
                 if (top) {
@@ -176,7 +179,7 @@ function scrollRectIntoView(dom, rect, side, center) {
             if (top)
                 break;
             cur = cur.assignedSlot || cur.parentNode;
-            center = false;
+            x = y = "nearest";
         }
         else if (cur.nodeType == 11) { // A shadow root
             cur = cur.host;
@@ -263,6 +266,10 @@ function getRoot(node) {
     }
     return null;
 }
+function clearAttributes(node) {
+    while (node.attributes.length)
+        node.removeAttributeNode(node.attributes[0]);
+}
 
 class DOMPos {
     constructor(node, offset, precise = true) {
@@ -309,14 +316,16 @@ class ContentView {
     // given position.
     coordsAt(_pos, _side) { return null; }
     sync(track) {
-        var _a;
         if (this.dirty & 2 /* Node */) {
             let parent = this.dom;
             let pos = parent.firstChild;
             for (let child of this.children) {
                 if (child.dirty) {
-                    if (!child.dom && pos && !((_a = ContentView.get(pos)) === null || _a === void 0 ? void 0 : _a.parent))
-                        child.reuseDOM(pos);
+                    if (!child.dom && pos) {
+                        let contentView = ContentView.get(pos);
+                        if (!contentView || !contentView.parent && contentView.constructor == child.constructor)
+                            child.reuseDOM(pos);
+                    }
                     child.sync(track);
                     child.dirty = 0 /* Not */;
                 }
@@ -344,7 +353,7 @@ class ContentView {
                 }
         }
     }
-    reuseDOM(_dom) { return false; }
+    reuseDOM(_dom) { }
     localPosFromDOM(node, offset) {
         let after;
         if (node == this.dom) {
@@ -643,10 +652,8 @@ class TextView extends ContentView {
         }
     }
     reuseDOM(dom) {
-        if (dom.nodeType != 3)
-            return false;
-        this.createDOM(dom);
-        return true;
+        if (dom.nodeType == 3)
+            this.createDOM(dom);
     }
     merge(from, to, source) {
         if (source && (!(source instanceof TextView) || this.length - (to - from) + source.length > MaxJoinLen))
@@ -681,18 +688,26 @@ class MarkView extends ContentView {
         for (let ch of children)
             ch.setParent(this);
     }
-    createDOM() {
-        let dom = document.createElement(this.mark.tagName);
+    setAttrs(dom) {
+        clearAttributes(dom);
         if (this.mark.class)
             dom.className = this.mark.class;
         if (this.mark.attrs)
             for (let name in this.mark.attrs)
                 dom.setAttribute(name, this.mark.attrs[name]);
-        this.setDOM(dom);
+        return dom;
+    }
+    reuseDOM(node) {
+        if (node.nodeName == this.mark.tagName.toUpperCase()) {
+            this.setDOM(node);
+            this.dirty |= 4 /* Attrs */ | 2 /* Node */;
+        }
     }
     sync(track) {
-        if (!this.dom || (this.dirty & 4 /* Attrs */))
-            this.createDOM();
+        if (!this.dom)
+            this.setDOM(this.setAttrs(document.createElement(this.mark.tagName)));
+        else if (this.dirty & 4 /* Attrs */)
+            this.setAttrs(this.dom);
         super.sync(track);
     }
     merge(from, to, source, _hasStart, openStart, openEnd) {
@@ -836,8 +851,7 @@ class WidgetView extends ContentView {
 }
 class CompositionView extends WidgetView {
     domAtPos(pos) { return new DOMPos(this.widget.text, pos); }
-    sync() { if (!this.dom)
-        this.setDOM(this.widget.toDOM()); }
+    sync() { this.setDOM(this.widget.toDOM()); }
     localPosFromDOM(node, offset) {
         return !offset ? 0 : node.nodeType == 3 ? Math.min(offset, this.length) : this.length;
     }
@@ -1302,13 +1316,24 @@ class LineView extends ContentView {
     domAtPos(pos) {
         return inlineDOMAtPos(this.dom, this.children, pos);
     }
+    reuseDOM(node) {
+        if (node.nodeName == "DIV") {
+            this.setDOM(node);
+            this.dirty |= 4 /* Attrs */ | 2 /* Node */;
+        }
+    }
     sync(track) {
         var _a;
-        if (!this.dom || (this.dirty & 4 /* Attrs */)) {
+        if (!this.dom) {
             this.setDOM(document.createElement("div"));
             this.dom.className = "cm-line";
             this.prevAttrs = this.attrs ? null : undefined;
         }
+        else if (this.dirty & 4 /* Attrs */) {
+            clearAttributes(this.dom);
+            this.dom.className = "cm-line";
+            this.prevAttrs = this.attrs ? null : undefined;
+        }
         if (this.prevAttrs !== undefined) {
             updateAttrs(this.dom, this.prevAttrs, this.attrs);
             this.dom.classList.add("cm-line");
@@ -1347,16 +1372,17 @@ class LineView extends ContentView {
     become(_other) { return false; }
     get type() { return exports.BlockType.Text; }
     static find(docView, pos) {
-        for (let i = 0, off = 0;; i++) {
+        for (let i = 0, off = 0; i < docView.children.length; i++) {
             let block = docView.children[i], end = off + block.length;
             if (end >= pos) {
                 if (block instanceof LineView)
                     return block;
-                if (block.length)
-                    return null;
+                if (end > pos)
+                    break;
             }
             off = end + block.breakAfter;
         }
+        return null;
     }
 }
 class BlockWidgetView extends ContentView {
@@ -1417,10 +1443,11 @@ class BlockWidgetView extends ContentView {
 }
 
 class ContentBuilder {
-    constructor(doc, pos, end) {
+    constructor(doc, pos, end, disallowBlockEffectsBelow) {
         this.doc = doc;
         this.pos = pos;
         this.end = end;
+        this.disallowBlockEffectsBelow = disallowBlockEffectsBelow;
         this.content = [];
         this.curLine = null;
         this.breakAtStart = 0;
@@ -1549,8 +1576,15 @@ class ContentBuilder {
         if (this.openStart < 0)
             this.openStart = openStart;
     }
-    static build(text, from, to, decorations) {
-        let builder = new ContentBuilder(text, from, to);
+    filterPoint(from, to, value, index) {
+        if (index >= this.disallowBlockEffectsBelow || !(value instanceof PointDecoration))
+            return true;
+        if (value.block)
+            throw new RangeError("Block decorations may not be specified via plugins");
+        return to < this.doc.lineAt(this.pos).to;
+    }
+    static build(text, from, to, decorations, pluginDecorationLength) {
+        let builder = new ContentBuilder(text, from, to, pluginDecorationLength);
         builder.openEnd = rangeset.RangeSet.spans(decorations, from, to, builder);
         if (builder.openStart < 0)
             builder.openStart = builder.openEnd;
@@ -1580,12 +1614,27 @@ const mouseSelectionStyle = state.Facet.define();
 const exceptionSink = state.Facet.define();
 const updateListener = state.Facet.define();
 const inputHandler = state.Facet.define();
+// FIXME remove
 const scrollTo = state.StateEffect.define({
     map: (range, changes) => range.map(changes)
 });
+// FIXME remove
 const centerOn = state.StateEffect.define({
     map: (range, changes) => range.map(changes)
 });
+class ScrollTarget {
+    constructor(range, y = "nearest", x = "nearest", yMargin = 5, xMargin = 5) {
+        this.range = range;
+        this.y = y;
+        this.x = x;
+        this.yMargin = yMargin;
+        this.xMargin = xMargin;
+    }
+    map(changes) {
+        return changes.empty ? this : new ScrollTarget(this.range.map(changes), this.y, this.x, this.yMargin, this.xMargin);
+    }
+}
+const scrollIntoView = state.StateEffect.define({ map: (t, ch) => t.map(ch) });
 /**
 Log or report an unhandled exception in client code. Should
 probably only be used by extension code that allows client code to
@@ -1658,11 +1707,13 @@ This field can be used by plugins to provide
 **Note**: For reasons of data flow (plugins are only updated
 after the viewport is computed), decorations produced by plugins
 are _not_ taken into account when predicting the vertical layout
-structure of the editor. Thus, things like large widgets or big
-replacements (i.e. code folding) should be provided through the
-state-level [`decorations` facet](https://codemirror.net/6/docs/ref/#view.EditorView^decorations),
-not this plugin field. Specifically, replacing decorations that
-cross line boundaries will break if provided through a plugin.
+structure of the editor. They **must not** introduce block
+widgets (that will raise an error) or replacing decorations that
+cover line breaks (these will be ignored if they occur). Such
+decorations, or others that cause a large amount of vertical
+size shift compared to the undecorated content, should be
+provided through the state-level [`decorations`
+facet](https://codemirror.net/6/docs/ref/#view.EditorView^decorations) instead.
 */
 PluginField.decorations = PluginField.define();
 /**
@@ -1895,8 +1946,6 @@ class ViewUpdate {
             view.inputState.notifiedFocused = focus;
             this.flags |= 1 /* Focus */;
         }
-        if (this.docChanged)
-            this.flags |= 2 /* Height */;
     }
     /**
     Tells you whether the [viewport](https://codemirror.net/6/docs/ref/#view.EditorView.viewport) or
@@ -1907,14 +1956,15 @@ class ViewUpdate {
         return (this.flags & 4 /* Viewport */) > 0;
     }
     /**
-    Indicates whether the line height in the editor changed in this update.
+    Indicates whether the height of an element in the editor changed
+    in this update.
     */
     get heightChanged() {
         return (this.flags & 2 /* Height */) > 0;
     }
     /**
-    Returns true when the document changed or the size of the editor
-    or the lines or characters within it has changed.
+    Returns true when the document was modified or the size of the
+    editor, or elements within the editor, changed.
     */
     get geometryChanged() {
         return this.docChanged || (this.flags & (8 /* Geometry */ | 2 /* Height */)) > 0;
@@ -2333,6 +2383,7 @@ class DocView extends ContentView {
         this.view = view;
         this.compositionDeco = Decoration.none;
         this.decorations = [];
+        this.pluginDecorationLength = 0;
         // Track a minimum width for the editor. When measuring sizes in
         // measureVisibleLineHeights, this is updated to point at the width
         // of a given element and its extent in the document. When a change
@@ -2354,7 +2405,8 @@ class DocView extends ContentView {
         this.setDOM(view.contentDOM);
         this.children = [new LineView];
         this.children[0].setParent(this);
-        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], this.updateDeco(), 0);
+        this.updateDeco();
+        this.updateInner([new ChangedRange(0, 0, 0, view.state.doc.length)], 0);
     }
     get root() { return this.view.root; }
     get editorView() { return this.view; }
@@ -2393,7 +2445,7 @@ class DocView extends ContentView {
             return false;
         }
         else {
-            this.updateInner(changedRanges, deco, update.startState.doc.length);
+            this.updateInner(changedRanges, update.startState.doc.length);
             if (update.transactions.length)
                 this.lastUpdate = Date.now();
             return true;
@@ -2401,9 +2453,9 @@ class DocView extends ContentView {
     }
     // Used by update and the constructor do perform the actual DOM
     // update
-    updateInner(changes, deco, oldLength) {
+    updateInner(changes, oldLength) {
         this.view.viewState.mustMeasureContent = true;
-        this.updateChildren(changes, deco, oldLength);
+        this.updateChildren(changes, oldLength);
         let { observer } = this.view;
         observer.ignore(() => {
             // Lock the height during redrawing, since Chrome sometimes
@@ -2430,14 +2482,14 @@ class DocView extends ContentView {
                     gaps.push(child.dom);
         observer.updateGaps(gaps);
     }
-    updateChildren(changes, deco, oldLength) {
+    updateChildren(changes, oldLength) {
         let cursor = this.childCursor(oldLength);
         for (let i = changes.length - 1;; i--) {
             let next = i >= 0 ? changes[i] : null;
             if (!next)
                 break;
             let { fromA, toA, fromB, toB } = next;
-            let { content, breakAtStart, openStart, openEnd } = ContentBuilder.build(this.view.state.doc, fromB, toB, deco);
+            let { content, breakAtStart, openStart, openEnd } = ContentBuilder.build(this.view.state.doc, fromB, toB, this.decorations, this.pluginDecorationLength);
             let { i: toI, off: toOff } = cursor.findPos(toA, 1);
             let { i: fromI, off: fromOff } = cursor.findPos(fromA, -1);
             replaceRange(this, fromI, fromOff, toI, toOff, content, breakAtStart, openStart, openEnd);
@@ -2656,15 +2708,18 @@ class DocView extends ContentView {
         return Decoration.set(deco);
     }
     updateDeco() {
+        let pluginDecorations = this.view.pluginField(PluginField.decorations);
+        this.pluginDecorationLength = pluginDecorations.length;
         return this.decorations = [
-            ...this.view.pluginField(PluginField.decorations),
+            ...pluginDecorations,
             ...this.view.state.facet(decorations),
             this.compositionDeco,
             this.computeBlockGapDeco(),
             this.view.viewState.lineGapDeco
         ];
     }
-    scrollIntoView({ range, center }) {
+    scrollIntoView(target) {
+        let { range } = target;
         let rect = this.coordsAt(range.head, range.empty ? range.assoc : range.head > range.anchor ? -1 : 1), other;
         if (!rect)
             return;
@@ -2684,10 +2739,11 @@ class DocView extends ContentView {
                 if (bottom != null)
                     mBottom = Math.max(mBottom, bottom);
             }
-        scrollRectIntoView(this.view.scrollDOM, {
+        let targetRect = {
             left: rect.left - mLeft, top: rect.top - mTop,
             right: rect.right + mRight, bottom: rect.bottom + mBottom
-        }, range.head < range.anchor ? -1 : 1, center);
+        };
+        scrollRectIntoView(this.view.scrollDOM, targetRect, range.head < range.anchor ? -1 : 1, target.x, target.y, target.xMargin, target.yMargin, this.view.textDirection == exports.Direction.LTR);
     }
 }
 function betweenUneditable(pos) {
@@ -2948,12 +3004,8 @@ function domPosInText(node, x, y) {
 function posAtCoords(view, { x, y }, precise, bias = -1) {
     var _a;
     let content = view.contentDOM.getBoundingClientRect(), docTop = content.top + view.viewState.paddingTop;
-    let block, yOffset = y - docTop, { docHeight } = view.viewState;
-    if (yOffset < 0 || yOffset > docHeight) {
-        if (precise)
-            return null;
-        yOffset = yOffset < 0 ? 0 : docHeight;
-    }
+    let block, { docHeight } = view.viewState;
+    let yOffset = Math.max(0, Math.min(y - docTop, docHeight));
     // Scan for a text block near the queried y position
     for (let halfLine = view.defaultLineHeight / 2, bounced = false;;) {
         block = view.elementAtHeight(yOffset);
@@ -2974,20 +3026,29 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
     }
     y = docTop + yOffset;
     let lineStart = block.from;
-    // Clip x to the viewport sides
-    x = Math.max(content.left + 1, Math.min(Math.max(content.right, content.left + view.docView.minWidth) - 1, x));
     // If this is outside of the rendered viewport, we can't determine a position
     if (lineStart < view.viewport.from)
-        return view.viewport.from == 0 ? 0 : posAtCoordsImprecise(view, content, block, x, y);
+        return view.viewport.from == 0 ? 0 : precise ? null : posAtCoordsImprecise(view, content, block, x, y);
     if (lineStart > view.viewport.to)
-        return view.viewport.to == view.state.doc.length ? view.state.doc.length : posAtCoordsImprecise(view, content, block, x, y);
+        return view.viewport.to == view.state.doc.length ? view.state.doc.length :
+            precise ? null : posAtCoordsImprecise(view, content, block, x, y);
     // Prefer ShadowRootOrDocument.elementFromPoint if present, fall back to document if not
     let doc = view.dom.ownerDocument;
-    let element = (view.root.elementFromPoint ? view.root : doc).elementFromPoint(x, y);
+    let root = view.root.elementFromPoint ? view.root : doc;
+    let element = root.elementFromPoint(x, y);
+    if (element && !view.contentDOM.contains(element))
+        element = null;
+    // If the element is unexpected, clip x at the sides of the content area and try again
+    if (!element) {
+        x = Math.max(content.left + 1, Math.min(content.right - 1, x));
+        element = root.elementFromPoint(x, y);
+        if (element && !view.contentDOM.contains(element))
+            element = null;
+    }
     // There's visible editor content under the point, so we can try
     // using caret(Position|Range)FromPoint as a shortcut
     let node, offset = -1;
-    if (element && view.contentDOM.contains(element) && ((_a = view.docView.nearest(element)) === null || _a === void 0 ? void 0 : _a.isEditable) != false) {
+    if (element && ((_a = view.docView.nearest(element)) === null || _a === void 0 ? void 0 : _a.isEditable) != false) {
         if (doc.caretPositionFromPoint) {
             let pos = doc.caretPositionFromPoint(x, y);
             if (pos)
@@ -3005,6 +3066,8 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
     // No luck, do our own (potentially expensive) search
     if (!node || !view.docView.dom.contains(node)) {
         let line = LineView.find(view.docView, lineStart);
+        if (!line)
+            return yOffset > block.top + block.height / 2 ? block.to : block.from;
         ({ node, offset } = domPosAtCoords(line.dom, x, y));
     }
     return view.docView.posFromDOM(node, offset);
@@ -3468,7 +3531,7 @@ handlers.touchmove = view => {
 };
 handlers.mousedown = (view, event) => {
     view.observer.flush();
-    if (lastTouch > Date.now() - 2000)
+    if (lastTouch > Date.now() - 2000 && getClickType(event) == 1)
         return; // Ignore touch interaction
     let style = null;
     for (let makeStyle of view.state.facet(mouseSelectionStyle)) {
@@ -3590,9 +3653,9 @@ handlers.dragstart = (view, event) => {
     }
 };
 function dropText(view, event, text, direct) {
-    let dropPos = view.posAtCoords({ x: event.clientX, y: event.clientY });
-    if (dropPos == null || !text)
+    if (!text)
         return;
+    let dropPos = view.posAtCoords({ x: event.clientX, y: event.clientY }, false);
     event.preventDefault();
     let { mouseSelection } = view.inputState;
     let del = direct && mouseSelection && mouseSelection.dragging && mouseSelection.dragMove ?
@@ -4521,15 +4584,6 @@ class LineGapWidget extends WidgetType {
     }
     get estimatedHeight() { return this.vertical ? this.size : -1; }
 }
-class ScrollTarget {
-    constructor(range, center = false) {
-        this.range = range;
-        this.center = center;
-    }
-    map(changes) {
-        return changes.empty ? this : new ScrollTarget(this.range.map(changes), this.center);
-    }
-}
 class ViewState {
     constructor(state) {
         this.state = state;
@@ -4710,9 +4764,9 @@ class ViewState {
             let { head } = scrollTarget.range, viewHeight = this.editorHeight;
             if (head < viewport.from || head > viewport.to) {
                 let block = map.lineAt(head, QueryType.ByPos, doc, 0, 0), topPos;
-                if (scrollTarget.center)
+                if (scrollTarget.y == "center")
                     topPos = (block.top + block.bottom) / 2 - viewHeight / 2;
-                else if (head < viewport.from)
+                else if (scrollTarget.y == "start" || scrollTarget.y == "nearest" && head < viewport.from)
                     topPos = block.top;
                 else
                     topPos = block.bottom - viewHeight;
@@ -5259,8 +5313,10 @@ class DOMObserver {
         // Deletions on IE11 fire their events in the wrong order, giving
         // us a selection change event before the DOM changes are
         // reported.
-        // (Selection.isCollapsed isn't reliable on IE)
-        if (browser.ie && browser.ie_version <= 11 && !view.state.selection.main.empty &&
+        // Chrome Android has a similar issue when backspacing out a
+        // selection (#645).
+        if ((browser.ie && browser.ie_version <= 11 || browser.android && browser.chrome) && !view.state.selection.main.empty &&
+            // (Selection.isCollapsed isn't reliable on IE)
             sel.focusNode && isEquivalentPosition(sel.focusNode, sel.focusOffset, sel.anchorNode, sel.anchorOffset))
             this.flushSoon();
         else
@@ -5818,7 +5874,9 @@ class EditorView {
                     if (e.is(scrollTo))
                         scrollTarget = new ScrollTarget(e.value);
                     else if (e.is(centerOn))
-                        scrollTarget = new ScrollTarget(e.value, true);
+                        scrollTarget = new ScrollTarget(e.value, "center");
+                    else if (e.is(scrollIntoView))
+                        scrollTarget = e.value;
                 }
             }
             this.viewState.update(update, scrollTarget);
@@ -6386,6 +6444,14 @@ class EditorView {
         this.destroyed = true;
     }
     /**
+    Returns an effect that can be
+    [added](https://codemirror.net/6/docs/ref/#state.TransactionSpec.effects) to a transaction to
+    cause it to scroll the given position or range into view.
+    */
+    static scrollIntoView(pos, options = {}) {
+        return scrollIntoView.of(new ScrollTarget(typeof pos == "number" ? state.EditorSelection.cursor(pos) : pos, options.y, options.x, options.yMargin, options.xMargin));
+    }
+    /**
     Facet that can be used to add DOM event handlers. The value
     should be an object mapping event names to handler functions. The
     first such function to return true will be assumed to have handled
@@ -6439,11 +6505,15 @@ class EditorView {
 /**
 Effect that can be [added](https://codemirror.net/6/docs/ref/#state.TransactionSpec.effects) to a
 transaction to make it scroll the given range into view.
+
+*Deprecated*. Use [`scrollIntoView`](https://codemirror.net/6/docs/ref/#view.EditorView^scrollIntoView) instead.
 */
 EditorView.scrollTo = scrollTo;
 /**
 Effect that makes the editor scroll the given range to the
 center of the visible view.
+
+*Deprecated*. Use [`scrollIntoView`](https://codemirror.net/6/docs/ref/#view.EditorView^scrollIntoView) instead.
 */
 EditorView.centerOn = centerOn;
 /**