Fix quill for creately

.gitignore

@@ -1,5 +1,4 @@
 .*
-/dist
 /node_modules
 /selenium
 /docs/_site

_develop/webpack.config.js

@@ -43,13 +43,13 @@ const jsRules = {
             {
               targets: {
                 browsers: [
-                  'last 2 Chrome major versions',
                   'last 2 Firefox major versions',
                   'last 2 Safari major versions',
                   'last 2 Edge major versions',
                   'last 2 iOS major versions',
                   'last 2 ChromeAndroid major versions',
                 ],
+                chrome: "58",
               },
             },
           ],

blots/block.js

@@ -5,12 +5,25 @@ import {
   EmbedBlot,
   LeafBlot,
   Scope,
-} from 'parchment';
+} from '@creately/parchment';
 import Break from './break';
 import Inline from './inline';
 import TextBlot from './text';
+import Cursor from './cursor';
 
 const NEWLINE_LENGTH = 1;
+const TEXT_FORMAT_NODES = [
+  'SPAN',
+  'STRONG',
+  'B',
+  'EM',
+  'I',
+  'SUB',
+  'SUP',
+  'S',
+  'STRIKE',
+  'U',
+];
 
 class Block extends BlockBlot {
   constructor(scroll, domNode) {
@@ -95,9 +108,109 @@ class Block extends BlockBlot {
 
   optimize(context) {
     super.optimize(context);
+
+    /**
+     * FIXME
+     * This is a tempory change to fix following 
+     * 1. Can't add multuple new lines without losing the format.
+     * 2. When setting content, the new lines are always formatless.
+     * 3. Deleting a line should not result in clearing it's formats. => Fixed in parchment as permenent
+     * 4. Cursor height / line height should be consistent unless user change formatting.
+     * 
+     * In super method default blot ("BR") is appended if this blot is empty.
+     * Since this "Block" class is extended by some other classes
+     * this.domNode.nodeName === "P" is checked here but 
+     * a sperate child class should be added for "P" block and do this change
+     */
+    try {
+      if(this.domNode.innerText === '' && this.children.length !== 0){
+        const leafBlot = getDescendentsOfLeafBlot(this)[0];
+        const lastElementBlot = leafBlot.parent;
+        if (leafBlot instanceof TextBlot) {
+          leafBlot.remove();
+          const child = this.scroll.create(Break.blotName);
+          lastElementBlot.appendChild(child);
+        }
+      }
+
+      if( this.isFormatlessEmptyP( this.domNode )) {
+        let formatNode;
+        if ( this.prev && !this.isFormatlessEmptyP( this.prev.domNode )) {
+          formatNode = this.prev.children.tail.domNode.cloneNode(true);
+        } else if ( this.next && !this.isFormatlessEmptyP( this.next.domNode ) ) {
+          formatNode = this.next.children.head.domNode.cloneNode(true);
+        }
+        if( formatNode && formatNode.nodeType === Node.ELEMENT_NODE ) {
+          this.children.head.domNode.remove();
+          this.removeChild( this.children.head );
+          this.retainFormats(formatNode);
+          const newBr = document.createElement('BR');
+          const dn = this.getDeepestNode( formatNode );
+          dn.appendChild( newBr );
+          const formatBlot = this.scroll.create(formatNode);
+          this.appendChild( formatBlot );
+        }
+      }
+      if( !this.isFormatlessEmptyP( this.domNode ) && this.prev && this.isFormatlessEmptyP( this.prev.domNode )) {
+        const formatNode = this.children.head.domNode.cloneNode(true);
+        this.applyToAllEmptyPrevs( this.prev, formatNode );
+      }
+
+    } catch (error) {
+    }
     this.cache = {};
   }
 
+  isFormatlessEmptyP( node ) {
+    return node.nodeName === "P" && node.innerHTML === `<br>`;
+  }
+
+  applyToAllEmptyPrevs( prev, formatNode ) {
+    if ( prev && this.isFormatlessEmptyP( prev.domNode )) {
+      if( formatNode.nodeType === Node.ELEMENT_NODE ) {
+        prev.children.head.domNode.remove();
+        prev.removeChild( prev.children.head );
+        this.retainFormats(formatNode);
+        const newBr = document.createElement('BR');
+        const dn = prev.getDeepestNode( formatNode );
+        dn.appendChild( newBr );
+        const formatBlot = prev.scroll.create(formatNode);
+        prev.appendChild( formatBlot );
+      }
+      this.applyToAllEmptyPrevs( prev.prev, formatNode );
+    }
+
+  }
+
+  /**
+   * Retains the style nodes specified in TEXT_FORMAT_NODES
+   * and removes all other nodes for the given element
+   */
+  retainFormats(element) {
+    const nodes = element.childNodes;
+    for (let i = 0; i < nodes.length; i += 1) {
+      const node = nodes[i];
+      const isCursorSpan = node.nodeName === "SPAN" && node.classList.contains( Cursor.className );
+      if (
+        isCursorSpan ||
+        node.nodeType === Node.TEXT_NODE ||
+        !TEXT_FORMAT_NODES.includes(node.nodeName)
+      ) {
+        node.parentNode.removeChild(node);
+        i -= 1;
+      } else if (node.nodeType === Node.ELEMENT_NODE) {
+        this.retainFormats(node);
+      }
+    }
+  }
+
+  getDeepestNode(node) {
+    if ( node.firstChild ) {
+      return this.getDeepestNode(node.firstChild);
+    }
+    return node;
+  }
+
   path(index) {
     return super.path(index, true);
   }
@@ -165,8 +278,7 @@ BlockEmbed.scope = Scope.BLOCK_BLOT;
 // It is important for cursor behavior BlockEmbeds use tags that are block level elements
 
 function blockDelta(blot, filter = true) {
-  return blot
-    .descendants(LeafBlot)
+  return getDescendentsOfLeafBlot(blot)
     .reduce((delta, leaf) => {
       if (leaf.length() === 0) {
         return delta;
@@ -198,4 +310,11 @@ function bubbleFormats(blot, formats = {}, filter = true) {
   return bubbleFormats(blot.parent, formats, filter);
 }
 
+function getDescendentsOfLeafBlot (blot) {
+  if(!blot){
+    return;
+  }
+  return blot.descendants(LeafBlot);
+}
+
 export { blockDelta, bubbleFormats, BlockEmbed, Block as default };

blots/break.js

@@ -1,4 +1,4 @@
-import { EmbedBlot } from 'parchment';
+import { EmbedBlot } from '@creately/parchment';
 
 class Break extends EmbedBlot {
   static value() {

blots/container.js

@@ -1,4 +1,4 @@
-import { ContainerBlot } from 'parchment';
+import { ContainerBlot } from '@creately/parchment';
 
 class Container extends ContainerBlot {}
 

blots/cursor.js

@@ -1,4 +1,4 @@
-import { EmbedBlot, Scope } from 'parchment';
+import { EmbedBlot, Scope } from '@creately/parchment';
 import TextBlot from './text';
 
 class Cursor extends EmbedBlot {

blots/embed.js

@@ -1,4 +1,4 @@
-import { EmbedBlot } from 'parchment';
+import { EmbedBlot } from '@creately/parchment';
 import TextBlot from './text';
 
 const GUARD_TEXT = '\uFEFF';

blots/inline.js

@@ -1,4 +1,4 @@
-import { EmbedBlot, InlineBlot, Scope } from 'parchment';
+import { EmbedBlot, InlineBlot, Scope } from '@creately/parchment';
 import Break from './break';
 import Text from './text';
 

blots/scroll.js

@@ -1,4 +1,4 @@
-import { Scope, ScrollBlot, ContainerBlot } from 'parchment';
+import { Scope, ScrollBlot, ContainerBlot } from '@creately/parchment';
 import Emitter from '../core/emitter';
 import Block, { BlockEmbed } from './block';
 import Break from './break';

blots/text.js

@@ -1,4 +1,4 @@
-import { TextBlot } from 'parchment';
+import { TextBlot } from '@creately/parchment';
 
 class Text extends TextBlot {}
 

core/editor.js

@@ -2,7 +2,7 @@ import cloneDeep from 'lodash.clonedeep';
 import isEqual from 'lodash.isequal';
 import merge from 'lodash.merge';
 import Delta, { AttributeMap } from 'quill-delta';
-import { LeafBlot } from 'parchment';
+import { LeafBlot } from '@creately/parchment';
 import { Range } from './selection';
 import CursorBlot from '../blots/cursor';
 import Block, { BlockEmbed, bubbleFormats } from '../blots/block';

core/quill.js

@@ -1,7 +1,7 @@
 import Delta from 'quill-delta';
 import cloneDeep from 'lodash.clonedeep';
 import merge from 'lodash.merge';
-import * as Parchment from 'parchment';
+import * as Parchment from '@creately/parchment';
 import Editor from './editor';
 import Emitter from './emitter';
 import Module from './module';
@@ -404,6 +404,17 @@ class Quill {
     if (index == null) {
       this.selection.setRange(null, length || Quill.sources.API);
     } else {
+      if (index instanceof Range) {
+        const lines = this.scroll.lines();
+        let currIndex = 0;
+        for ( let i = 0; i < lines.length; i ++ ) {
+          if ( currIndex === index.index && lines[i].length() === index.length ) {
+            index.length = index.length - 1;
+            break;
+          }
+          currIndex = currIndex + lines[i].length();
+        }
+      }
       [index, length, , source] = overload(index, length, source);
       this.selection.setRange(new Range(Math.max(0, index), length), source);
       if (source !== Emitter.sources.SILENT) {

core/selection.js

@@ -1,4 +1,4 @@
-import { LeafBlot, Scope } from 'parchment';
+import { LeafBlot, Scope } from '@creately/parchment';
 import cloneDeep from 'lodash.clonedeep';
 import isEqual from 'lodash.isequal';
 import Emitter from './emitter';