@codemirror/view 0.19.21 → 0.19.22

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 0.19.22 (2021-11-30)
+
+### Bug fixes
+
+Fix an issue where editors with large vertical padding (for example via `scrollPastEnd`) could sometimes lose their scroll position on Chrome.
+
+Avoid some unnecessary DOM measuring work by more carefully checking whether it is needed.
+
+### New features
+
+The new `elementAtHeight`, `lineBlockAtHeight`, and `lineBlockAt` methods provide a simpler and more efficient replacement for the (now deprecated) `blockAtHeight`, `visualLineAtHeight`, and `visualLineAt` methods.
+
+The editor view now exports a `documentTop` getter that gives you the vertical position of the top of the document. All height info is queried and reported relative to this top.
+
+The editor view's new `viewportLineBlocks` property provides an array of in-viewport line blocks, and replaces the (now deprecated) `viewportLines` method.
+
 ## 0.19.21 (2021-11-26)
 
 ### Bug fixes

package/dist/index.cjs

@@ -1988,10 +1988,7 @@ class DocView extends ContentView {
         let prevDeco = this.decorations, deco = this.updateDeco();
         let decoDiff = findChangedDeco(prevDeco, deco, update.changes);
         changedRanges = ChangedRange.extendWithRanges(changedRanges, decoDiff);
-        if (this.dirty == 0 /* Not */ && changedRanges.length == 0 &&
-            !(update.flags & 4 /* Viewport */) &&
-            update.state.selection.main.from >= this.view.viewport.from &&
-            update.state.selection.main.to <= this.view.viewport.to) {
+        if (this.dirty == 0 /* Not */ && changedRanges.length == 0) {
             return false;
         }
         else {
@@ -2014,6 +2011,7 @@ class DocView extends ContentView {
     // Used both by update and checkLayout do perform the actual DOM
     // update
     updateInner(changes, deco, oldLength) {
+        this.view.viewState.mustMeasureContent = true;
         this.updateChildren(changes, deco, oldLength);
         let { observer } = this.view;
         observer.ignore(() => {
@@ -2021,7 +2019,7 @@ class DocView extends ContentView {
             // messes with the scroll position during DOM mutation (though
             // no relayout is triggered and I cannot imagine how it can
             // recompute the scroll position without a layout)
-            this.dom.style.height = this.view.viewState.domHeight + "px";
+            this.dom.style.height = this.view.viewState.contentHeight + "px";
             this.dom.style.minWidth = this.minWidth ? this.minWidth + "px" : "";
             // Chrome will sometimes, when DOM mutations occur directly
             // around the selection, get confused and report a different
@@ -2306,7 +2304,7 @@ class DocView extends ContentView {
             let next = i == vs.viewports.length ? null : vs.viewports[i];
             let end = next ? next.from - 1 : this.length;
             if (end > pos) {
-                let height = vs.lineAt(end, 0).bottom - vs.lineAt(pos, 0).top;
+                let height = vs.lineBlockAt(end).bottom - vs.lineBlockAt(pos).top;
                 deco.push(Decoration.replace({ widget: new BlockGapWidget(height), block: true, inclusive: true }).range(pos, end));
             }
             if (!next)
@@ -2913,13 +2911,14 @@ function domPosInText(node, x, y) {
 }
 function posAtCoords(view, { x, y }, precise, bias = -1) {
     var _a;
-    let content = view.contentDOM.getBoundingClientRect(), block;
+    let content = view.contentDOM.getBoundingClientRect(), docTop = content.top + view.viewState.paddingTop;
     let halfLine = view.defaultLineHeight / 2;
+    let block, yOffset = y - docTop;
     for (let bounced = false;;) {
-        block = view.blockAtHeight(y, content.top);
-        if (block.top > y || block.bottom < y) {
-            bias = block.top > y ? -1 : 1;
-            y = Math.min(block.bottom - halfLine, Math.max(block.top + halfLine, y));
+        block = view.elementAtHeight(yOffset);
+        if (block.top > yOffset || block.bottom < yOffset) {
+            bias = block.top > yOffset ? -1 : 1;
+            yOffset = Math.min(block.bottom - halfLine, Math.max(block.top + halfLine, yOffset));
             if (bounced)
                 return precise ? null : 0;
             else
@@ -2927,8 +2926,9 @@ function posAtCoords(view, { x, y }, precise, bias = -1) {
         }
         if (block.type == exports.BlockType.Text)
             break;
-        y = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
+        yOffset = bias > 0 ? block.bottom + halfLine : block.top - halfLine;
     }
+    y = docTop + yOffset;
     let lineStart = block.from;
     // Clip x to the viewport sides
     x = Math.max(content.left + 1, Math.min(content.right - 1, x));
@@ -3041,17 +3041,17 @@ function moveVertically(view, start, forward, distance) {
         return state.EditorSelection.cursor(startPos);
     let goal = start.goalColumn, startY;
     let rect = view.contentDOM.getBoundingClientRect();
-    let startCoords = view.coordsAtPos(startPos);
+    let startCoords = view.coordsAtPos(startPos), docTop = view.documentTop;
     if (startCoords) {
         if (goal == null)
             goal = startCoords.left - rect.left;
         startY = dir < 0 ? startCoords.top : startCoords.bottom;
     }
     else {
-        let line = view.viewState.lineAt(startPos, view.dom.getBoundingClientRect().top);
+        let line = view.viewState.lineBlockAt(startPos - docTop);
         if (goal == null)
             goal = Math.min(rect.right - rect.left, view.defaultCharacterWidth * (startPos - line.from));
-        startY = dir < 0 ? line.top : line.bottom;
+        startY = (dir < 0 ? line.top : line.bottom) + docTop;
     }
     let resolvedGoal = rect.left + goal;
     let dist = distance !== null && distance !== void 0 ? distance : (view.defaultLineHeight >> 1);
@@ -3302,7 +3302,7 @@ class MouseSelection {
         this.extend = startEvent.shiftKey;
         this.multiple = view.state.facet(state.EditorState.allowMultipleSelections) && addsSelectionRange(view, startEvent);
         this.dragMove = dragMovesSelection(view, startEvent);
-        this.dragging = isInPrimarySelection(view, startEvent) ? null : false;
+        this.dragging = isInPrimarySelection(view, startEvent) && getClickType(startEvent) == 1 ? null : false;
         // When clicking outside of the selection, immediately apply the
         // effect of starting the selection
         if (this.dragging === false) {
@@ -3523,7 +3523,7 @@ function basicMouseSelection(view, event) {
     let last = start, lastEvent = event;
     return {
         update(update) {
-            if (update.changes) {
+            if (update.docChanged) {
                 if (start)
                     start.pos = update.changes.mapPos(start.pos);
                 startSel = startSel.map(update.changes);
@@ -3787,7 +3787,10 @@ class HeightOracle {
         return lines * this.lineHeight;
     }
     setDoc(doc) { this.doc = doc; return this; }
-    mustRefresh(lineHeights, whiteSpace, direction) {
+    mustRefreshForStyle(whiteSpace, direction) {
+        return (wrappingWhiteSpace.indexOf(whiteSpace) > -1) != this.lineWrapping || this.direction != direction;
+    }
+    mustRefreshForHeights(lineHeights) {
         let newHeight = false;
         for (let i = 0; i < lineHeights.length; i++) {
             let h = lineHeights[i];
@@ -3799,7 +3802,7 @@ class HeightOracle {
                 this.heightSamples[Math.floor(h * 10)] = true;
             }
         }
-        return newHeight || (wrappingWhiteSpace.indexOf(whiteSpace) > -1) != this.lineWrapping || this.direction != direction;
+        return newHeight;
     }
     refresh(whiteSpace, direction, lineHeight, charWidth, lineLength, knownHeights) {
         let lineWrapping = wrappingWhiteSpace.indexOf(whiteSpace) > -1;
@@ -3853,7 +3856,8 @@ class BlockInfo {
     */
     length, 
     /**
-    The top position of the element.
+    The top position of the element (relative to the top of the
+    document).
     */
     top, 
     /**
@@ -3887,6 +3891,12 @@ class BlockInfo {
             .concat(Array.isArray(other.type) ? other.type : [other]);
         return new BlockInfo(this.from, this.length + other.length, this.top, this.height + other.height, detail);
     }
+    /**
+    FIXME remove on next breaking release @internal
+    */
+    moveY(offset) {
+        return !offset ? this : new BlockInfo(this.from, this.length, this.top + offset, this.height, Array.isArray(this.type) ? this.type.map(b => b.moveY(offset)) : this.type);
+    }
 }
 var QueryType;
 (function (QueryType) {
@@ -3894,7 +3904,7 @@ var QueryType;
     QueryType[QueryType["ByHeight"] = 1] = "ByHeight";
     QueryType[QueryType["ByPosNoHeight"] = 2] = "ByPosNoHeight";
 })(QueryType || (QueryType = {}));
-const Epsilon = 1e-4;
+const Epsilon = 1e-3;
 class HeightMap {
     constructor(length, // The number of characters covered
     height, // Height of this part of the document
@@ -4121,22 +4131,30 @@ class HeightMapGap extends HeightMap {
             // can't be widgets or collapsed ranges in those lines, because
             // they would already have been added to the heightmap (gaps
             // only contain plain text).
-            let nodes = [], pos = Math.max(offset, measured.from);
+            let nodes = [], pos = Math.max(offset, measured.from), singleHeight = -1;
+            let wasChanged = oracle.heightChanged;
             if (measured.from > offset)
                 nodes.push(new HeightMapGap(measured.from - offset - 1).updateHeight(oracle, offset));
             while (pos <= end && measured.more) {
                 let len = oracle.doc.lineAt(pos).length;
                 if (nodes.length)
                     nodes.push(null);
-                let line = new HeightMapText(len, measured.heights[measured.index++]);
+                let height = measured.heights[measured.index++];
+                if (singleHeight == -1)
+                    singleHeight = height;
+                else if (Math.abs(height - singleHeight) >= Epsilon)
+                    singleHeight = -2;
+                let line = new HeightMapText(len, height);
                 line.outdated = false;
                 nodes.push(line);
                 pos += len + 1;
             }
             if (pos <= end)
                 nodes.push(null, new HeightMapGap(end - pos).updateHeight(oracle, pos));
-            oracle.heightChanged = true;
-            return HeightMap.of(nodes);
+            let result = HeightMap.of(nodes);
+            oracle.heightChanged = wasChanged || singleHeight < 0 || Math.abs(result.height - this.height) >= Epsilon ||
+                Math.abs(singleHeight - this.lines(oracle.doc, offset).lineHeight) >= Epsilon;
+            return result;
         }
         else if (force || this.outdated) {
             this.setHeight(oracle, oracle.heightForGap(offset, offset + this.length));
@@ -4494,7 +4512,8 @@ class ViewState {
         this.inView = true;
         this.paddingTop = 0;
         this.paddingBottom = 0;
-        this.contentWidth = 0;
+        this.contentDOMWidth = 0;
+        this.contentDOMHeight = 0;
         this.editorHeight = 0;
         this.heightOracle = new HeightOracle;
         // See VP.MaxDOMHeight
@@ -4502,6 +4521,9 @@ class ViewState {
         this.scrollTarget = null;
         // Briefly set to true when printing, to disable viewport limiting
         this.printing = false;
+        // Flag set when editor content was redrawn, so that the next
+        // measure stage knows it must read DOM layout
+        this.mustMeasureContent = true;
         this.visibleRanges = [];
         // Cursor 'assoc' is only significant when the cursor is on a line
         // wrap point, where it must stick to the character that it is
@@ -4514,6 +4536,7 @@ class ViewState {
         this.mustEnforceCursorAssoc = false;
         this.heightMap = HeightMap.empty().applyChanges(state.facet(decorations), text.Text.empty, this.heightOracle.setDoc(state.doc), [new ChangedRange(0, 0, 0, state.doc.length)]);
         this.viewport = this.getViewport(0, null);
+        this.updateViewportLines();
         this.updateForViewport();
         this.lineGaps = this.ensureLineGaps([]);
         this.lineGapDeco = Decoration.set(this.lineGaps.map(gap => gap.draw(false)));
@@ -4524,7 +4547,7 @@ class ViewState {
         for (let i = 0; i <= 1; i++) {
             let pos = i ? main.head : main.anchor;
             if (!viewports.some(({ from, to }) => pos >= from && pos <= to)) {
-                let { from, to } = this.lineAt(pos, 0);
+                let { from, to } = this.lineBlockAt(pos);
                 viewports.push(new Viewport(from, to));
             }
         }
@@ -4532,6 +4555,12 @@ class ViewState {
         this.scaler = this.heightMap.height <= 7000000 /* MaxDOMHeight */ ? IdScaler :
             new BigScaler(this.heightOracle.doc, this.heightMap, this.viewports);
     }
+    updateViewportLines() {
+        this.viewportLines = [];
+        this.heightMap.forEachLine(this.viewport.from, this.viewport.to, this.state.doc, 0, 0, block => {
+            this.viewportLines.push(this.scaler.scale == 1 ? block : scaleBlock(block, this.scaler));
+        });
+    }
     update(update, scrollTarget = null) {
         let prev = this.state;
         this.state = update.state;
@@ -4546,6 +4575,9 @@ class ViewState {
         if (scrollTarget && (scrollTarget.range.head < viewport.from || scrollTarget.range.head > viewport.to) ||
             !this.viewportIsAppropriate(viewport))
             viewport = this.getViewport(0, scrollTarget);
+        if (!update.changes.empty || (update.flags & 2 /* Height */) ||
+            viewport.from != this.viewport.from || viewport.to != this.viewport.to)
+            this.updateViewportLines();
         this.viewport = viewport;
         this.updateForViewport();
         if (this.lineGaps.length || this.viewport.to - this.viewport.from > 4000 /* DoubleMargin */)
@@ -4557,13 +4589,17 @@ class ViewState {
             update.state.selection.main.empty && update.state.selection.main.assoc)
             this.mustEnforceCursorAssoc = true;
     }
-    measure(docView, repeated) {
-        let dom = docView.dom, whiteSpace = "", direction = exports.Direction.LTR;
-        let result = 0;
-        if (!repeated) {
+    measure(view) {
+        let dom = view.contentDOM, style = window.getComputedStyle(dom);
+        let oracle = this.heightOracle;
+        let whiteSpace = style.whiteSpace, direction = style.direction == "rtl" ? exports.Direction.RTL : exports.Direction.LTR;
+        let refresh = this.heightOracle.mustRefreshForStyle(whiteSpace, direction);
+        let measureContent = refresh || this.mustMeasureContent || this.contentDOMHeight != dom.clientHeight;
+        let result = 0, bias = 0;
+        if (measureContent) {
+            this.mustMeasureContent = false;
+            this.contentDOMHeight = dom.clientHeight;
             // Vertical padding
-            let style = window.getComputedStyle(dom);
-            whiteSpace = style.whiteSpace, direction = (style.direction == "rtl" ? exports.Direction.RTL : exports.Direction.LTR);
             let paddingTop = parseInt(style.paddingTop) || 0, paddingBottom = parseInt(style.paddingBottom) || 0;
             if (this.paddingTop != paddingTop || this.paddingBottom != paddingBottom) {
                 result |= 8 /* Geometry */;
@@ -4578,39 +4614,42 @@ class ViewState {
         this.inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
         if (!this.inView)
             return 0;
-        let lineHeights = docView.measureVisibleLineHeights();
-        let refresh = false, bias = 0, oracle = this.heightOracle;
-        if (!repeated) {
-            let contentWidth = docView.dom.clientWidth;
-            if (oracle.mustRefresh(lineHeights, whiteSpace, direction) ||
-                oracle.lineWrapping && Math.abs(contentWidth - this.contentWidth) > oracle.charWidth) {
-                let { lineHeight, charWidth } = docView.measureTextSize();
+        if (measureContent) {
+            let lineHeights = view.docView.measureVisibleLineHeights();
+            if (oracle.mustRefreshForHeights(lineHeights))
+                refresh = true;
+            let contentWidth = dom.clientWidth;
+            if (refresh || oracle.lineWrapping && Math.abs(contentWidth - this.contentDOMWidth) > oracle.charWidth) {
+                let { lineHeight, charWidth } = view.docView.measureTextSize();
                 refresh = oracle.refresh(whiteSpace, direction, lineHeight, charWidth, contentWidth / charWidth, lineHeights);
                 if (refresh) {
-                    docView.minWidth = 0;
+                    view.docView.minWidth = 0;
                     result |= 8 /* Geometry */;
                 }
             }
-            if (this.contentWidth != contentWidth) {
-                this.contentWidth = contentWidth;
+            if (this.contentDOMWidth != contentWidth) {
+                this.contentDOMWidth = contentWidth;
                 result |= 8 /* Geometry */;
             }
-            if (this.editorHeight != docView.view.scrollDOM.clientHeight) {
-                this.editorHeight = docView.view.scrollDOM.clientHeight;
+            if (this.editorHeight != view.scrollDOM.clientHeight) {
+                this.editorHeight = view.scrollDOM.clientHeight;
                 result |= 8 /* Geometry */;
             }
             if (dTop > 0 && dBottom > 0)
                 bias = Math.max(dTop, dBottom);
             else if (dTop < 0 && dBottom < 0)
                 bias = Math.min(dTop, dBottom);
-        }
-        oracle.heightChanged = false;
-        this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(this.viewport.from, lineHeights));
-        if (oracle.heightChanged)
-            result |= 2 /* Height */;
-        if (!this.viewportIsAppropriate(this.viewport, bias) ||
-            this.scrollTarget && (this.scrollTarget.range.head < this.viewport.from || this.scrollTarget.range.head > this.viewport.to))
+            oracle.heightChanged = false;
+            this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(this.viewport.from, lineHeights));
+            if (oracle.heightChanged)
+                result |= 2 /* Height */;
+        }
+        let viewportChange = !this.viewportIsAppropriate(this.viewport, bias) ||
+            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);
+        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));
@@ -4621,12 +4660,12 @@ class ViewState {
             // to a line end is going to trigger a layout anyway, so it
             // can't be a pure write. It should be rare that it does any
             // writing.
-            docView.enforceCursorAssoc();
+            view.docView.enforceCursorAssoc();
         }
         return result;
     }
-    get visibleTop() { return this.scaler.fromDOM(this.pixelViewport.top, 0); }
-    get visibleBottom() { return this.scaler.fromDOM(this.pixelViewport.bottom, 0); }
+    get visibleTop() { return this.scaler.fromDOM(this.pixelViewport.top); }
+    get visibleBottom() { return this.scaler.fromDOM(this.pixelViewport.bottom); }
     getViewport(bias, scrollTarget) {
         // This will divide VP.Margin between the top and the
         // bottom, depending on the bias (the change in viewport position
@@ -4686,12 +4725,12 @@ class ViewState {
         // This won't work at all in predominantly right-to-left text.
         if (this.heightOracle.direction != exports.Direction.LTR)
             return gaps;
-        this.heightMap.forEachLine(this.viewport.from, this.viewport.to, this.state.doc, 0, 0, line => {
+        for (let line of this.viewportLines) {
             if (line.length < 4000 /* DoubleMargin */)
-                return;
+                continue;
             let structure = lineStructure(line.from, line.to, this.state);
             if (structure.total < 4000 /* DoubleMargin */)
-                return;
+                continue;
             let viewFrom, viewTo;
             if (this.heightOracle.lineWrapping) {
                 let marginHeight = (2000 /* Margin */ / this.heightOracle.lineLength) * this.heightOracle.lineHeight;
@@ -4721,7 +4760,7 @@ class ViewState {
                         Math.abs(gap.from - from) < 1000 /* HalfMargin */ && Math.abs(gap.to - to) < 1000 /* HalfMargin */) ||
                         new LineGap(from, to, this.gapSize(line, from, to, structure)));
                 }
-        });
+        }
         return gaps;
     }
     gapSize(line, from, to, structure) {
@@ -4753,27 +4792,18 @@ class ViewState {
         this.visibleRanges = ranges;
         return changed ? 4 /* Viewport */ : 0;
     }
-    lineAt(pos, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.lineAt(pos, QueryType.ByPos, this.state.doc, editorTop, 0), this.scaler, editorTop);
+    lineBlockAt(pos) {
+        return (pos >= this.viewport.from && pos <= this.viewport.to && this.viewportLines.find(b => b.from <= pos && b.to <= pos)) ||
+            scaleBlock(this.heightMap.lineAt(pos, QueryType.ByPos, this.state.doc, 0, 0), this.scaler);
     }
-    lineAtHeight(height, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height, editorTop), QueryType.ByHeight, this.state.doc, editorTop, 0), this.scaler, editorTop);
+    lineBlockAtHeight(height) {
+        return scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height), QueryType.ByHeight, this.state.doc, 0, 0), this.scaler);
     }
-    blockAtHeight(height, editorTop) {
-        editorTop += this.paddingTop;
-        return scaleBlock(this.heightMap.blockAt(this.scaler.fromDOM(height, editorTop), this.state.doc, editorTop, 0), this.scaler, editorTop);
-    }
-    forEachLine(from, to, f, editorTop) {
-        editorTop += this.paddingTop;
-        return this.heightMap.forEachLine(from, to, this.state.doc, editorTop, 0, this.scaler.scale == 1 ? f : b => f(scaleBlock(b, this.scaler, editorTop)));
+    elementAtHeight(height) {
+        return scaleBlock(this.heightMap.blockAt(this.scaler.fromDOM(height), this.state.doc, 0, 0), this.scaler);
     }
     get contentHeight() {
-        return this.domHeight + this.paddingTop + this.paddingBottom;
-    }
-    get domHeight() {
-        return this.scaler.toDOM(this.heightMap.height, this.paddingTop);
+        return this.scaler.toDOM(this.heightMap.height) + this.paddingTop + this.paddingBottom;
     }
 }
 class Viewport {
@@ -4870,36 +4900,34 @@ class BigScaler {
             base = obj.bottom;
         }
     }
-    toDOM(n, top) {
-        n -= top;
+    toDOM(n) {
         for (let i = 0, base = 0, domBase = 0;; i++) {
             let vp = i < this.viewports.length ? this.viewports[i] : null;
             if (!vp || n < vp.top)
-                return domBase + (n - base) * this.scale + top;
+                return domBase + (n - base) * this.scale;
             if (n <= vp.bottom)
-                return vp.domTop + (n - vp.top) + top;
+                return vp.domTop + (n - vp.top);
             base = vp.bottom;
             domBase = vp.domBottom;
         }
     }
-    fromDOM(n, top) {
-        n -= top;
+    fromDOM(n) {
         for (let i = 0, base = 0, domBase = 0;; i++) {
             let vp = i < this.viewports.length ? this.viewports[i] : null;
             if (!vp || n < vp.domTop)
-                return base + (n - domBase) / this.scale + top;
+                return base + (n - domBase) / this.scale;
             if (n <= vp.domBottom)
-                return vp.top + (n - vp.domTop) + top;
+                return vp.top + (n - vp.domTop);
             base = vp.bottom;
             domBase = vp.domBottom;
         }
     }
 }
-function scaleBlock(block, scaler, top) {
+function scaleBlock(block, scaler) {
     if (scaler.scale == 1)
         return block;
-    let bTop = scaler.toDOM(block.top, top), bBottom = scaler.toDOM(block.bottom, top);
-    return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, Array.isArray(block.type) ? block.type.map(b => scaleBlock(b, scaler, top)) : block.type);
+    let bTop = scaler.toDOM(block.top), bBottom = scaler.toDOM(block.bottom);
+    return new BlockInfo(block.from, block.length, bTop, bBottom - bTop, Array.isArray(block.type) ? block.type.map(b => scaleBlock(b, scaler)) : block.type);
 }
 
 const theme = state.Facet.define({ combine: strs => strs.join(" ") });
@@ -5878,11 +5906,11 @@ class EditorView {
             for (let i = 0;; i++) {
                 this.updateState = 1 /* Measuring */;
                 let oldViewport = this.viewport;
-                let changed = this.viewState.measure(this.docView, i > 0);
+                let changed = this.viewState.measure(this);
                 if (!changed && !this.measureRequests.length && this.viewState.scrollTarget == null)
                     break;
                 if (i > 5) {
-                    console.warn("Viewport failed to stabilize");
+                    console.warn(this.measureRequests.length ? "Measure loop restarted more than 5 times" : "Viewport failed to stabilize");
                     break;
                 }
                 let measuring = [];
@@ -5898,7 +5926,7 @@ class EditorView {
                         return BadMeasure;
                     }
                 });
-                let update = new ViewUpdate(this, this.state);
+                let update = new ViewUpdate(this, this.state), redrawn = false;
                 update.flags |= changed;
                 if (!updated)
                     updated = update;
@@ -5908,13 +5936,15 @@ class EditorView {
                 if (!update.empty) {
                     this.updatePlugins(update);
                     this.inputState.update(update);
+                    this.updateAttrs();
+                    redrawn = this.docView.update(update);
                 }
-                this.updateAttrs();
-                let redrawn = changed > 0 && this.docView.update(update);
                 for (let i = 0; i < measuring.length; i++)
                     if (measured[i] != BadMeasure) {
                         try {
-                            measuring[i].write(measured[i], this);
+                            let m = measuring[i];
+                            if (m.write)
+                                m.write(measured[i], this);
                         }
                         catch (e) {
                             logException(this.state, e);
@@ -5924,8 +5954,8 @@ class EditorView {
                     this.docView.scrollIntoView(this.viewState.scrollTarget);
                     this.viewState.scrollTarget = null;
                 }
-                if (changed)
-                    this.docView.updateSelection(redrawn);
+                if (redrawn)
+                    this.docView.updateSelection(true);
                 if (this.viewport.from == oldViewport.from && this.viewport.to == oldViewport.to && this.measureRequests.length == 0)
                     break;
             }
@@ -6038,6 +6068,13 @@ class EditorView {
         return null;
     }
     /**
+    The top position of the document, in screen coordinates. This
+    may be negative when the editor is scrolled down.
+    */
+    get documentTop() {
+        return this.contentDOM.getBoundingClientRect().top + this.viewState.paddingTop;
+    }
+    /**
     Find the line or block widget at the given vertical position.
     
     By default, this position is interpreted as a screen position,
@@ -6047,10 +6084,21 @@ class EditorView {
     position, or a precomputed document top
     (`view.contentDOM.getBoundingClientRect().top`) to limit layout
     queries.
+    
+    *Deprecated: use `blockAtHeight` instead.*
     */
     blockAtHeight(height, docTop) {
+        let top = ensureTop(docTop, this);
+        return this.elementAtHeight(height - top).moveY(top);
+    }
+    /**
+    Find the text line or block widget at the given vertical
+    position (which is interpreted as relative to the [top of the
+    document](https://codemirror.net/6/docs/ref/#view.EditorView.documentTop)
+    */
+    elementAtHeight(height) {
         this.readMeasured();
-        return this.viewState.blockAtHeight(height, ensureTop(docTop, this.contentDOM));
+        return this.viewState.elementAtHeight(height);
     }
     /**
     Find information for the visual line (see
@@ -6062,20 +6110,43 @@ class EditorView {
     Defaults to treating `height` as a screen position. See
     [`blockAtHeight`](https://codemirror.net/6/docs/ref/#view.EditorView.blockAtHeight) for the
     interpretation of the `docTop` parameter.
+    
+    *Deprecated: use `lineBlockAtHeight` instead.*
     */
     visualLineAtHeight(height, docTop) {
+        let top = ensureTop(docTop, this);
+        return this.lineBlockAtHeight(height - top).moveY(top);
+    }
+    /**
+    Find the line block (see
+    [`lineBlockAt`](https://codemirror.net/6/docs/ref/#view.EditorView.lineBlockAt) at the given
+    height.
+    */
+    lineBlockAtHeight(height) {
         this.readMeasured();
-        return this.viewState.lineAtHeight(height, ensureTop(docTop, this.contentDOM));
+        return this.viewState.lineBlockAtHeight(height);
     }
     /**
     Iterate over the height information of the visual lines in the
     viewport. The heights of lines are reported relative to the
     given document top, which defaults to the screen position of the
     document (forcing a layout).
+    
+    *Deprecated: use `viewportLineBlocks` instead.*
     */
     viewportLines(f, docTop) {
-        let { from, to } = this.viewport;
-        this.viewState.forEachLine(from, to, f, ensureTop(docTop, this.contentDOM));
+        let top = ensureTop(docTop, this);
+        for (let line of this.viewportLineBlocks)
+            f(line.moveY(top));
+    }
+    /**
+    Get the extent and vertical position of all [line
+    blocks](https://codemirror.net/6/docs/ref/#view.EditorView.lineBlockAt) in the viewport. Positions
+    are relative to the [top of the
+    document](https://codemirror.net/6/docs/ref/#view.EditorView.documentTop);
+    */
+    get viewportLineBlocks() {
+        return this.viewState.viewportLines;
     }
     /**
     Find the extent and height of the visual line (a range delimited
@@ -6086,9 +6157,22 @@ class EditorView {
     argument, which defaults to 0 for this method. You can pass
     `view.contentDOM.getBoundingClientRect().top` here to get screen
     coordinates.
+    
+    *Deprecated: use `lineBlockAt` instead.*
     */
     visualLineAt(pos, docTop = 0) {
-        return this.viewState.lineAt(pos, docTop);
+        return this.lineBlockAt(pos).moveY(docTop + this.viewState.paddingTop);
+    }
+    /**
+    Find the line block around the given document position. A line
+    block is a range delimited on both sides by either a
+    non-[hidden](https://codemirror.net/6/docs/ref/#view.Decoration^range) line breaks, or the
+    start/end of the document. It will usually just hold a line of
+    text, but may be broken into multiple textblocks by block
+    widgets.
+    */
+    lineBlockAt(pos) {
+        return this.viewState.lineBlockAt(pos);
     }
     /**
     The editor's total content height.
@@ -6421,8 +6505,9 @@ search match).
 EditorView.announce = state.StateEffect.define();
 // Maximum line length for which we compute accurate bidi info
 const MaxBidiLine = 4096;
-function ensureTop(given, dom) {
-    return given == null ? dom.getBoundingClientRect().top : given;
+// FIXME remove this and its callers on next breaking release
+function ensureTop(given, view) {
+    return (given == null ? view.contentDOM.getBoundingClientRect().top : given) + view.viewState.paddingTop;
 }
 let resizeDebounce = -1;
 function ensureGlobalHandler() {
@@ -6773,7 +6858,7 @@ function wrappedLine(view, pos, inside) {
         type: exports.BlockType.Text };
 }
 function blockAt(view, pos) {
-    let line = view.visualLineAt(pos);
+    let line = view.lineBlockAt(pos);
     if (Array.isArray(line.type))
         for (let l of line.type) {
             if (l.to > pos || l.to == pos && (l.to == line.to || l.type == exports.BlockType.Text))
@@ -7164,7 +7249,7 @@ const activeLineHighlighter = ViewPlugin.fromClass(class {
         for (let r of view.state.selection.ranges) {
             if (!r.empty)
                 return Decoration.none;
-            let line = view.visualLineAt(r.head);
+            let line = view.lineBlockAt(r.head);
             if (line.from > lastLineStart) {
                 deco.push(lineDeco.range(line.from));
                 lastLineStart = line.from;