Merge pull request #190 from bliker/createLink-bugs

Tests for createlink bugs

BROWSERINCONSISTENCIES.md

@@ -54,6 +54,9 @@ Playground: http://jsbin.com/iwEWUXo/2/edit?js,console,output
   - Chrome converts BRs to Ps: http://jsbin.com/zeti/2/edit?js,output
   - Firefox does not perform transformation upon Ps containing BRs:
     http://jsbin.com/yiyaq/1/edit?js,output
+* "`createLink`"
+  - Firefox does not create A if selection is empty:
+    http://jsbin.com/tutufi/2/edit?js,output
 * "`delete`":
   - Given a selection across multiple P elements, Firefox will place the caret
     outside of any P element: http://jsbin.com/xopivama/3/edit?js,output

src/plugins/core/patches.js

@@ -4,13 +4,15 @@ define([
   './patches/commands/insert-html',
   './patches/commands/insert-list',
   './patches/commands/outdent',
+  './patches/commands/create-link',
   './patches/events'
 ], function (
   boldCommand,
   indentCommand,
   insertHTMLCommand,
   insertListCommands,
   outdentCommand,
+  createLinkCommand,
   events
 ) {
 
@@ -28,7 +30,8 @@ define([
       indent: indentCommand,
       insertHTML: insertHTMLCommand,
       insertList: insertListCommands,
-      outdent: outdentCommand
+      outdent: outdentCommand,
+      createLink: createLinkCommand,
     },
     events: events
   };

src/plugins/core/patches/commands/create-link.js

@@ -0,0 +1,38 @@
+define(function () {
+
+  'use strict';
+
+  return function () {
+    return function (scribe) {
+      var createLinkCommand = new scribe.api.CommandPatch('createLink');
+      scribe.commandPatches.createLink = createLinkCommand;
+
+      createLinkCommand.execute = function (value) {
+        var selection = new scribe.api.Selection();
+
+        /**
+         * Firefox does not create a link when selection is collapsed
+         * so we create is manually. http://jsbin.com/tutufi/2/edit?js,output
+         */
+        if (selection.selection.isCollapsed) {
+          var aElement = document.createElement('a');
+          aElement.setAttribute('href', value);
+          aElement.textContent = value;
+
+          selection.range.insertNode(aElement);
+
+          // Select the created link
+          var newRange = document.createRange();
+          newRange.setStartBefore(aElement);
+          newRange.setEndAfter(aElement);
+
+          selection.selection.removeAllRanges();
+          selection.selection.addRange(newRange);
+        } else {
+          scribe.api.CommandPatch.prototype.execute.call(this, value);
+        }
+      };
+    };
+  };
+
+});

src/scribe.js

@@ -95,6 +95,7 @@ define([
     this.use(patches.commands.insertHTML());
     this.use(patches.commands.insertList());
     this.use(patches.commands.outdent());
+    this.use(patches.commands.createLink());
     this.use(patches.events());
 
     this.use(commands.indent());

test/commands.spec.js

@@ -400,4 +400,35 @@ describe('commands', function () {
       });
     });
   });
+
+  describe('createLink', function  () {
+    given('an empty editor', function () {
+      when('the command is executed', function () {
+        beforeEach(function () {
+          scribeNode.click();
+          executeCommand('createLink', '#');
+        });
+
+        it('should insert A with specified URL and content', function () {
+          return scribeNode.getInnerHTML().then(function (innerHTML) {
+            expect(innerHTML).to.have.html('<p><a href="#">#</a><bogus-br></p>');
+          });
+        });
+      });
+    });
+
+    givenContentOf('<p>|1|</p>', function () {
+      when('the command is executed', function () {
+        beforeEach(function () {
+          executeCommand('createLink', '#');
+        });
+
+        it('should wrap selection with A', function () {
+          return scribeNode.getInnerHTML().then(function (innerHTML) {
+            expect(innerHTML).to.have.html('<p><a href="#">1</a></p>');
+          });
+        });
+      });
+    });
+  });
 });