@codemirror/view 0.19.45 → 0.19.48

package/CHANGELOG.md

@@ -1,3 +1,31 @@
+## 0.19.48 (2022-03-30)
+
+### Bug fixes
+
+Fix an issue where DOM syncing could crash when a DOM node was moved from a parent to a child node (via widgets reusing existing nodes).
+
+To avoid interfering with things like a vim mode too much, the editor will now only activate the tab-to-move-focus escape hatch after an escape press that wasn't handled by an event handler.
+
+Make sure the view measures itself before the page is printed.
+
+Tweak types of view plugin defining functions to avoid TypeScript errors when the plugin value doesn't have any of the interface's properties.
+
+## 0.19.47 (2022-03-08)
+
+### Bug fixes
+
+Fix an issue where block widgets at the start of the viewport could break height computations.
+
+## 0.19.46 (2022-03-03)
+
+### Bug fixes
+
+Fix a bug where block widgets on the edges of viewports could cause the positioning of content to misalign with the gutter and height computations.
+
+Improve cursor height next to widgets.
+
+Fix a bug where mapping positions to screen coordinates could return incorred coordinates during composition.
+
 ## 0.19.45 (2022-02-23)
 
 ### Bug fixes

package/dist/index.cjs

@@ -22,7 +22,7 @@ function getSelection(root) {
     return target.getSelection();
 }
 function contains(dom, node) {
-    return node ? dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
+    return node ? dom == node || dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
 }
 function deepActiveElement() {
     let elt = document.activeElement;
@@ -318,32 +318,34 @@ class ContentView {
     sync(track) {
         if (this.dirty & 2 /* Node */) {
             let parent = this.dom;
-            let pos = parent.firstChild;
+            let prev = null, next;
             for (let child of this.children) {
                 if (child.dirty) {
-                    if (!child.dom && pos) {
-                        let contentView = ContentView.get(pos);
+                    if (!child.dom && (next = prev ? prev.nextSibling : parent.firstChild)) {
+                        let contentView = ContentView.get(next);
                         if (!contentView || !contentView.parent && contentView.constructor == child.constructor)
-                            child.reuseDOM(pos);
+                            child.reuseDOM(next);
                     }
                     child.sync(track);
                     child.dirty = 0 /* Not */;
                 }
-                if (track && !track.written && track.node == parent && pos != child.dom)
+                next = prev ? prev.nextSibling : parent.firstChild;
+                if (track && !track.written && track.node == parent && next != child.dom)
                     track.written = true;
                 if (child.dom.parentNode == parent) {
-                    while (pos && pos != child.dom)
-                        pos = rm(pos);
-                    pos = child.dom.nextSibling;
+                    while (next && next != child.dom)
+                        next = rm(next);
                 }
                 else {
-                    parent.insertBefore(child.dom, pos);
+                    parent.insertBefore(child.dom, next);
                 }
+                prev = child.dom;
             }
-            if (pos && track && track.node == parent)
+            next = prev ? prev.nextSibling : parent.firstChild;
+            if (next && track && track.node == parent)
                 track.written = true;
-            while (pos)
-                pos = rm(pos);
+            while (next)
+                next = rm(next);
         }
         else if (this.dirty & 1 /* Child */) {
             for (let child of this.children)
@@ -856,18 +858,26 @@ class WidgetView extends ContentView {
 }
 class CompositionView extends WidgetView {
     domAtPos(pos) {
-        let { topView } = this.widget;
+        let { topView, text } = this.widget;
         if (!topView)
-            return new DOMPos(this.widget.text, Math.min(pos, this.widget.text.nodeValue.length));
-        return posInCompositionTree(pos, topView, this.widget.text);
+            return new DOMPos(text, Math.min(pos, text.nodeValue.length));
+        return scanCompositionTree(pos, 0, topView, text, (v, p) => v.domAtPos(p), p => new DOMPos(text, Math.min(p, text.nodeValue.length)));
     }
     sync() { this.setDOM(this.widget.toDOM()); }
     localPosFromDOM(node, offset) {
-        return !offset ? 0 : node.nodeType == 3 ? Math.min(offset, this.length) : this.length;
+        let { topView, text } = this.widget;
+        if (!topView)
+            return Math.min(offset, this.length);
+        return posFromDOMInCompositionTree(node, offset, topView, text);
     }
     ignoreMutation() { return false; }
     get overrideDOMText() { return null; }
-    coordsAt(pos, side) { return textCoords(this.widget.text, pos, side); }
+    coordsAt(pos, side) {
+        let { topView, text } = this.widget;
+        if (!topView)
+            return textCoords(text, pos, side);
+        return scanCompositionTree(pos, side, topView, text, (v, pos, side) => v.coordsAt(pos, side), (pos, side) => textCoords(text, pos, side));
+    }
     destroy() {
         var _a;
         super.destroy();
@@ -878,24 +888,38 @@ class CompositionView extends WidgetView {
 // Uses the old structure of a chunk of content view frozen for
 // composition to try and find a reasonable DOM location for the given
 // offset.
-function posInCompositionTree(pos, view, text) {
+function scanCompositionTree(pos, side, view, text, enterView, fromText) {
     if (view instanceof MarkView) {
         for (let child of view.children) {
-            let hasComp = child.dom == text || child.dom.contains(text.parentNode);
+            let hasComp = contains(child.dom, text);
             let len = hasComp ? text.nodeValue.length : child.length;
             if (pos < len || pos == len && child.getSide() <= 0)
-                return hasComp ? posInCompositionTree(pos, child, text) : child.domAtPos(pos);
+                return hasComp ? scanCompositionTree(pos, side, child, text, enterView, fromText) : enterView(child, pos, side);
             pos -= len;
         }
-        return view.domAtPos(view.length);
+        return enterView(view, view.length, -1);
     }
     else if (view.dom == text) {
-        return new DOMPos(text, Math.min(pos, text.nodeValue.length));
+        return fromText(pos, side);
     }
     else {
-        return view.domAtPos(pos);
+        return enterView(view, pos, side);
     }
 }
+function posFromDOMInCompositionTree(node, offset, view, text) {
+    if (view instanceof MarkView) {
+        for (let child of view.children) {
+            let pos = 0, hasComp = contains(child.dom, text);
+            if (contains(child.dom, node))
+                return pos + (hasComp ? posFromDOMInCompositionTree(node, offset, child, text) : child.localPosFromDOM(node, offset));
+            pos += hasComp ? text.nodeValue.length : child.length;
+        }
+    }
+    else if (view.dom == text) {
+        return Math.min(offset, text.nodeValue.length);
+    }
+    return view.localPosFromDOM(node, offset);
+}
 // These are drawn around uneditable widgets to avoid a number of
 // browser bugs that show up when the cursor is directly next to
 // uneditable inline content.
@@ -914,6 +938,7 @@ class WidgetBufferView extends ContentView {
         if (!this.dom) {
             let dom = document.createElement("img");
             dom.className = "cm-widgetBuffer";
+            dom.setAttribute("aria-hidden", "true");
             this.setDOM(dom);
         }
     }
@@ -922,13 +947,43 @@ class WidgetBufferView extends ContentView {
     localPosFromDOM() { return 0; }
     domBoundsAround() { return null; }
     coordsAt(pos) {
-        return this.dom.getBoundingClientRect();
+        let imgRect = this.dom.getBoundingClientRect();
+        // Since the <img> height doesn't correspond to text height, try
+        // to borrow the height from some sibling node.
+        let siblingRect = inlineSiblingRect(this, this.side > 0 ? -1 : 1);
+        return siblingRect && siblingRect.top < imgRect.bottom && siblingRect.bottom > imgRect.top
+            ? { left: imgRect.left, right: imgRect.right, top: siblingRect.top, bottom: siblingRect.bottom } : imgRect;
     }
     get overrideDOMText() {
         return text.Text.empty;
     }
 }
 TextView.prototype.children = WidgetView.prototype.children = WidgetBufferView.prototype.children = noChildren;
+function inlineSiblingRect(view, side) {
+    let parent = view.parent, index = parent ? parent.children.indexOf(view) : -1;
+    while (parent && index >= 0) {
+        if (side < 0 ? index > 0 : index < parent.children.length) {
+            let next = parent.children[index + side];
+            if (next instanceof TextView) {
+                let nextRect = next.coordsAt(side < 0 ? next.length : 0, side);
+                if (nextRect)
+                    return nextRect;
+            }
+            index += side;
+        }
+        else if (parent instanceof MarkView && parent.parent) {
+            index = parent.parent.children.indexOf(parent) + (side < 0 ? 0 : 1);
+            parent = parent.parent;
+        }
+        else {
+            let last = parent.dom.lastChild;
+            if (last && last.nodeName == "BR")
+                return last.getClientRects()[0];
+            break;
+        }
+    }
+    return undefined;
+}
 function inlineDOMAtPos(dom, children, pos) {
     let i = 0;
     for (let off = 0; i < children.length; i++) {
@@ -1162,10 +1217,16 @@ class Decoration extends rangeset.RangeValue {
     a widget, or simply hides it.
     */
     static replace(spec) {
-        let block = !!spec.block;
-        let { start, end } = getInclusive(spec, block);
-        let startSide = (start ? (block ? -300000000 /* BlockIncStart */ : -1 /* InlineIncStart */) : 400000000 /* NonIncStart */) - 1;
-        let endSide = (end ? (block ? 200000000 /* BlockIncEnd */ : 1 /* InlineIncEnd */) : -500000000 /* NonIncEnd */) + 1;
+        let block = !!spec.block, startSide, endSide;
+        if (spec.isBlockGap) {
+            startSide = -500000000 /* GapStart */;
+            endSide = 400000000 /* GapEnd */;
+        }
+        else {
+            let { start, end } = getInclusive(spec, block);
+            startSide = (start ? (block ? -300000000 /* BlockIncStart */ : -1 /* InlineIncStart */) : 500000000 /* NonIncStart */) - 1;
+            endSide = (end ? (block ? 200000000 /* BlockIncEnd */ : 1 /* InlineIncEnd */) : -600000000 /* NonIncEnd */) + 1;
+        }
         return new PointDecoration(spec, startSide, endSide, block, spec.widget || null, true);
     }
     /**
@@ -1195,7 +1256,7 @@ Decoration.none = rangeset.RangeSet.empty;
 class MarkDecoration extends Decoration {
     constructor(spec) {
         let { start, end } = getInclusive(spec);
-        super(start ? -1 /* InlineIncStart */ : 400000000 /* NonIncStart */, end ? 1 /* InlineIncEnd */ : -500000000 /* NonIncEnd */, null, spec);
+        super(start ? -1 /* InlineIncStart */ : 500000000 /* NonIncStart */, end ? 1 /* InlineIncEnd */ : -600000000 /* NonIncEnd */, null, spec);
         this.tagName = spec.tagName || "span";
         this.class = spec.class || "";
         this.attrs = spec.attributes || null;
@@ -1376,7 +1437,7 @@ class LineView extends ContentView {
         let last = this.dom.lastChild;
         while (last && ContentView.get(last) instanceof MarkView)
             last = last.lastChild;
-        if (!last ||
+        if (!last || !this.length ||
             last.nodeName != "BR" && ((_a = ContentView.get(last)) === null || _a === void 0 ? void 0 : _a.isEditable) == false &&
                 (!browser.ios || !this.children.some(ch => ch instanceof TextView))) {
             let hack = document.createElement("BR");
@@ -2774,7 +2835,12 @@ class DocView extends ContentView {
             let end = next ? next.from - 1 : this.length;
             if (end > pos) {
                 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));
+                deco.push(Decoration.replace({
+                    widget: new BlockGapWidget(height),
+                    block: true,
+                    inclusive: true,
+                    isBlockGap: true,
+                }).range(pos, end));
             }
             if (!next)
                 break;
@@ -3309,10 +3375,10 @@ class InputState {
         for (let type in handlers) {
             let handler = handlers[type];
             view.contentDOM.addEventListener(type, (event) => {
-                if (type == "keydown" && this.keydown(view, event))
-                    return;
                 if (!eventBelongsToEditor(view, event) || this.ignoreDuringComposition(event))
                     return;
+                if (type == "keydown" && this.keydown(view, event))
+                    return;
                 if (this.mustFlushObserver(event))
                     view.observer.forceFlush();
                 if (this.runCustomHandlers(type, view, event))
@@ -3380,7 +3446,7 @@ class InputState {
         // Must always run, even if a custom handler handled the event
         this.lastKeyCode = event.keyCode;
         this.lastKeyTime = Date.now();
-        if (this.screenKeyEvent(view, event))
+        if (event.keyCode == 9 && Date.now() < this.lastEscPress + 2000)
             return true;
         // Chrome for Android usually doesn't fire proper key events, but
         // occasionally does, usually surrounded by a bunch of complicated
@@ -3430,14 +3496,6 @@ class InputState {
         }
         return false;
     }
-    screenKeyEvent(view, event) {
-        let protectedTab = event.keyCode == 9 && Date.now() < this.lastEscPress + 2000;
-        if (event.keyCode == 27)
-            this.lastEscPress = Date.now();
-        else if (modifierCodes.indexOf(event.keyCode) < 0)
-            this.lastEscPress = 0;
-        return protectedTab;
-    }
     mustFlushObserver(event) {
         return (event.type == "keydown" && event.keyCode != 229) ||
             event.type == "compositionend" && !browser.ios;
@@ -3611,6 +3669,10 @@ function doPaste(view, input) {
 }
 handlers.keydown = (view, event) => {
     view.inputState.setSelectionOrigin("select");
+    if (event.keyCode == 27)
+        view.inputState.lastEscPress = Date.now();
+    else if (modifierCodes.indexOf(event.keyCode) < 0)
+        view.inputState.lastEscPress = 0;
 };
 let lastTouch = 0;
 handlers.touchstart = (view, e) => {
@@ -3868,14 +3930,6 @@ handlers.focus = handlers.blur = view => {
             view.update([]);
     }, 10);
 };
-handlers.beforeprint = view => {
-    view.viewState.printing = true;
-    view.requestMeasure();
-    setTimeout(() => {
-        view.viewState.printing = false;
-        view.requestMeasure();
-    }, 2000);
-};
 function forceClearComposition(view, rapid) {
     if (view.docView.compositionDeco.size) {
         view.inputState.rapidCompositionStart = rapid;
@@ -4631,6 +4685,11 @@ function visiblePixelRange(dom, paddingTop) {
     return { left: left - rect.left, right: Math.max(left, right) - rect.left,
         top: top - (rect.top + paddingTop), bottom: Math.max(top, bottom) - (rect.top + paddingTop) };
 }
+function fullPixelRange(dom, paddingTop) {
+    let rect = dom.getBoundingClientRect();
+    return { left: 0, right: rect.right - rect.left,
+        top: paddingTop, bottom: rect.bottom - (rect.top + paddingTop) };
+}
 // Line gaps are placeholder widgets used to hide pieces of overlong
 // lines within the viewport, as a kludge to keep the editor
 // responsive when a ridiculously long line is loaded into it.
@@ -4787,8 +4846,7 @@ class ViewState {
             }
         }
         // Pixel viewport
-        let pixelViewport = this.printing ? { top: -1e8, bottom: 1e8, left: -1e8, right: 1e8 }
-            : visiblePixelRange(dom, this.paddingTop);
+        let pixelViewport = (this.printing ? fullPixelRange : visiblePixelRange)(dom, this.paddingTop);
         let dTop = pixelViewport.top - this.pixelViewport.top, dBottom = pixelViewport.bottom - this.pixelViewport.bottom;
         this.pixelViewport = pixelViewport;
         let inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
@@ -5365,6 +5423,7 @@ class DOMObserver {
             });
             this.resize.observe(view.scrollDOM);
         }
+        window.addEventListener("beforeprint", this.onPrint = this.onPrint.bind(this));
         this.start();
         window.addEventListener("scroll", this.onScroll = this.onScroll.bind(this));
         if (typeof IntersectionObserver == "function") {
@@ -5399,6 +5458,14 @@ class DOMObserver {
                 this.view.requestMeasure();
             }, 50);
     }
+    onPrint() {
+        this.view.viewState.printing = true;
+        this.view.measure();
+        setTimeout(() => {
+            this.view.viewState.printing = false;
+            this.view.requestMeasure();
+        }, 500);
+    }
     updateGaps(gaps) {
         if (this.gapIntersection && (gaps.length != this.gaps.length || this.gaps.some((g, i) => g != gaps[i]))) {
             this.gapIntersection.disconnect();
@@ -5616,6 +5683,7 @@ class DOMObserver {
             dom.removeEventListener("scroll", this.onScroll);
         window.removeEventListener("scroll", this.onScroll);
         window.removeEventListener("resize", this.onResize);
+        window.removeEventListener("beforeprint", this.onPrint);
         this.dom.ownerDocument.removeEventListener("selectionchange", this.onSelectionChange);
         clearTimeout(this.parentCheck);
         clearTimeout(this.resizeTimeout);

package/dist/index.d.ts

@@ -413,12 +413,12 @@ declare class ViewPlugin<V extends PluginValue> {
     Define a plugin from a constructor function that creates the
     plugin's value, given an editor view.
     */
-    static define<V extends PluginValue>(create: (view: EditorView) => V, spec?: PluginSpec<V>): ViewPlugin<V>;
+    static define<V extends PluginValue & object>(create: (view: EditorView) => V, spec?: PluginSpec<V>): ViewPlugin<V>;
     /**
     Create a plugin for a class whose constructor takes a single
     editor view as argument.
     */
-    static fromClass<V extends PluginValue>(cls: {
+    static fromClass<V extends PluginValue & object>(cls: {
         new (view: EditorView): V;
     }, spec?: PluginSpec<V>): ViewPlugin<V>;
 }

package/dist/index.js

@@ -19,7 +19,7 @@ function getSelection(root) {
     return target.getSelection();
 }
 function contains(dom, node) {
-    return node ? dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
+    return node ? dom == node || dom.contains(node.nodeType != 1 ? node.parentNode : node) : false;
 }
 function deepActiveElement() {
     let elt = document.activeElement;
@@ -315,32 +315,34 @@ class ContentView {
     sync(track) {
         if (this.dirty & 2 /* Node */) {
             let parent = this.dom;
-            let pos = parent.firstChild;
+            let prev = null, next;
             for (let child of this.children) {
                 if (child.dirty) {
-                    if (!child.dom && pos) {
-                        let contentView = ContentView.get(pos);
+                    if (!child.dom && (next = prev ? prev.nextSibling : parent.firstChild)) {
+                        let contentView = ContentView.get(next);
                         if (!contentView || !contentView.parent && contentView.constructor == child.constructor)
-                            child.reuseDOM(pos);
+                            child.reuseDOM(next);
                     }
                     child.sync(track);
                     child.dirty = 0 /* Not */;
                 }
-                if (track && !track.written && track.node == parent && pos != child.dom)
+                next = prev ? prev.nextSibling : parent.firstChild;
+                if (track && !track.written && track.node == parent && next != child.dom)
                     track.written = true;
                 if (child.dom.parentNode == parent) {
-                    while (pos && pos != child.dom)
-                        pos = rm(pos);
-                    pos = child.dom.nextSibling;
+                    while (next && next != child.dom)
+                        next = rm(next);
                 }
                 else {
-                    parent.insertBefore(child.dom, pos);
+                    parent.insertBefore(child.dom, next);
                 }
+                prev = child.dom;
             }
-            if (pos && track && track.node == parent)
+            next = prev ? prev.nextSibling : parent.firstChild;
+            if (next && track && track.node == parent)
                 track.written = true;
-            while (pos)
-                pos = rm(pos);
+            while (next)
+                next = rm(next);
         }
         else if (this.dirty & 1 /* Child */) {
             for (let child of this.children)
@@ -853,18 +855,26 @@ class WidgetView extends ContentView {
 }
 class CompositionView extends WidgetView {
     domAtPos(pos) {
-        let { topView } = this.widget;
+        let { topView, text } = this.widget;
         if (!topView)
-            return new DOMPos(this.widget.text, Math.min(pos, this.widget.text.nodeValue.length));
-        return posInCompositionTree(pos, topView, this.widget.text);
+            return new DOMPos(text, Math.min(pos, text.nodeValue.length));
+        return scanCompositionTree(pos, 0, topView, text, (v, p) => v.domAtPos(p), p => new DOMPos(text, Math.min(p, text.nodeValue.length)));
     }
     sync() { this.setDOM(this.widget.toDOM()); }
     localPosFromDOM(node, offset) {
-        return !offset ? 0 : node.nodeType == 3 ? Math.min(offset, this.length) : this.length;
+        let { topView, text } = this.widget;
+        if (!topView)
+            return Math.min(offset, this.length);
+        return posFromDOMInCompositionTree(node, offset, topView, text);
     }
     ignoreMutation() { return false; }
     get overrideDOMText() { return null; }
-    coordsAt(pos, side) { return textCoords(this.widget.text, pos, side); }
+    coordsAt(pos, side) {
+        let { topView, text } = this.widget;
+        if (!topView)
+            return textCoords(text, pos, side);
+        return scanCompositionTree(pos, side, topView, text, (v, pos, side) => v.coordsAt(pos, side), (pos, side) => textCoords(text, pos, side));
+    }
     destroy() {
         var _a;
         super.destroy();
@@ -875,24 +885,38 @@ class CompositionView extends WidgetView {
 // Uses the old structure of a chunk of content view frozen for
 // composition to try and find a reasonable DOM location for the given
 // offset.
-function posInCompositionTree(pos, view, text) {
+function scanCompositionTree(pos, side, view, text, enterView, fromText) {
     if (view instanceof MarkView) {
         for (let child of view.children) {
-            let hasComp = child.dom == text || child.dom.contains(text.parentNode);
+            let hasComp = contains(child.dom, text);
             let len = hasComp ? text.nodeValue.length : child.length;
             if (pos < len || pos == len && child.getSide() <= 0)
-                return hasComp ? posInCompositionTree(pos, child, text) : child.domAtPos(pos);
+                return hasComp ? scanCompositionTree(pos, side, child, text, enterView, fromText) : enterView(child, pos, side);
             pos -= len;
         }
-        return view.domAtPos(view.length);
+        return enterView(view, view.length, -1);
     }
     else if (view.dom == text) {
-        return new DOMPos(text, Math.min(pos, text.nodeValue.length));
+        return fromText(pos, side);
     }
     else {
-        return view.domAtPos(pos);
+        return enterView(view, pos, side);
     }
 }
+function posFromDOMInCompositionTree(node, offset, view, text) {
+    if (view instanceof MarkView) {
+        for (let child of view.children) {
+            let pos = 0, hasComp = contains(child.dom, text);
+            if (contains(child.dom, node))
+                return pos + (hasComp ? posFromDOMInCompositionTree(node, offset, child, text) : child.localPosFromDOM(node, offset));
+            pos += hasComp ? text.nodeValue.length : child.length;
+        }
+    }
+    else if (view.dom == text) {
+        return Math.min(offset, text.nodeValue.length);
+    }
+    return view.localPosFromDOM(node, offset);
+}
 // These are drawn around uneditable widgets to avoid a number of
 // browser bugs that show up when the cursor is directly next to
 // uneditable inline content.
@@ -911,6 +935,7 @@ class WidgetBufferView extends ContentView {
         if (!this.dom) {
             let dom = document.createElement("img");
             dom.className = "cm-widgetBuffer";
+            dom.setAttribute("aria-hidden", "true");
             this.setDOM(dom);
         }
     }
@@ -919,13 +944,43 @@ class WidgetBufferView extends ContentView {
     localPosFromDOM() { return 0; }
     domBoundsAround() { return null; }
     coordsAt(pos) {
-        return this.dom.getBoundingClientRect();
+        let imgRect = this.dom.getBoundingClientRect();
+        // Since the <img> height doesn't correspond to text height, try
+        // to borrow the height from some sibling node.
+        let siblingRect = inlineSiblingRect(this, this.side > 0 ? -1 : 1);
+        return siblingRect && siblingRect.top < imgRect.bottom && siblingRect.bottom > imgRect.top
+            ? { left: imgRect.left, right: imgRect.right, top: siblingRect.top, bottom: siblingRect.bottom } : imgRect;
     }
     get overrideDOMText() {
         return Text.empty;
     }
 }
 TextView.prototype.children = WidgetView.prototype.children = WidgetBufferView.prototype.children = noChildren;
+function inlineSiblingRect(view, side) {
+    let parent = view.parent, index = parent ? parent.children.indexOf(view) : -1;
+    while (parent && index >= 0) {
+        if (side < 0 ? index > 0 : index < parent.children.length) {
+            let next = parent.children[index + side];
+            if (next instanceof TextView) {
+                let nextRect = next.coordsAt(side < 0 ? next.length : 0, side);
+                if (nextRect)
+                    return nextRect;
+            }
+            index += side;
+        }
+        else if (parent instanceof MarkView && parent.parent) {
+            index = parent.parent.children.indexOf(parent) + (side < 0 ? 0 : 1);
+            parent = parent.parent;
+        }
+        else {
+            let last = parent.dom.lastChild;
+            if (last && last.nodeName == "BR")
+                return last.getClientRects()[0];
+            break;
+        }
+    }
+    return undefined;
+}
 function inlineDOMAtPos(dom, children, pos) {
     let i = 0;
     for (let off = 0; i < children.length; i++) {
@@ -1158,10 +1213,16 @@ class Decoration extends RangeValue {
     a widget, or simply hides it.
     */
     static replace(spec) {
-        let block = !!spec.block;
-        let { start, end } = getInclusive(spec, block);
-        let startSide = (start ? (block ? -300000000 /* BlockIncStart */ : -1 /* InlineIncStart */) : 400000000 /* NonIncStart */) - 1;
-        let endSide = (end ? (block ? 200000000 /* BlockIncEnd */ : 1 /* InlineIncEnd */) : -500000000 /* NonIncEnd */) + 1;
+        let block = !!spec.block, startSide, endSide;
+        if (spec.isBlockGap) {
+            startSide = -500000000 /* GapStart */;
+            endSide = 400000000 /* GapEnd */;
+        }
+        else {
+            let { start, end } = getInclusive(spec, block);
+            startSide = (start ? (block ? -300000000 /* BlockIncStart */ : -1 /* InlineIncStart */) : 500000000 /* NonIncStart */) - 1;
+            endSide = (end ? (block ? 200000000 /* BlockIncEnd */ : 1 /* InlineIncEnd */) : -600000000 /* NonIncEnd */) + 1;
+        }
         return new PointDecoration(spec, startSide, endSide, block, spec.widget || null, true);
     }
     /**
@@ -1191,7 +1252,7 @@ Decoration.none = RangeSet.empty;
 class MarkDecoration extends Decoration {
     constructor(spec) {
         let { start, end } = getInclusive(spec);
-        super(start ? -1 /* InlineIncStart */ : 400000000 /* NonIncStart */, end ? 1 /* InlineIncEnd */ : -500000000 /* NonIncEnd */, null, spec);
+        super(start ? -1 /* InlineIncStart */ : 500000000 /* NonIncStart */, end ? 1 /* InlineIncEnd */ : -600000000 /* NonIncEnd */, null, spec);
         this.tagName = spec.tagName || "span";
         this.class = spec.class || "";
         this.attrs = spec.attributes || null;
@@ -1372,7 +1433,7 @@ class LineView extends ContentView {
         let last = this.dom.lastChild;
         while (last && ContentView.get(last) instanceof MarkView)
             last = last.lastChild;
-        if (!last ||
+        if (!last || !this.length ||
             last.nodeName != "BR" && ((_a = ContentView.get(last)) === null || _a === void 0 ? void 0 : _a.isEditable) == false &&
                 (!browser.ios || !this.children.some(ch => ch instanceof TextView))) {
             let hack = document.createElement("BR");
@@ -2769,7 +2830,12 @@ class DocView extends ContentView {
             let end = next ? next.from - 1 : this.length;
             if (end > pos) {
                 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));
+                deco.push(Decoration.replace({
+                    widget: new BlockGapWidget(height),
+                    block: true,
+                    inclusive: true,
+                    isBlockGap: true,
+                }).range(pos, end));
             }
             if (!next)
                 break;
@@ -3304,10 +3370,10 @@ class InputState {
         for (let type in handlers) {
             let handler = handlers[type];
             view.contentDOM.addEventListener(type, (event) => {
-                if (type == "keydown" && this.keydown(view, event))
-                    return;
                 if (!eventBelongsToEditor(view, event) || this.ignoreDuringComposition(event))
                     return;
+                if (type == "keydown" && this.keydown(view, event))
+                    return;
                 if (this.mustFlushObserver(event))
                     view.observer.forceFlush();
                 if (this.runCustomHandlers(type, view, event))
@@ -3375,7 +3441,7 @@ class InputState {
         // Must always run, even if a custom handler handled the event
         this.lastKeyCode = event.keyCode;
         this.lastKeyTime = Date.now();
-        if (this.screenKeyEvent(view, event))
+        if (event.keyCode == 9 && Date.now() < this.lastEscPress + 2000)
             return true;
         // Chrome for Android usually doesn't fire proper key events, but
         // occasionally does, usually surrounded by a bunch of complicated
@@ -3425,14 +3491,6 @@ class InputState {
         }
         return false;
     }
-    screenKeyEvent(view, event) {
-        let protectedTab = event.keyCode == 9 && Date.now() < this.lastEscPress + 2000;
-        if (event.keyCode == 27)
-            this.lastEscPress = Date.now();
-        else if (modifierCodes.indexOf(event.keyCode) < 0)
-            this.lastEscPress = 0;
-        return protectedTab;
-    }
     mustFlushObserver(event) {
         return (event.type == "keydown" && event.keyCode != 229) ||
             event.type == "compositionend" && !browser.ios;
@@ -3606,6 +3664,10 @@ function doPaste(view, input) {
 }
 handlers.keydown = (view, event) => {
     view.inputState.setSelectionOrigin("select");
+    if (event.keyCode == 27)
+        view.inputState.lastEscPress = Date.now();
+    else if (modifierCodes.indexOf(event.keyCode) < 0)
+        view.inputState.lastEscPress = 0;
 };
 let lastTouch = 0;
 handlers.touchstart = (view, e) => {
@@ -3863,14 +3925,6 @@ handlers.focus = handlers.blur = view => {
             view.update([]);
     }, 10);
 };
-handlers.beforeprint = view => {
-    view.viewState.printing = true;
-    view.requestMeasure();
-    setTimeout(() => {
-        view.viewState.printing = false;
-        view.requestMeasure();
-    }, 2000);
-};
 function forceClearComposition(view, rapid) {
     if (view.docView.compositionDeco.size) {
         view.inputState.rapidCompositionStart = rapid;
@@ -4625,6 +4679,11 @@ function visiblePixelRange(dom, paddingTop) {
     return { left: left - rect.left, right: Math.max(left, right) - rect.left,
         top: top - (rect.top + paddingTop), bottom: Math.max(top, bottom) - (rect.top + paddingTop) };
 }
+function fullPixelRange(dom, paddingTop) {
+    let rect = dom.getBoundingClientRect();
+    return { left: 0, right: rect.right - rect.left,
+        top: paddingTop, bottom: rect.bottom - (rect.top + paddingTop) };
+}
 // Line gaps are placeholder widgets used to hide pieces of overlong
 // lines within the viewport, as a kludge to keep the editor
 // responsive when a ridiculously long line is loaded into it.
@@ -4781,8 +4840,7 @@ class ViewState {
             }
         }
         // Pixel viewport
-        let pixelViewport = this.printing ? { top: -1e8, bottom: 1e8, left: -1e8, right: 1e8 }
-            : visiblePixelRange(dom, this.paddingTop);
+        let pixelViewport = (this.printing ? fullPixelRange : visiblePixelRange)(dom, this.paddingTop);
         let dTop = pixelViewport.top - this.pixelViewport.top, dBottom = pixelViewport.bottom - this.pixelViewport.bottom;
         this.pixelViewport = pixelViewport;
         let inView = this.pixelViewport.bottom > this.pixelViewport.top && this.pixelViewport.right > this.pixelViewport.left;
@@ -5359,6 +5417,7 @@ class DOMObserver {
             });
             this.resize.observe(view.scrollDOM);
         }
+        window.addEventListener("beforeprint", this.onPrint = this.onPrint.bind(this));
         this.start();
         window.addEventListener("scroll", this.onScroll = this.onScroll.bind(this));
         if (typeof IntersectionObserver == "function") {
@@ -5393,6 +5452,14 @@ class DOMObserver {
                 this.view.requestMeasure();
             }, 50);
     }
+    onPrint() {
+        this.view.viewState.printing = true;
+        this.view.measure();
+        setTimeout(() => {
+            this.view.viewState.printing = false;
+            this.view.requestMeasure();
+        }, 500);
+    }
     updateGaps(gaps) {
         if (this.gapIntersection && (gaps.length != this.gaps.length || this.gaps.some((g, i) => g != gaps[i]))) {
             this.gapIntersection.disconnect();
@@ -5610,6 +5677,7 @@ class DOMObserver {
             dom.removeEventListener("scroll", this.onScroll);
         window.removeEventListener("scroll", this.onScroll);
         window.removeEventListener("resize", this.onResize);
+        window.removeEventListener("beforeprint", this.onPrint);
         this.dom.ownerDocument.removeEventListener("selectionchange", this.onSelectionChange);
         clearTimeout(this.parentCheck);
         clearTimeout(this.resizeTimeout);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/view",
-  "version": "0.19.45",
+  "version": "0.19.48",
   "description": "DOM view component for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",