@codemirror/view 0.19.34 → 0.19.35

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 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

package/dist/index.cjs

@@ -2990,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);
@@ -3016,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)
@@ -3510,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)) {
@@ -3632,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 ?
@@ -4745,7 +4750,7 @@ class ViewState {
                 let block = map.lineAt(head, QueryType.ByPos, doc, 0, 0), topPos;
                 if (scrollTarget.y == "center")
                     topPos = (block.top + block.bottom) / 2 - viewHeight / 2;
-                else if (scrollTarget.y == "start" || head < viewport.from)
+                else if (scrollTarget.y == "start" || scrollTarget.y == "nearest" && head < viewport.from)
                     topPos = block.top;
                 else
                     topPos = block.bottom - viewHeight;
@@ -5292,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

package/dist/index.d.ts

@@ -937,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;

package/dist/index.js

@@ -2985,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);
@@ -3011,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)
@@ -3505,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)) {
@@ -3627,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 ?
@@ -4739,7 +4744,7 @@ class ViewState {
                 let block = map.lineAt(head, QueryType.ByPos, doc, 0, 0), topPos;
                 if (scrollTarget.y == "center")
                     topPos = (block.top + block.bottom) / 2 - viewHeight / 2;
-                else if (scrollTarget.y == "start" || head < viewport.from)
+                else if (scrollTarget.y == "start" || scrollTarget.y == "nearest" && head < viewport.from)
                     topPos = block.top;
                 else
                     topPos = block.bottom - viewHeight;
@@ -5286,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

package/package.json

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