@codemirror/view 0.19.31 → 0.19.35

package/CHANGELOG.md

@@ -1,3 +1,49 @@
+## 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
+
+Fix a bug where CodeMirror's own event handers would run even after a user-supplied handler called `preventDefault` on an event.
+
+Properly draw selections when negative text-indent is used for soft wrapping.
+
+Fix an issue where `viewportLineBlocks` could hold inaccurate height information when the vertical scaling changed.
+
+Fixes drop cursor positioning when the document is scrolled. Force a content measure when the editor comes into view
+
+Fix a bug that could cause the editor to not measure its layout the first time it came into view.
+
 ## 0.19.31 (2021-12-13)
 
 ### New features

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");
@@ -1580,12 +1605,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
@@ -2664,7 +2704,8 @@ class DocView extends ContentView {
             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 +2725,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 +2990,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 +3012,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 ? posAtCoordsImprecise(view, content, block, x, y) : null;
     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 ? posAtCoordsImprecise(view, content, block, x, y) : null;
     // 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)
@@ -3199,7 +3246,7 @@ class InputState {
             let handler = set.handlers[type];
             if (handler) {
                 try {
-                    if (handler.call(set.plugin, event, view))
+                    if (handler.call(set.plugin, event, view) || event.defaultPrevented)
                         return true;
                 }
                 catch (e) {
@@ -3468,7 +3515,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 +3637,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 +4568,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;
@@ -4604,9 +4642,9 @@ class ViewState {
         let updateLines = !update.changes.empty || (update.flags & 2 /* Height */) ||
             viewport.from != this.viewport.from || viewport.to != this.viewport.to;
         this.viewport = viewport;
+        this.updateForViewport();
         if (updateLines)
             this.updateViewportLines();
-        this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(this.mapLineGaps(this.lineGaps, update.changes)));
         update.flags |= this.computeVisibleRanges();
@@ -4638,7 +4676,12 @@ class ViewState {
         let pixelViewport = this.printing ? { top: -1e8, bottom: 1e8, left: -1e8, right: 1e8 } : visiblePixelRange(dom, this.paddingTop);
         let dTop = pixelViewport.top - this.pixelViewport.top, dBottom = pixelViewport.bottom - this.pixelViewport.bottom;
         this.pixelViewport = pixelViewport;
-        this.inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
+        let inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
+        if (inView != this.inView) {
+            this.inView = inView;
+            if (inView)
+                measureContent = true;
+        }
         if (!this.inView)
             return 0;
         if (measureContent) {
@@ -4675,9 +4718,9 @@ class ViewState {
             this.scrollTarget && (this.scrollTarget.range.head < this.viewport.from || this.scrollTarget.range.head > this.viewport.to);
         if (viewportChange)
             this.viewport = this.getViewport(bias, this.scrollTarget);
+        this.updateForViewport();
         if ((result & 2 /* Height */) || viewportChange)
             this.updateViewportLines();
-        this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(refresh ? [] : this.lineGaps));
         result |= this.computeVisibleRanges();
@@ -4705,9 +4748,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;
@@ -5213,7 +5256,7 @@ class DOMObserver {
             this.intersection = new IntersectionObserver(entries => {
                 if (this.parentCheck < 0)
                     this.parentCheck = setTimeout(this.listenForScroll.bind(this), 1000);
-                if (entries.length > 0 && entries[entries.length - 1].intersectionRatio > 0 != this.intersecting) {
+                if (entries.length > 0 && (entries[entries.length - 1].intersectionRatio > 0) != this.intersecting) {
                     this.intersecting = !this.intersecting;
                     if (this.intersecting != this.view.inView)
                         this.onScrollChanged(document.createEvent("Event"));
@@ -5254,8 +5297,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
@@ -5813,7 +5858,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);
@@ -6381,6 +6428,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
@@ -6434,11 +6489,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;
 /**
@@ -6907,7 +6966,7 @@ function measureRange(view, range) {
     let ltr = view.textDirection == exports.Direction.LTR;
     let content = view.contentDOM, contentRect = content.getBoundingClientRect(), base = getBase(view);
     let lineStyle = window.getComputedStyle(content.firstChild);
-    let leftSide = contentRect.left + parseInt(lineStyle.paddingLeft);
+    let leftSide = contentRect.left + parseInt(lineStyle.paddingLeft) + Math.min(0, parseInt(lineStyle.textIndent));
     let rightSide = contentRect.right - parseInt(lineStyle.paddingRight);
     let startBlock = blockAt(view, from), endBlock = blockAt(view, to);
     let visualStart = startBlock.type == exports.BlockType.Text ? startBlock : null;
@@ -7033,7 +7092,11 @@ const drawDropCursor = ViewPlugin.fromClass(class {
         if (!rect)
             return null;
         let outer = this.view.scrollDOM.getBoundingClientRect();
-        return { left: rect.left - outer.left, top: rect.top - outer.top, height: rect.bottom - rect.top };
+        return {
+            left: rect.left - outer.left + this.view.scrollDOM.scrollLeft,
+            top: rect.top - outer.top + this.view.scrollDOM.scrollTop,
+            height: rect.bottom - rect.top
+        };
     }
     drawCursor(pos) {
         if (this.cursor) {

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as _codemirror_rangeset from '@codemirror/rangeset';
 import { RangeSet, RangeValue, Range } from '@codemirror/rangeset';
 export { Range } from '@codemirror/rangeset';
 import * as _codemirror_state from '@codemirror/state';
-import { EditorState, Extension, Transaction, ChangeSet, EditorSelection, TransactionSpec, SelectionRange, Facet } from '@codemirror/state';
+import { EditorState, Extension, Transaction, ChangeSet, EditorSelection, TransactionSpec, SelectionRange, StateEffect, Facet } from '@codemirror/state';
 import { Line } from '@codemirror/text';
 import { StyleModule, StyleSpec } from 'style-mod';
 
@@ -264,6 +264,7 @@ interface Rect {
     readonly top: number;
     readonly bottom: number;
 }
+declare type ScrollStrategy = "nearest" | "start" | "end" | "center";
 
 /**
 Command functions are used in key bindings and other types of user
@@ -936,8 +937,11 @@ declare class EditorView {
     */
     posAtDOM(node: Node, offset?: number): number;
     /**
-    Get the document position at the given screen coordinates.
-    Returns null if no valid position could be found.
+    Get the document position at the given screen coordinates. For
+    positions not covered by the visible viewport's DOM structure,
+    this will return null, unless `false` is passed as second
+    argument, in which case it'll return an estimated position that
+    would be near the coordinates if it were rendered.
     */
     posAtCoords(coords: {
         x: number;
@@ -1006,14 +1010,49 @@ declare 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.
     */
     static scrollTo: _codemirror_state.StateEffectType<SelectionRange>;
     /**
     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.
     */
     static centerOn: _codemirror_state.StateEffectType<SelectionRange>;
     /**
+    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: number | SelectionRange, options?: {
+        /**
+        By default (`"nearest"`) the position will be vertically
+        scrolled only the minimal amount required to move the given
+        position into view. You can set this to `"start"` to move it
+        to the top of the view, `"end"` to move it to the bottom, or
+        `"center"` to move it to the center.
+        */
+        y?: ScrollStrategy;
+        /**
+        Effect similar to
+        [`y`](https://codemirror.net/6/docs/ref/#view.EditorView^scrollIntoView^options.y), but for the
+        horizontal scroll position.
+        */
+        x?: ScrollStrategy;
+        /**
+        Extra vertical distance to add when moving something into
+        view. Not used with the `"center"` strategy. Defaults to 5.
+        */
+        yMargin?: number;
+        /**
+        Extra horizontal distance to add. Not used with the `"center"`
+        strategy. Defaults to 5.
+        */
+        xMargin?: number;
+    }): StateEffect<unknown>;
+    /**
     Facet to add a [style
     module](https://github.com/marijnh/style-mod#documentation) to
     an editor view. The view will ensure that the module is

package/dist/index.js

@@ -98,8 +98,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
@@ -118,38 +117,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) {
@@ -173,7 +176,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;
@@ -260,6 +263,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) {
@@ -306,14 +313,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 */;
                 }
@@ -341,7 +350,7 @@ class ContentView {
                 }
         }
     }
-    reuseDOM(_dom) { return false; }
+    reuseDOM(_dom) { }
     localPosFromDOM(node, offset) {
         let after;
         if (node == this.dom) {
@@ -640,10 +649,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))
@@ -678,18 +685,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) {
@@ -833,8 +848,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;
     }
@@ -1298,13 +1312,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");
@@ -1576,12 +1601,27 @@ const mouseSelectionStyle = /*@__PURE__*/Facet.define();
 const exceptionSink = /*@__PURE__*/Facet.define();
 const updateListener = /*@__PURE__*/Facet.define();
 const inputHandler = /*@__PURE__*/Facet.define();
+// FIXME remove
 const scrollTo = /*@__PURE__*/StateEffect.define({
     map: (range, changes) => range.map(changes)
 });
+// FIXME remove
 const centerOn = /*@__PURE__*/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 = /*@__PURE__*/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
@@ -2659,7 +2699,8 @@ class DocView extends ContentView {
             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;
@@ -2679,10 +2720,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 == Direction.LTR);
     }
 }
 function betweenUneditable(pos) {
@@ -2943,12 +2985,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);
@@ -2969,20 +3007,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 ? posAtCoordsImprecise(view, content, block, x, y) : null;
     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 ? posAtCoordsImprecise(view, content, block, x, y) : null;
     // 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)
@@ -3194,7 +3241,7 @@ class InputState {
             let handler = set.handlers[type];
             if (handler) {
                 try {
-                    if (handler.call(set.plugin, event, view))
+                    if (handler.call(set.plugin, event, view) || event.defaultPrevented)
                         return true;
                 }
                 catch (e) {
@@ -3463,7 +3510,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)) {
@@ -3585,9 +3632,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 ?
@@ -4515,15 +4562,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;
@@ -4598,9 +4636,9 @@ class ViewState {
         let updateLines = !update.changes.empty || (update.flags & 2 /* Height */) ||
             viewport.from != this.viewport.from || viewport.to != this.viewport.to;
         this.viewport = viewport;
+        this.updateForViewport();
         if (updateLines)
             this.updateViewportLines();
-        this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(this.mapLineGaps(this.lineGaps, update.changes)));
         update.flags |= this.computeVisibleRanges();
@@ -4632,7 +4670,12 @@ class ViewState {
         let pixelViewport = this.printing ? { top: -1e8, bottom: 1e8, left: -1e8, right: 1e8 } : visiblePixelRange(dom, this.paddingTop);
         let dTop = pixelViewport.top - this.pixelViewport.top, dBottom = pixelViewport.bottom - this.pixelViewport.bottom;
         this.pixelViewport = pixelViewport;
-        this.inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
+        let inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
+        if (inView != this.inView) {
+            this.inView = inView;
+            if (inView)
+                measureContent = true;
+        }
         if (!this.inView)
             return 0;
         if (measureContent) {
@@ -4669,9 +4712,9 @@ class ViewState {
             this.scrollTarget && (this.scrollTarget.range.head < this.viewport.from || this.scrollTarget.range.head > this.viewport.to);
         if (viewportChange)
             this.viewport = this.getViewport(bias, this.scrollTarget);
+        this.updateForViewport();
         if ((result & 2 /* Height */) || viewportChange)
             this.updateViewportLines();
-        this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
             this.updateLineGaps(this.ensureLineGaps(refresh ? [] : this.lineGaps));
         result |= this.computeVisibleRanges();
@@ -4699,9 +4742,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;
@@ -5207,7 +5250,7 @@ class DOMObserver {
             this.intersection = new IntersectionObserver(entries => {
                 if (this.parentCheck < 0)
                     this.parentCheck = setTimeout(this.listenForScroll.bind(this), 1000);
-                if (entries.length > 0 && entries[entries.length - 1].intersectionRatio > 0 != this.intersecting) {
+                if (entries.length > 0 && (entries[entries.length - 1].intersectionRatio > 0) != this.intersecting) {
                     this.intersecting = !this.intersecting;
                     if (this.intersecting != this.view.inView)
                         this.onScrollChanged(document.createEvent("Event"));
@@ -5248,8 +5291,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
@@ -5807,7 +5852,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);
@@ -6375,6 +6422,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" ? 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
@@ -6428,11 +6483,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;
 /**
@@ -6901,7 +6960,7 @@ function measureRange(view, range) {
     let ltr = view.textDirection == Direction.LTR;
     let content = view.contentDOM, contentRect = content.getBoundingClientRect(), base = getBase(view);
     let lineStyle = window.getComputedStyle(content.firstChild);
-    let leftSide = contentRect.left + parseInt(lineStyle.paddingLeft);
+    let leftSide = contentRect.left + parseInt(lineStyle.paddingLeft) + Math.min(0, parseInt(lineStyle.textIndent));
     let rightSide = contentRect.right - parseInt(lineStyle.paddingRight);
     let startBlock = blockAt(view, from), endBlock = blockAt(view, to);
     let visualStart = startBlock.type == BlockType.Text ? startBlock : null;
@@ -7027,7 +7086,11 @@ const drawDropCursor = /*@__PURE__*/ViewPlugin.fromClass(class {
         if (!rect)
             return null;
         let outer = this.view.scrollDOM.getBoundingClientRect();
-        return { left: rect.left - outer.left, top: rect.top - outer.top, height: rect.bottom - rect.top };
+        return {
+            left: rect.left - outer.left + this.view.scrollDOM.scrollLeft,
+            top: rect.top - outer.top + this.view.scrollDOM.scrollTop,
+            height: rect.bottom - rect.top
+        };
     }
     drawCursor(pos) {
         if (this.cursor) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/view",
-  "version": "0.19.31",
+  "version": "0.19.35",
   "description": "DOM view component for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",
@@ -26,7 +26,7 @@
   "sideEffects": false,
   "license": "MIT",
   "dependencies": {
-    "@codemirror/rangeset": "^0.19.0",
+    "@codemirror/rangeset": "^0.19.4",
     "@codemirror/state": "^0.19.3",
     "@codemirror/text": "^0.19.0",
     "style-mod": "^4.0.0",