Refactor dom helpers, run some tests that were skipped in phantom

src/js/utils/key.js

@@ -6,7 +6,8 @@ export const DIRECTION = {
 
 export const MODIFIERS = {
   META: 1, // also called "command" on OS X
-  CTRL: 2
+  CTRL: 2,
+  SHIFT: 3
 };
 
 /**
@@ -49,12 +50,18 @@ const Key = class Key {
     return this.keyCode === Keycodes.ENTER;
   }
 
+  isShift() {
+    return this.hasModifier(MODIFIERS.SHIFT);
+  }
+
   hasModifier(modifier) {
     switch (modifier) {
       case MODIFIERS.META:
         return this.metaKey;
       case MODIFIERS.CTRL:
         return this.ctrlKey;
+      case MODIFIERS.SHIFT:
+        return this.shiftKey;
       default:
         throw new Error(`Cannot check for unknown modifier ${modifier}`);
     }

src/js/views/prompt.js

@@ -1,7 +1,7 @@
 import View from './view';
 import { restoreRange } from '../utils/selection-utils';
 import { createDiv, positionElementToRect } from '../utils/element-utils';
-import Keycodes from '../utils/keycodes';
+import Key from '../utils/key';
 
 var container = document.body;
 var hiliter = createDiv('ck-editor-hilite');
@@ -26,9 +26,10 @@ class Prompt extends View {
       e.stopPropagation();
     });
     this.addEventListener(this.element, 'keyup', (e) => {
+      const key = Key.fromEvent(e);
       const entry = this.element.value;
 
-      if (entry && this.range && !e.shiftKey && e.which === Keycodes.ENTER) {
+      if (entry && this.range && !key.isShift() && key.isEnter()) {
         restoreRange(this.range);
         this.doComplete(entry);
       }

tests/acceptance/editor-commands-test.js

@@ -226,7 +226,7 @@ Helpers.skipInPhantom('highlight text, click "link" button shows input for URL,
     const input = assert.hasElement('.ck-toolbar-prompt input');
     const url = 'http://google.com';
     $(input).val(url);
-    Helpers.dom.triggerKeyEvent(input[0], 'keyup');
+    Helpers.dom.triggerEnterKeyupEvent(input[0]);
 
     assert.toolbarHidden();
 

tests/acceptance/editor-sections-test.js

@@ -198,7 +198,7 @@ test('hitting enter in a section creates a new basic section', (assert) => {
 });
 
 // Phantom does not recognize toggling contenteditable off
-Helpers.skipInPhantom('deleting across 2 sections does nothing if editing is disabled', (assert) => {
+test('deleting across 2 sections does nothing if editing is disabled', (assert) => {
   editor = new Editor({mobiledoc: mobileDocWith2Sections});
   editor.render(editorElement);
   editor.disableEditing();

tests/acceptance/editor-selections-test.js

@@ -265,7 +265,7 @@ test('selecting text across sections and hitting enter deletes and moves cursor
   });
 });
 
-Helpers.skipInPhantom('keystroke of printable character while text is selected deletes the text', (assert) => {
+test('keystroke of printable character while text is selected deletes the text', (assert) => {
   const done = assert.async();
   editor = new Editor({mobiledoc: mobileDocWith2Sections});
   editor.render(editorElement);
@@ -284,11 +284,9 @@ Helpers.skipInPhantom('keystroke of printable character while text is selected d
     Helpers.dom.selectText('section', firstSectionTextNode,
                           'secon', secondSectionTextNode);
 
-    const key = 'A';
-    const charCodeA = 65;
-    Helpers.dom.triggerKeyEvent(document, 'keydown', charCodeA, key);
+    Helpers.dom.insertText(editor, 'X');
 
-    assert.ok($(`#editor h2:contains(first ${key}d section)`).length,
+    assert.ok($(`#editor h2:contains(first Xd section)`).length,
               'updates the section');
 
     done();

tests/helpers/dom.js

@@ -3,8 +3,7 @@ const TEXT_NODE = 3;
 import { clearSelection } from 'content-kit-editor/utils/selection-utils';
 import { walkDOMUntil } from 'content-kit-editor/utils/dom-utils';
 import KEY_CODES from 'content-kit-editor/utils/keycodes';
-import { MODIFIERS }  from 'content-kit-editor/utils/key';
-import isPhantom from './is-phantom';
+import { DIRECTION, MODIFIERS }  from 'content-kit-editor/utils/key';
 
 function selectRange(startNode, startOffset, endNode, endOffset) {
   clearSelection();
@@ -76,12 +75,11 @@ function createKeyEvent(eventType, keyCode) {
   return oEvent;
 }
 
-function triggerKeyEvent(node, eventType, keyCode=KEY_CODES.ENTER, character=null) {
+function triggerEnterKeyupEvent(node) {
+  const keyCode = KEY_CODES.ENTER;
+  const eventType = 'keyup';
   let oEvent = createKeyEvent(eventType, keyCode);
   node.dispatchEvent(oEvent);
-  if (character) {
-    document.execCommand('insertText', false, character);
-  }
 }
 
 function _buildDOM(tagName, attributes={}, children=[]) {
@@ -130,26 +128,22 @@ function getCursorPosition() {
   };
 }
 
-function triggerDelete(editor) {
+function triggerDelete(editor, direction=DIRECTION.BACKWARD) {
   if (!editor) { throw new Error('Must pass `editor` to `triggerDelete`'); }
-  if (isPhantom()) {
-    // simulate deletion for phantomjs
-    let event = { preventDefault() {} };
-    editor.handleDeletion(event);
-  } else {
-    triggerKeyEvent(editor.element, 'keydown', KEY_CODES.BACKSPACE);
-  }
+  const keyCode = direction === DIRECTION.BACKWARD ? KEY_CODES.BACKSPACE :
+                                                     KEY_CODES.DELETE;
+  const event = { keyCode, preventDefault() {} };
+  editor.triggerEvent(editor.element, 'keydown', event);
+}
+
+function triggerForwardDelete(editor) {
+  return triggerDelete(editor, DIRECTION.FORWARD);
 }
 
 function triggerEnter(editor) {
   if (!editor) { throw new Error('Must pass `editor` to `triggerEnter`'); }
-  if (isPhantom()) {
-    // simulate event when testing with phantom
-    let event = { preventDefault() {} };
-    editor.handleNewline(event);
-  } else {
-    triggerKeyEvent(editor.element, 'keydown', KEY_CODES.ENTER);
-  }
+  const event = { preventDefault() {}, keyCode: KEY_CODES.ENTER };
+  editor.triggerEvent(editor.element, 'keydown', event);
 }
 
 function insertText(editor, string) {
@@ -181,12 +175,13 @@ const DOMHelper = {
   selectText,
   clearSelection,
   triggerEvent,
-  triggerKeyEvent,
+  triggerEnterKeyupEvent,
   build,
   KEY_CODES,
   getCursorPosition,
   getSelectedText,
   triggerDelete,
+  triggerForwardDelete,
   triggerEnter,
   insertText,
   triggerKeyCommand