dom.ts (5889B)
1 export type DOMNode = InstanceType<typeof window.Node> 2 export type DOMSelection = InstanceType<typeof window.Selection> 3 export type DOMSelectionRange = { 4 focusNode: DOMNode | null, focusOffset: number, 5 anchorNode: DOMNode | null, anchorOffset: number 6 } 7 8 export const domIndex = function(node: Node) { 9 for (var index = 0;; index++) { 10 node = node.previousSibling! 11 if (!node) return index 12 } 13 } 14 15 export const parentNode = function(node: Node): Node | null { 16 let parent = (node as HTMLSlotElement).assignedSlot || node.parentNode 17 return parent && parent.nodeType == 11 ? (parent as ShadowRoot).host : parent 18 } 19 20 let reusedRange: Range | null = null 21 22 // Note that this will always return the same range, because DOM range 23 // objects are every expensive, and keep slowing down subsequent DOM 24 // updates, for some reason. 25 export const textRange = function(node: Text, from?: number, to?: number) { 26 let range = reusedRange || (reusedRange = document.createRange()) 27 range.setEnd(node, to == null ? node.nodeValue!.length : to) 28 range.setStart(node, from || 0) 29 return range 30 } 31 32 export const clearReusedRange = function() { 33 reusedRange = null 34 } 35 36 // Scans forward and backward through DOM positions equivalent to the 37 // given one to see if the two are in the same place (i.e. after a 38 // text node vs at the end of that text node) 39 export const isEquivalentPosition = function(node: Node, off: number, targetNode: Node, targetOff: number) { 40 return targetNode && (scanFor(node, off, targetNode, targetOff, -1) || 41 scanFor(node, off, targetNode, targetOff, 1)) 42 } 43 44 const atomElements = /^(img|br|input|textarea|hr)$/i 45 46 function scanFor(node: Node, off: number, targetNode: Node, targetOff: number, dir: number) { 47 for (;;) { 48 if (node == targetNode && off == targetOff) return true 49 if (off == (dir < 0 ? 0 : nodeSize(node))) { 50 let parent = node.parentNode 51 if (!parent || parent.nodeType != 1 || hasBlockDesc(node) || atomElements.test(node.nodeName) || 52 (node as HTMLElement).contentEditable == "false") 53 return false 54 off = domIndex(node) + (dir < 0 ? 0 : 1) 55 node = parent 56 } else if (node.nodeType == 1) { 57 let child = node.childNodes[off + (dir < 0 ? -1 : 0)] 58 if (child.nodeType == 1 && (child as HTMLElement).contentEditable == "false") { 59 if (child.pmViewDesc?.ignoreForSelection) off += dir 60 else return false 61 } else { 62 node = child 63 off = dir < 0 ? nodeSize(node) : 0 64 } 65 } else { 66 return false 67 } 68 } 69 } 70 71 export function nodeSize(node: Node) { 72 return node.nodeType == 3 ? node.nodeValue!.length : node.childNodes.length 73 } 74 75 export function textNodeBefore(node: Node, offset: number) { 76 for (;;) { 77 if (node.nodeType == 3 && offset) return node as Text 78 if (node.nodeType == 1 && offset > 0) { 79 if ((node as HTMLElement).contentEditable == "false") return null 80 node = node.childNodes[offset - 1] 81 offset = nodeSize(node) 82 } else if (node.parentNode && !hasBlockDesc(node)) { 83 offset = domIndex(node) 84 node = node.parentNode 85 } else { 86 return null 87 } 88 } 89 } 90 91 export function textNodeAfter(node: Node, offset: number) { 92 for (;;) { 93 if (node.nodeType == 3 && offset < node.nodeValue!.length) return node as Text 94 if (node.nodeType == 1 && offset < node.childNodes.length) { 95 if ((node as HTMLElement).contentEditable == "false") return null 96 node = node.childNodes[offset] 97 offset = 0 98 } else if (node.parentNode && !hasBlockDesc(node)) { 99 offset = domIndex(node) + 1 100 node = node.parentNode 101 } else { 102 return null 103 } 104 } 105 } 106 107 export function isOnEdge(node: Node, offset: number, parent: Node) { 108 for (let atStart = offset == 0, atEnd = offset == nodeSize(node); atStart || atEnd;) { 109 if (node == parent) return true 110 let index = domIndex(node) 111 node = node.parentNode! 112 if (!node) return false 113 atStart = atStart && index == 0 114 atEnd = atEnd && index == nodeSize(node) 115 } 116 } 117 118 export function hasBlockDesc(dom: Node) { 119 let desc 120 for (let cur: Node | null = dom; cur; cur = cur.parentNode) if (desc = cur.pmViewDesc) break 121 return desc && desc.node && desc.node.isBlock && (desc.dom == dom || desc.contentDOM == dom) 122 } 123 124 // Work around Chrome issue https://bugs.chromium.org/p/chromium/issues/detail?id=447523 125 // (isCollapsed inappropriately returns true in shadow dom) 126 export const selectionCollapsed = function(domSel: DOMSelectionRange) { 127 return domSel.focusNode && isEquivalentPosition(domSel.focusNode, domSel.focusOffset, 128 domSel.anchorNode!, domSel.anchorOffset) 129 } 130 131 export function keyEvent(keyCode: number, key: string) { 132 let event = document.createEvent("Event") as KeyboardEvent 133 event.initEvent("keydown", true, true) 134 ;(event as any).keyCode = keyCode 135 ;(event as any).key = (event as any).code = key 136 return event 137 } 138 139 export function deepActiveElement(doc: Document) { 140 let elt = doc.activeElement 141 while (elt && elt.shadowRoot) elt = elt.shadowRoot.activeElement 142 return elt 143 } 144 145 export function caretFromPoint(doc: Document, x: number, y: number): {node: Node, offset: number} | undefined { 146 if ((doc as any).caretPositionFromPoint) { 147 try { // Firefox throws for this call in hard-to-predict circumstances (#994) 148 let pos = (doc as any).caretPositionFromPoint(x, y) 149 // Clip the offset, because Chrome will return a text offset 150 // into <input> nodes, which can't be treated as a regular DOM 151 // offset 152 if (pos) return {node: pos.offsetNode, offset: Math.min(nodeSize(pos.offsetNode), pos.offset)} 153 } catch (_) {} 154 } 155 if (doc.caretRangeFromPoint) { 156 let range = doc.caretRangeFromPoint(x, y) 157 if (range) return {node: range.startContainer, offset: Math.min(nodeSize(range.startContainer), range.startOffset)} 158 } 159 }