@livingdocs/editable.js 3.0.6 → 3.0.10

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@livingdocs/editable.js",
   "description": "Friendly contenteditable API",
-  "version": "3.0.6",
+  "version": "3.0.10",
   "dependencies": {
     "@babel/runtime": "^7.13.17",
     "bowser": "2.11.0",
@@ -74,8 +74,7 @@
     "test:all": "npm run test:karma -s -- --browsers Chrome,Firefox,Safari",
     "test:karma": "karma start",
     "test:watch": "npm run test:karma -s -- --single-run false",
-    "lint": "eslint --ignore-path .gitignore .",
-    "postversion": "/release/node_modules/.bin/set-ci"
+    "lint": "eslint --ignore-path .gitignore ."
   },
   "release": {
     "extends": "@livingdocs/semantic-release-presets/npm-github-verify"
@@ -84,11 +83,11 @@
     "isCi": true,
     "name": "Drone",
     "service": "drone",
-    "commit": "371fd4f350c9d109eb57b0e68d2308702137f6c7",
-    "build": "376",
+    "commit": "ba2101da4792e70d5ee82e2d4fb0fb2e3879002a",
+    "build": "412",
     "branch": "master",
     "isPr": false,
     "slug": "livingdocsIO/editable.js",
-    "date": "2021-10-26T16:02:22.840Z"
+    "date": "2021-12-29T08:41:38.566Z"
   }
 }

package/src/content.js

@@ -29,6 +29,12 @@ export function tidyHtml (element) {
 export function normalizeTags (element) {
   const fragment = document.createDocumentFragment()
 
+  // Remove line breaks at the beginning of a content block
+  removeWhitespaces(element, 'firstChild')
+
+  // Remove line breaks at the end of a content block
+  removeWhitespaces(element, 'lastChild')
+
   for (const node of element.childNodes) {
     // skip empty tags, so they'll get removed
     if (node.nodeName !== 'BR' && !node.textContent) continue
@@ -136,7 +142,7 @@ export function cloneRangeContents (range) {
   return fragment
 }
 
-function removeWhitespaces (node, type) {
+function removeWhitespaces (node, type, firstCall = true) {
   let elem
   while ((elem = node[type])) {
     if (elem.nodeType === nodeType.textNode) {
@@ -145,10 +151,17 @@ function removeWhitespaces (node, type) {
     } else if (elem.nodeName === 'BR') {
       elem.remove()
     } else {
-      if (elem[type]) removeWhitespaces(elem, type)
+      if (elem[type]) removeWhitespaces(elem, type, false)
       break
     }
   }
+
+  if (!firstCall) return
+  elem = node[type]
+  if (elem?.nodeType !== nodeType.textNode) return
+  // Remove whitespaces at the end or start of a block with content
+  //   e.g. '  Hello world' > 'Hello World'
+  elem.textContent = elem.textContent.replace(type.startsWith('last') ? /\s+$/ : /^\s+/, '')
 }
 
 // Remove elements that were inserted for internal or user interface purposes

package/src/highlight-support.js

@@ -117,7 +117,8 @@ const highlightSupport = {
     return {
       start: textRange.start,
       end: textRange.end,
-      text: range.text()
+      text: range.text(),
+      nativeRange: range.nativeRange
     }
   },
 

package/src/plugins/highlighting/text-highlighting.js

@@ -9,8 +9,8 @@ export default class WordHighlighting {
 
   isElement (obj) {
     try {
-      // Using W3 DOM2 (works for FF, Opera and Chrome)
-      return obj instanceof HTMLElement
+      if (!obj) return false
+      return obj instanceof obj.ownerDocument?.defaultView.HTMLElement
     } catch (e) {
       // Browsers not supporting W3 DOM2 don't have HTMLElement and
       // an exception is thrown and we end up here. Testing some

package/src/range-save-restore.js

@@ -11,17 +11,35 @@ let boundaryMarkerId = 0
 // (U+FEFF) zero width no-break space
 const markerTextChar = '\ufeff'
 
+function isChildOf (parent, possibleChild) {
+  for (let i = 0; i < parent.children.length; i++) {
+    if (parent.children[i] === possibleChild) return true
+  }
+  return false
+}
+
+function startContainerIsChild (range) {
+  const parent = range.endContainer.parentElement
+  const possibleChild = range.startContainer.parentElement
+  return isChildOf(parent, possibleChild)
+}
+
+function endContainerIsChild (range) {
+  const parent = range.startContainer.parentElement
+  const possibleChild = range.endContainer.parentElement
+  return isChildOf(parent, possibleChild)
+}
+
 export function insertRangeBoundaryMarker (range, atStart) {
   const container = range.commonAncestorContainer
+  const directlyBeforeFormatTag = startContainerIsChild(range) && atStart
+  const directlyAfterFormatTag = endContainerIsChild(range) && !atStart
+
   // If ownerDocument is null the commonAncestorContainer is window.document
   if (container.ownerDocument === null || container.ownerDocument === undefined) {
     error('Cannot save range: range is emtpy')
   }
 
-  // Clone the Range and collapse to the appropriate boundary point
-  const boundaryRange = range.cloneRange()
-  boundaryRange.collapse(atStart)
-
   // Create the marker element containing a single
   // invisible character using DOM methods and insert it
   const doc = container.ownerDocument.defaultView.document
@@ -32,7 +50,21 @@ export function insertRangeBoundaryMarker (range, atStart) {
   markerEl.style.display = 'none'
   markerEl.appendChild(doc.createTextNode(markerTextChar))
 
-  boundaryRange.insertNode(markerEl)
+  // if another tag is trailing exactly at the start or end, prepend
+  // or append the marker element directly on the parent in order to prevent breaking HTML markup.
+  if (directlyBeforeFormatTag) {
+    range.endContainer.parentElement.insertBefore(markerEl, range.startContainer.parentElement)
+  } else if (directlyAfterFormatTag) {
+    // emulating insertAfter with nextSibling
+    range.startContainer.parentElement.insertBefore(markerEl,
+      range.endContainer.parentElement.nextSibling)
+  } else {
+    // Clone the Range and collapse to the appropriate boundary point
+    const boundaryRange = range.cloneRange()
+    boundaryRange.collapse(atStart)
+    boundaryRange.insertNode(markerEl)
+  }
+
   return markerEl
 }