jodit 4.14.2 → 4.14.3

package/esm/core/selection/selection.js

@@ -27,6 +27,7 @@ import { cursorInTheEdgeOfString, findCorrectCurrentNode } from "./helpers/index
 export class Selection {
     constructor(jodit) {
         this.jodit = jodit;
+        this.__fakeSelections = new WeakMap();
         jodit.e.on('removeMarkers', () => {
             this.removeMarkers();
         });
@@ -85,8 +86,15 @@ export class Selection {
      */
     get isInsideArea() {
         const { sel } = this;
-        const range = (sel === null || sel === void 0 ? void 0 : sel.rangeCount) ? sel.getRangeAt(0) : null;
-        return !(!range || !Dom.isOrContains(this.area, range.startContainer));
+        if (!(sel === null || sel === void 0 ? void 0 : sel.rangeCount)) {
+            return false;
+        }
+        for (let i = 0; i < sel.rangeCount; i += 1) {
+            if (!Dom.isOrContains(this.area, sel.getRangeAt(i).commonAncestorContainer)) {
+                return false;
+            }
+        }
+        return true;
     }
     /**
      * Return current selection object
@@ -106,8 +114,11 @@ export class Selection {
         const sel = this.sel, current = this.current();
         if (sel && current) {
             for (let i = 0; i < sel.rangeCount; i += 1) {
-                sel.getRangeAt(i).deleteContents();
-                sel.getRangeAt(i).collapse(true);
+                const range = sel.getRangeAt(i);
+                if (Dom.isOrContains(this.area, range.commonAncestorContainer)) {
+                    range.deleteContents();
+                    range.collapse(true);
+                }
             }
         }
     }
@@ -138,28 +149,31 @@ export class Selection {
      * @returns false - Something went wrong
      */
     insertCursorAtPoint(x, y) {
-        this.removeMarkers();
+        var _a, _b, _c, _d;
         try {
-            const rng = this.createRange();
-            (() => {
-                if (this.doc.caretPositionFromPoint) {
-                    const caret = this.doc.caretPositionFromPoint(x, y);
-                    if (caret) {
-                        rng.setStart(caret.offsetNode, caret.offset);
-                        return;
-                    }
-                }
-                if (this.doc.caretRangeFromPoint) {
-                    const caret = this.doc.caretRangeFromPoint(x, y);
-                    assert(caret, 'Incorrect caretRangeFromPoint behaviour');
-                    rng.setStart(caret.startContainer, caret.startOffset);
-                }
-            })();
-            rng.collapse(true);
-            this.selectRange(rng);
+            const range = this.createRange();
+            const position = (_b = (_a = this.doc).caretPositionFromPoint) === null || _b === void 0 ? void 0 : _b.call(_a, x, y);
+            const caret = position
+                ? null
+                : (_d = (_c = this.doc).caretRangeFromPoint) === null || _d === void 0 ? void 0 : _d.call(_c, x, y);
+            if (position) {
+                range.setStart(position.offsetNode, position.offset);
+            }
+            else if (caret) {
+                range.setStart(caret.startContainer, caret.startOffset);
+            }
+            else {
+                return false;
+            }
+            if (!Dom.isOrContains(this.area, range.startContainer)) {
+                return false;
+            }
+            range.collapse(true);
+            this.removeMarkers();
+            this.selectRange(range);
             return true;
         }
-        catch (_a) { }
+        catch (_e) { }
         return false;
     }
     /**
@@ -217,89 +231,131 @@ export class Selection {
      * Restores user selections using marker invisible elements in the DOM.
      */
     restore() {
-        let range = false;
-        const markerFilter = (start) => (node) => Dom.isMarker(node) &&
-            attr(node, 'data-' + consts.MARKER_CLASS) ===
-                (start ? 'start' : 'end');
-        const start = Dom.first(this.area, markerFilter(true));
-        const end = Dom.first(this.area, markerFilter(false));
-        if (!start) {
-            return;
-        }
-        range = this.createRange();
-        if (!end) {
-            const previousNode = start.previousSibling;
-            if (Dom.isText(previousNode)) {
-                range.setStart(previousNode, previousNode.nodeValue ? previousNode.nodeValue.length : 0);
+        var _a, _b;
+        const markers = this.markers;
+        const byId = new Map(markers.map(marker => [marker.id, marker]));
+        const ranges = [];
+        let backward = false;
+        for (let i = 0; i < markers.length; i += 1) {
+            const start = markers[i];
+            if (attr(start, 'data-' + consts.MARKER_CLASS) !== 'start') {
+                continue;
+            }
+            backward || (backward = attr(start, 'data-selection-backward') === 'true');
+            const endId = attr(start, 'data-selection-end');
+            let end = endId ? byId.get(endId) : undefined;
+            if (!endId &&
+                markers[i + 1] &&
+                attr(markers[i + 1], 'data-' + consts.MARKER_CLASS) === 'end') {
+                end = markers[i + 1];
+            }
+            const range = this.createRange();
+            if (end) {
+                range.setStartAfter(start);
+                range.setEndBefore(end);
             }
             else {
-                range.setStartBefore(start);
+                const previous = start.previousSibling;
+                if (Dom.isText(previous)) {
+                    range.setStart(previous, (_b = (_a = previous.nodeValue) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0);
+                }
+                else {
+                    range.setStartBefore(start);
+                }
+                range.collapse(true);
             }
-            Dom.safeRemove(start);
-            range.collapse(true);
-        }
-        else {
-            range.setStartAfter(start);
-            Dom.safeRemove(start);
-            range.setEndBefore(end);
-            Dom.safeRemove(end);
+            ranges.push(range);
         }
-        if (range) {
-            this.selectRange(range);
+        Dom.safeRemove(...markers);
+        if (ranges.length) {
+            this.__selectRanges(ranges, backward);
         }
     }
+    __isBackward() {
+        const sel = this.sel;
+        return Boolean(sel &&
+            sel.rangeCount === 1 &&
+            !sel.isCollapsed &&
+            sel.anchorNode === sel.getRangeAt(0).endContainer &&
+            sel.anchorOffset === sel.getRangeAt(0).endOffset);
+    }
+    __ranges() {
+        const sel = this.sel;
+        return sel
+            ? Array.from({ length: sel.rangeCount }, (_, i) => sel.getRangeAt(i).cloneRange())
+            : [];
+    }
     /**
      * Inserts invisible fake nodes on the boundaries of the current selection
-     * and returns them. Unlike [[Select.save]] the selection stays valid while
+     * and returns the first pair as a restoration handle for all ranges. Unlike [[Select.save]] the selection stays valid while
      * the DOM around it is being modified. Restore it later with [[Select.restoreFakes]].
      */
     fakes() {
-        const sel = this.sel;
-        if (!sel || !sel.rangeCount) {
+        if (!this.isInsideArea) {
             return [];
         }
-        const range = sel.getRangeAt(0);
-        assert(range, 'Range is null');
-        const left = range.cloneRange();
-        left.collapse(true);
-        const fakeLeft = this.j.createInside.fake();
-        Dom.safeInsertNode(left, fakeLeft);
-        range.setStartBefore(fakeLeft);
-        const result = [fakeLeft];
-        if (!range.collapsed) {
-            const right = range.cloneRange();
-            right.collapse(false);
-            const fakeRight = this.j.createInside.fake();
-            Dom.safeInsertNode(right, fakeRight);
-            range.setEndAfter(fakeRight);
-            result.push(fakeRight);
-        }
-        this.selectRange(range);
-        return result;
+        const backward = this.__isBackward();
+        const ranges = this.__ranges();
+        const pairs = ranges.map(range => {
+            const collapsed = range.collapsed;
+            const left = range.cloneRange();
+            left.collapse(true);
+            const fakeLeft = this.j.createInside.fake();
+            Dom.safeInsertNode(left, fakeLeft);
+            range.setStartBefore(fakeLeft);
+            const pair = [fakeLeft];
+            if (!collapsed) {
+                const right = range.cloneRange();
+                right.collapse(false);
+                const fakeRight = this.j.createInside.fake();
+                Dom.safeInsertNode(right, fakeRight);
+                range.setEndAfter(fakeRight);
+                pair.push(fakeRight);
+            }
+            else {
+                range.collapse(true);
+            }
+            return pair;
+        });
+        this.__fakeSelections.set(pairs[0][0], { pairs, backward });
+        this.__selectRanges(ranges, backward);
+        return pairs[0];
     }
-    /**
-     * Restores the selection previously saved with [[Select.fakes]]
-     * and removes the fake nodes (disconnected fakes are ignored).
-     */
+    /** Restore all ranges associated with the returned fake pair. */
     restoreFakes(fakes) {
-        var _a, _b, _c, _d;
-        const nodes = fakes.filter(n => n.isConnected);
-        if (!nodes.length) {
+        var _a, _b, _c;
+        if (!fakes.length) {
             return;
         }
-        const [fakeLeft, fakeRight] = nodes;
-        const range = this.createRange();
-        range.setStartAfter(fakeLeft);
-        if (fakeRight) {
-            range.setEndBefore(fakeRight);
+        const saved = this.__fakeSelections.get(fakes[0]);
+        this.__fakeSelections.delete(fakes[0]);
+        if (this.j.isInDestruct) {
+            return;
         }
-        this.selectRange(range);
-        if (((_a = fakeLeft.parentNode) === null || _a === void 0 ? void 0 : _a.firstChild) !== ((_b = fakeLeft.parentNode) === null || _b === void 0 ? void 0 : _b.lastChild)) {
-            Dom.safeRemove(fakeLeft);
+        const ranges = [];
+        for (const pair of (_a = saved === null || saved === void 0 ? void 0 : saved.pairs) !== null && _a !== void 0 ? _a : [fakes]) {
+            const nodes = pair.filter(n => n.isConnected && Dom.isOrContains(this.area, n, true));
+            if (!nodes.length) {
+                continue;
+            }
+            const [left, right] = nodes;
+            const range = this.createRange();
+            range.setStartAfter(left);
+            if (right) {
+                range.setEndBefore(right);
+            }
+            else {
+                range.collapse(true);
+            }
+            for (const node of nodes) {
+                if (((_b = node.parentNode) === null || _b === void 0 ? void 0 : _b.firstChild) !== ((_c = node.parentNode) === null || _c === void 0 ? void 0 : _c.lastChild)) {
+                    Dom.safeRemove(node);
+                }
+            }
+            ranges.push(range);
         }
-        if (((_c = fakeRight === null || fakeRight === void 0 ? void 0 : fakeRight.parentNode) === null || _c === void 0 ? void 0 : _c.firstChild) !==
-            ((_d = fakeRight === null || fakeRight === void 0 ? void 0 : fakeRight.parentNode) === null || _d === void 0 ? void 0 : _d.lastChild)) {
-            Dom.safeRemove(fakeRight);
+        if (ranges.length) {
+            this.__selectRanges(ranges, saved === null || saved === void 0 ? void 0 : saved.backward);
         }
     }
     /**
@@ -314,9 +370,15 @@ export class Selection {
         if (!sel || !sel.rangeCount) {
             return [];
         }
+        const backward = this.__isBackward();
         const info = [], length = sel.rangeCount, ranges = [];
         for (let i = 0; i < length; i += 1) {
             ranges[i] = sel.getRangeAt(i);
+            if (!Dom.isOrContains(this.area, ranges[i].commonAncestorContainer)) {
+                return [];
+            }
+        }
+        for (let i = 0; i < length; i += 1) {
             if (ranges[i].collapsed) {
                 const start = this.marker(true, ranges[i]);
                 info[i] = {
@@ -328,6 +390,12 @@ export class Selection {
             else {
                 const start = this.marker(true, ranges[i]);
                 const end = this.marker(false, ranges[i]);
+                if (length > 1) {
+                    attr(start, 'data-selection-end', end.id);
+                }
+                if (backward) {
+                    attr(start, 'data-selection-backward', 'true');
+                }
                 info[i] = {
                     startId: start.id,
                     endId: end.id,
@@ -340,7 +408,7 @@ export class Selection {
         if (!silent) {
             sel.removeAllRanges();
             for (let i = length - 1; i >= 0; --i) {
-                const startElm = this.doc.getElementById(info[i].startId);
+                const startElm = this.area.querySelector('#' + info[i].startId);
                 if (!startElm) {
                     continue;
                 }
@@ -351,7 +419,7 @@ export class Selection {
                 else {
                     ranges[i].setStartBefore(startElm);
                     if (info[i].endId) {
-                        const endElm = this.doc.getElementById(info[i].endId);
+                        const endElm = this.area.querySelector('#' + info[i].endId);
                         if (endElm) {
                             ranges[i].setEndAfter(endElm);
                         }
@@ -433,6 +501,9 @@ export class Selection {
         const range = sel.getRangeAt(0);
         let node = range.startContainer;
         let rightMode = false;
+        if (!Dom.isOrContains(this.area, node)) {
+            return null;
+        }
         const child = (nd) => rightMode ? nd.lastChild : nd.firstChild;
         if (Dom.isTag(node, 'br') && sel.isCollapsed) {
             return node;
@@ -457,8 +528,11 @@ export class Selection {
      */
     insertNode(node, insertCursorAfter = true, fireChange = true) {
         this.errorNode(node);
-        const child = Dom.isFragment(node) ? node.lastChild : node;
         this.j.e.fire('safeHTML', node);
+        let child = Dom.isFragment(node) ? node.lastChild : node;
+        if (!child || this.j.isInDestruct) {
+            return;
+        }
         if (!this.isFocused() && this.j.isEditorMode()) {
             this.focus();
             this.restore();
@@ -469,6 +543,10 @@ export class Selection {
                 this.j.execCommand('Delete');
             }
             this.j.e.fire('beforeInsertNode', node);
+            child = Dom.isFragment(node) ? node.lastChild : node;
+            if (!child || this.j.isInDestruct) {
+                return;
+            }
             if (sel && sel.rangeCount) {
                 const range = sel.getRangeAt(0);
                 const { firstChild } = node;
@@ -614,14 +692,22 @@ export class Selection {
     /**
      * Call callback for all selection node
      */
-    // eslint-disable-next-line complexity
     eachSelection(callback) {
-        var _a;
-        const sel = this.sel;
-        if (!sel || !sel.rangeCount) {
-            return;
+        const seen = new Set();
+        for (const range of this.__ranges()) {
+            if (!Dom.isOrContains(this.area, range.commonAncestorContainer)) {
+                continue;
+            }
+            this.__eachRange(range, node => {
+                if (!seen.has(node)) {
+                    seen.add(node);
+                    callback(node);
+                }
+            });
         }
-        const range = sel.getRangeAt(0);
+    }
+    __eachRange(range, callback) {
+        var _a;
         let root = range.commonAncestorContainer;
         if (!Dom.isHTMLElement(root)) {
             root = root.parentElement;
@@ -706,12 +792,16 @@ export class Selection {
      */
     cursorInTheEdge(start, parentBlock, fake = null) {
         const end = !start, sel = this.sel, range = (sel === null || sel === void 0 ? void 0 : sel.rangeCount) ? sel.getRangeAt(0) : null;
-        fake !== null && fake !== void 0 ? fake : (fake = this.current(false));
-        if (!range || !fake || !Dom.isOrContains(parentBlock, fake, true)) {
+        if (!range) {
             return null;
         }
         const container = start ? range.startContainer : range.endContainer;
         const offset = start ? range.startOffset : range.endOffset;
+        fake !== null && fake !== void 0 ? fake : (fake = container);
+        if (!Dom.isOrContains(parentBlock, container) ||
+            !Dom.isOrContains(parentBlock, fake)) {
+            return null;
+        }
         const isSignificant = (elm) => Boolean(elm &&
             !Dom.isTag(elm, 'br') &&
             !Dom.isEmptyTextNode(elm) &&
@@ -725,14 +815,10 @@ export class Selection {
             }
         }
         else {
-            const children = toArray(container.childNodes);
-            if (end) {
-                if (children.slice(offset).some(isSignificant)) {
-                    return false;
-                }
-            }
-            else {
-                if (children.slice(0, offset).some(isSignificant)) {
+            const children = container.childNodes;
+            const limit = end ? children.length : offset;
+            for (let i = end ? offset : 0; i < limit; i += 1) {
+                if (isSignificant(children[i])) {
                     return false;
                 }
             }
@@ -745,7 +831,7 @@ export class Selection {
                 continue;
             }
             next = nextOne;
-            if (next && isSignificant(next)) {
+            if (isSignificant(next)) {
                 return false;
             }
         }
@@ -783,7 +869,7 @@ export class Selection {
     setCursorNearWith(node, inStart) {
         var _a, _b;
         this.errorNode(node);
-        if (!Dom.up(node, (elm) => elm === this.area || (elm && elm.parentNode === this.area), this.area)) {
+        if (!Dom.isOrContains(this.area, node, true)) {
             throw error('Node element must be in editor');
         }
         const range = this.createRange();
@@ -854,13 +940,20 @@ export class Selection {
      * Set range selection
      */
     selectRange(range, focus = true) {
+        return this.__selectRanges([range], false, focus);
+    }
+    __selectRanges(ranges, backward = false, focus = true) {
         const sel = this.sel;
         if (focus && !this.isFocused() && this.j.e.current !== 'focus') {
             this.focus();
         }
         if (sel) {
             sel.removeAllRanges();
-            sel.addRange(range);
+            ranges.forEach(range => sel.addRange(range));
+            if (backward && ranges.length === 1) {
+                const range = ranges[0];
+                sel.setBaseAndExtent(range.endContainer, range.endOffset, range.startContainer, range.startOffset);
+            }
         }
         /**
          * Fired after change selection
@@ -879,7 +972,7 @@ export class Selection {
             throw error('Node element must be in editor');
         }
         const range = this.createRange();
-        range[inward ? 'selectNodeContents' : 'selectNode'](node);
+        range[inward || node === this.area ? 'selectNodeContents' : 'selectNode'](node);
         return this.selectRange(range);
     }
     /**
@@ -894,10 +987,8 @@ export class Selection {
     get html() {
         const sel = this.sel;
         if (sel && sel.rangeCount > 0) {
-            const range = sel.getRangeAt(0);
-            const clonedSelection = range.cloneContents();
             const div = this.j.createInside.div();
-            Dom.append(div, clonedSelection);
+            this.__ranges().forEach(range => Dom.append(div, range.cloneContents()));
             return div.innerHTML;
         }
         return '';
@@ -911,8 +1002,7 @@ export class Selection {
      * `nativeExecCommand('fontsize', false, '7')` trick which relied on the
      * browser to split the selection into `<font size="7">` fragments.
      */
-    __wrapSelectionFragments() {
-        const range = this.range;
+    __wrapSelectionFragments(range) {
         this.__splitSelectionBoundaries(range);
         let root = range.commonAncestorContainer;
         if (Dom.isText(root)) {
@@ -929,30 +1019,22 @@ export class Selection {
      * fully (not partially) selected.
      */
     __splitSelectionBoundaries(range) {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
-        let { startContainer, endContainer } = range;
-        let { startOffset, endOffset } = range;
+        var _a, _b, _c, _d;
+        const { endContainer, endOffset } = range;
         if (Dom.isText(endContainer) &&
             endOffset > 0 &&
             endOffset < ((_b = (_a = endContainer.nodeValue) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0)) {
             endContainer.splitText(endOffset);
-            endOffset = (_d = (_c = endContainer.nodeValue) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : endOffset;
         }
+        const { startContainer, startOffset } = range;
         if (Dom.isText(startContainer) &&
             startOffset > 0 &&
-            startOffset < ((_f = (_e = startContainer.nodeValue) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0)) {
+            startOffset < ((_d = (_c = startContainer.nodeValue) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0)) {
             const middle = startContainer.splitText(startOffset);
-            // Selection located inside a single text node - the tail we just
-            // cut off is the actual selected fragment.
-            if (startContainer === endContainer) {
-                endContainer = middle;
-                endOffset = (_h = (_g = middle.nodeValue) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0;
-            }
-            startContainer = middle;
-            startOffset = 0;
+            // splitText updates the live range, including element end offsets.
+            // Only the start at the split point needs to move to the new node.
+            range.setStart(middle, 0);
         }
-        range.setStart(startContainer, startOffset);
-        range.setEnd(endContainer, endOffset);
         // Normalize text-edge boundaries (e.g. `(text, 0)` or `(text, length)`)
         // to the element level so that containment checks based on
         // `selectNode()` treat a fully selected text node as contained.
@@ -982,20 +1064,19 @@ export class Selection {
      * Collects the highest-level nodes that are completely inside the range,
      * descending into nodes that are only partially selected.
      */
-    __collectContainedNodes(root, range) {
+    __collectContainedNodes(root, range, scratch = this.createRange()) {
         const result = [];
         toArray(root.childNodes).forEach(child => {
-            if (this.__isFullyContained(range, child)) {
+            if (this.__isFullyContained(range, child, scratch)) {
                 result.push(child);
             }
             else if (child.childNodes.length && range.intersectsNode(child)) {
-                result.push(...this.__collectContainedNodes(child, range));
+                result.push(...this.__collectContainedNodes(child, range, scratch));
             }
         });
         return result;
     }
-    __isFullyContained(range, node) {
-        const nodeRange = this.createRange();
+    __isFullyContained(range, node, nodeRange) {
         nodeRange.selectNode(node);
         return (range.compareBoundaryPoints(Range.START_TO_START, nodeRange) <= 0 &&
             range.compareBoundaryPoints(Range.END_TO_END, nodeRange) >= 0);
@@ -1047,33 +1128,52 @@ export class Selection {
      * Wrap all selected fragments inside Tag or apply some callback
      */
     *wrapInTagGen(fakes) {
+        var _a;
+        if (((_a = this.sel) === null || _a === void 0 ? void 0 : _a.rangeCount) && !this.isInsideArea) {
+            return;
+        }
         if (this.isCollapsed()) {
             const font = this.jodit.createInside.element('font', INVISIBLE_SPACE);
             this.insertNode(font, false, false);
             if (fakes && fakes[0]) {
                 Dom.append(font, fakes[0]);
             }
-            yield font;
-            Dom.unwrap(font);
+            try {
+                yield font;
+            }
+            finally {
+                Dom.unwrap(font);
+            }
             return;
         }
-        const elms = this.__wrapSelectionFragments();
-        for (const font of elms) {
-            const { firstChild, lastChild } = font;
-            if (firstChild &&
-                firstChild === lastChild &&
-                isMarker(firstChild)) {
+        const elms = this.__ranges().flatMap(range => this.__wrapSelectionFragments(range));
+        try {
+            for (const font of elms) {
+                if (this.j.isInDestruct ||
+                    !Dom.isOrContains(this.area, font, true)) {
+                    continue;
+                }
+                const { firstChild, lastChild } = font;
+                if (firstChild &&
+                    firstChild === lastChild &&
+                    isMarker(firstChild)) {
+                    Dom.unwrap(font);
+                    continue;
+                }
+                if (firstChild && isMarker(firstChild)) {
+                    Dom.before(font, firstChild);
+                }
+                if (lastChild && isMarker(lastChild)) {
+                    Dom.after(font, lastChild);
+                }
+                yield font;
                 Dom.unwrap(font);
-                continue;
-            }
-            if (firstChild && isMarker(firstChild)) {
-                Dom.before(font, firstChild);
-            }
-            if (lastChild && isMarker(lastChild)) {
-                Dom.after(font, lastChild);
             }
-            yield font;
-            Dom.unwrap(font);
+        }
+        finally {
+            // A callback can throw or stop iteration before later wrappers
+            // have been visited. None of the temporary fonts should survive.
+            elms.forEach(font => Dom.unwrap(font));
         }
         return;
     }
@@ -1133,7 +1233,11 @@ export class Selection {
      * Split selection on two parts: left and right
      */
     splitSelection(currentBox, edge) {
-        if (!this.isCollapsed()) {
+        if (!this.isCollapsed() ||
+            !this.isInsideArea ||
+            !Dom.isOrContains(this.area, currentBox, true) ||
+            !Dom.isOrContains(currentBox, this.range.startContainer) ||
+            (edge && !Dom.isOrContains(currentBox, edge, true))) {
             return null;
         }
         const leftRange = this.createRange();
@@ -1220,13 +1324,18 @@ export class Selection {
      * becomes `<p>|<b>test</b>|</p>`)
      */
     expandSelection() {
-        if (this.isCollapsed()) {
+        if (this.isCollapsed() || !this.isInsideArea) {
             return this;
         }
-        const { range } = this;
+        const backward = this.__isBackward();
+        const ranges = this.__ranges().map(range => this.__expandRange(range));
+        this.__selectRanges(ranges, backward);
+        return this;
+    }
+    __expandRange(range) {
         const c = range.cloneRange();
         if (!Dom.isOrContains(this.j.editor, range.commonAncestorContainer, true)) {
-            return this;
+            return range;
         }
         const moveMaxEdgeFake = (start) => {
             const fake = this.j.createInside.fake();
@@ -1270,12 +1379,11 @@ export class Selection {
                 }
             }
         }
-        this.selectRange(c);
         Dom.safeRemove(leftFake, rightFake);
-        if (this.isCollapsed()) {
+        if (c.collapsed) {
             throw error('Selection is collapsed');
         }
-        return this;
+        return c;
     }
 }
 __decorate([