begin testing rewrite

blots/inline.js

@@ -19,7 +19,7 @@ Inline.compare = function(self, other) {
 // Lower index means deeper in the DOM tree, since not found (-1) is for embeds
 Inline.order = [
   'cursor', 'inline',   // Must be lower
-  'code', 'underline', 'strike', 'bold', 'italic', 'script',
+  'code', 'underline', 'strike', 'italic', 'bold', 'script',
   'link'                // Must be higher
 ];
 

blots/scroll.js

@@ -70,26 +70,12 @@ class Scroll extends Parchment.Scroll {
 
   optimize(mutations) {
     super.optimize(mutations);
-    this.emitter.emit(Emitter.events.SCROLL_OPTIMIZE);
+    this.emitter.emit(Emitter.events.SCROLL_CHANGE);
   }
 
   path(index) {
     return super.path(index).slice(1);  // Exclude self
   }
-
-  update(mutations) {
-    let source = Emitter.sources.USER;
-    if (typeof mutations === 'string') {
-      source = mutations;
-    }
-    if (!Array.isArray(mutations)) {
-      mutations = this.observer.takeRecords();
-    }
-    super.update(mutations);
-    if (mutations.length > 0) {
-      this.emitter.emit(Emitter.events.SCROLL_UPDATE, source);
-    }
-  }
 }
 Scroll.blotName = 'scroll';
 Scroll.className = 'ql-editor';

core/editor.js

@@ -11,7 +11,7 @@ class Editor {
   constructor(scroll, emitter) {
     this.scroll = scroll;
     this.emitter = emitter;
-    this.emitter.on(Emitter.events.SCROLL_UPDATE, this.update, this);
+    this.emitter.on(Emitter.events.SCROLL_CHANGE, this.update.bind(this, Emitter.sources.USER));
     this.delta = this.getDelta();
     this.enable();
   }

core/emitter.js

@@ -18,8 +18,7 @@ class Emitter extends EventEmitter {
 
 Emitter.events = {
   READY             : 'ready',
-  SCROLL_OPTIMIZE   : 'scroll-optimize',
-  SCROLL_UPDATE     : 'scroll-update',
+  SCROLL_CHANGE     : 'scroll-change',
   SELECTION_CHANGE  : 'selection-change',
   TEXT_CHANGE       : 'text-change'
 };

core/quill.js

@@ -228,7 +228,7 @@ class Quill {
   }
 
   update(source = Emitter.sources.USER) {
-    this.scroll.update(source);       // Will update selection before selection.update() does if text changes
+    this.scroll.update();       // Will update selection before selection.update() does if text changes
     this.selection.update(source);
   }
 

modules/code-highlighter.js

@@ -25,7 +25,7 @@ class CodeHighlighter extends Module {
   constructor(quill, options) {
     super(quill, options);
     let timer = null;
-    this.quill.on(Emitter.events.SCROLL_OPTIMIZE, () => {
+    this.quill.on(Emitter.events.SCROLL_CHANGE, () => {
       if (timer != null) return;
       timer = setTimeout(() => {
         this.highlight();

modules/toolbar.js

@@ -29,7 +29,7 @@ class Toolbar extends Module {
       this.attach(input);
     });
     this.quill.on(Emitter.events.SELECTION_CHANGE, this.update, this)
-              .on(Emitter.events.SCROLL_OPTIMIZE, this.update, this);
+              .on(Emitter.events.SCROLL_CHANGE, this.update, this);
   }
 
   attach(input) {

test/helpers/unit.js

@@ -1,77 +1,93 @@
-import Editor from '../../core/editor';
-import Emitter from '../../core/emitter';
-import Selection from '../../core/selection';
-import Scroll from '../../blots/scroll';
-import Quill from '../../core/quill';
+import Delta from 'rich-text/lib/delta';
+import Editor from 'quill/editor';
+import Emitter from 'quill/emitter';
+import Selection from 'quill/selection';
+import Scroll from 'quill/blots/scroll';
+import Quill from 'quill/quill';
 import equal from 'deep-equal';
 
 
 let div = document.createElement('div');
 div.id = 'test-container';
 document.body.appendChild(div);
 
+let initialStates = {
+  'empty':  {
+    delta: new Delta().insert('\n'),
+    html: '<p><br></p>'
+  },
+  'single line': {
+    delta: new Delta().insert('Hello World!\n'),
+    html: '<p>Hello World!</p>'
+  },
+  'multiple lines': {
+    delta: new Delta().insert('Hello\n\nWorld!\n'),
+    html: '<p>Hello</p><p><br></p><p>World!</p>'
+  },
+  'basic formats': {
+    delta: new Delta().insert('Welcome').insert('\n', { header: 1 })
+                      .insert('Hello\n')
+                      .insert('World')
+                      .insert('!', { bold: true })
+                      .insert('\n'),
+    html: [
+      '<h1 id="welcome">Welcome</h1>',
+      '<p>Hello</p>',
+      '<p>World<strong>!</strong></p>'
+    ].join('')
+  }
+};
+
 
 beforeEach(function() {
   jasmine.addMatchers({
     toEqualHTML: function() {
-      return {
-        compare: function(actual, expected, ignoreClassId) {
-          let [div1, div2] = [actual, expected].map(function(html) {
-            if (html instanceof HTMLElement) {
-              html = html.innerHTML;
-            }
-            let div = document.createElement('div');
-            div.innerHTML = html.replace(/\n\s*/g, '');
-            return div;
-          });
-          let ignoredAttributes = ['width', 'height'];
-          if (ignoreClassId) {
-            ignoredAttributes = ignoredAttributes.concat(['class', 'id']);
-          }
-          let message = compareNodes(div1, div2, ignoredAttributes)
-          if (message != null) {
-            console.error(div1.innerHTML);
-            console.error(div2.innerHTML);
-            return { pass: false, message: message };
-          } else {
-            return { pass: true, message: 'HTMLs equal' };
-          }
-        }
-      };
+      return { compare: compareHTML }
     },
-
     toBeApproximately: function() {
-      return {
-        compare: function(actual, expected, tolerance) {
-          let pass = Math.abs(actual - expected) <= tolerance;
-          return {
-            pass: pass,
-            message: `${actual} is ${(pass ? '' : 'not')} approximately ${expected}`
-          };
-        }
-      };
+      return { compare: compareApproximately }
     }
   });
 
   div.innerHTML = '<div></div>';
   this.container = div.firstChild;
-  // Defining in a beforeAll does not work, seems this is cloned or something
-  this.initialize = (klass, html, container = this.container) => {
-    container.innerHTML = html.replace(/\n\s*/g, '');
-    if (klass === HTMLElement) return container;
-    if (klass === Quill) return new Quill(container);
-    let emitter = new Emitter();
-    let scroll = new Scroll(container, { emitter: emitter });
-    if (klass === Scroll) return scroll;
-    let editor = new Editor(scroll, emitter);
-    if (klass === Editor) return editor;
-    let selection = new Selection(scroll, emitter);
-    if (klass === Selection) return selection;
-    if (klass[0] === Editor && klass[1] === Selection) return [editor, selection];
-  }
+  this.initialize = initialize.bind(this);
+
+  this.initialStates = initialStates;
 });
 
 
+function compareApproximately(actual, expected, tolerance) {
+  let pass = Math.abs(actual - expected) <= tolerance;
+  return {
+    pass: pass,
+    message: `${actual} is ${(pass ? '' : 'not')} approximately ${expected}`
+  };
+}
+
+function compareHTML(actual, expected, ignoreClassId) {
+  let [div1, div2] = [actual, expected].map(function(html) {
+    if (html instanceof HTMLElement) {
+      html = html.innerHTML;
+    }
+    let div = document.createElement('div');
+    div.innerHTML = html.replace(/\n\s*/g, '');
+    return div;
+  });
+  let ignoredAttributes = ['width', 'height'];
+  if (ignoreClassId) {
+    ignoredAttributes = ignoredAttributes.concat(['class', 'id']);
+  }
+  let message = compareNodes(div1, div2, ignoredAttributes)
+  if (message != null) {
+    console.error(div1.innerHTML);
+    console.error(div2.innerHTML);
+    return { pass: false, message: message };
+  } else {
+    return { pass: true, message: 'HTMLs equal' };
+  }
+}
+
 function compareNodes(node1, node2, ignoredAttributes = []) {
   let attr1, attr2, message, ref;
   if (node1.nodeType !== node2.nodeType) {
@@ -108,3 +124,21 @@ function compareNodes(node1, node2, ignoredAttributes = []) {
   }
   return null;
 }
+
+function initialize(klass, html, container = this.container) {
+  if (typeof html === 'object') {
+    container.innerHTML = html.html;
+  } else {
+    container.innerHTML = html.replace(/\n\s*/g, '');
+  }
+  if (klass === HTMLElement) return container;
+  if (klass === Quill) return new Quill(container);
+  let emitter = new Emitter();
+  let scroll = new Scroll(container, { emitter: emitter });
+  if (klass === Scroll) return scroll;
+  let editor = new Editor(scroll, emitter);
+  if (klass === Editor) return editor;
+  let selection = new Selection(scroll, emitter);
+  if (klass === Selection) return selection;
+  if (klass[0] === Editor && klass[1] === Selection) return [editor, selection];
+}