Merge pull request #7 from jywarren/custom-submit-method

basic test of submission form and before/after

Author: jywarren

dist/inlineMarkdownEditor.js

@@ -10346,6 +10346,7 @@ module.exports = function processSection(markdown, o) {
       o.insertEditLink(uniqueId, el, form, onEdit, false, o);
       // plan for swappable editors; will need to specify both constructor and onEditorSubmit
       function onEdit() {
+        var editor;
         if (o.wysiwyg && $('#' + uniqueId).find('.wk-container').length === 0) {
           // insert rich editor
           editor = new PL.Editor({
@@ -10357,25 +10358,27 @@ module.exports = function processSection(markdown, o) {
           form.hide();
         });
         form.find('button.submit').click(function(e) {
-          submitSectionForm(e, form, editor)
+          prepareAndSendSectionForm(e, form, editor, _markdown);
         });
       }
     }
- 
-    function submitSectionForm(e, form, _editor) {
-      e.preventDefault();
+
+    function prepareAndSendSectionForm(e, form, _editor, _markdown) {
       message.html('<i class="fa fa-spinner fa-spin" style="color:#ccc;"></i>');
       if (_editor) {
         changes = _editor.richTextModule.value(); // rich editor
       } else {
         changes = form.find('textarea').val();
       }
-      // we should swap for a method like this:
-      //o.sendChanges(markdown, changes);
-      // but should do mocked ajax testing first
+      o.submitSectionForm(e, _markdown, changes, o);
+    }
+
+    // provide overridable default 
+    o.submitSectionForm = o.submitSectionForm || function submitSectionForm(e, before, after, o) {
+      e.preventDefault();
       $.post(o.replaceUrl, {
-        before: markdown,
-        after: changes
+        before: before, // encodeURI(before)
+        after: after // encodeURI(after)
       })
       .done(function onComplete(response) {
         // we should need fewer things here:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "inline-markdown-editor",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "An inline wysiwyg markdown document editor based on replacing string subsections. WYSIWYG possible via woofmark.",
   "main": "dist/inlineMarkdownEditor.js",
   "scripts": {

spec/javascripts/replacement_spec.js

@@ -1,16 +1,44 @@
 describe("Replacement functions", function() {
 
-  var editor;
-
   it("won't generate an editor for an ambiguous (duplicated) section, where replacement server side could apply to the wrong section", function() {
     fixture = loadFixtures('index.html');
-    var html = "Unique text.\n\nDuplicated text.\n\nDuplicated text."
+    var html = "Unique text.\n\nDuplicated text.\n\nDuplicated text.";
     $('.markdown').html(html);
-    editor = inlineMarkdownEditor({
+    var editor = inlineMarkdownEditor({
       replaceUrl: '/wiki/replace/',
       selector: '.markdown'
     });
     expect($('.inline-edit-form textarea').length).toBe(1);
   });
 
+  it("sends exactly matching original text and 'before' parameters", function(done) {
+    fixture = loadFixtures('index.html');
+    var html     = "## Headings [with](/links)";
+    var new_html = "## Headings [with](/links) and other things";
+    $('.markdown').html(html);
+
+    var editor = inlineMarkdownEditor({
+      replaceUrl: '/wiki/replace/',
+      selector: '.markdown',
+      submitSectionForm: submitSectionForm
+    });
+
+    function submitSectionForm(e, before, after, o) {
+      expect(before).toBe(html);
+      expect(after).toBe(new_html);
+      expect(before).not.toBe(after);
+      done();
+    }
+
+    // generate an editor by clicking the pencil button
+    $('.inline-edit-btn').click();
+
+    $('.inline-edit-form textarea').html(new_html);
+
+    // trigger a section save:
+    $('.inline-edit-form:last button.submit').click();
+    expect(editor.options.submitSectionForm).toBe(submitSectionForm);
+    expect(editor.options.originalMarkdown).toBe(html);
+  });
+
 });

src/processSection.js

@@ -24,6 +24,7 @@ module.exports = function processSection(markdown, o) {
       o.insertEditLink(uniqueId, el, form, onEdit, false, o);
       // plan for swappable editors; will need to specify both constructor and onEditorSubmit
       function onEdit() {
+        var editor;
         if (o.wysiwyg && $('#' + uniqueId).find('.wk-container').length === 0) {
           // insert rich editor
           editor = new PL.Editor({
@@ -35,25 +36,27 @@ module.exports = function processSection(markdown, o) {
           form.hide();
         });
         form.find('button.submit').click(function(e) {
-          submitSectionForm(e, form, editor)
+          prepareAndSendSectionForm(e, form, editor, _markdown);
         });
       }
     }
- 
-    function submitSectionForm(e, form, _editor) {
-      e.preventDefault();
+
+    function prepareAndSendSectionForm(e, form, _editor, _markdown) {
       message.html('<i class="fa fa-spinner fa-spin" style="color:#ccc;"></i>');
       if (_editor) {
         changes = _editor.richTextModule.value(); // rich editor
       } else {
         changes = form.find('textarea').val();
       }
-      // we should swap for a method like this:
-      //o.sendChanges(markdown, changes);
-      // but should do mocked ajax testing first
+      o.submitSectionForm(e, _markdown, changes, o);
+    }
+
+    // provide overridable default 
+    o.submitSectionForm = o.submitSectionForm || function submitSectionForm(e, before, after, o) {
+      e.preventDefault();
       $.post(o.replaceUrl, {
-        before: markdown,
-        after: changes
+        before: before, // encodeURI(before)
+        after: after // encodeURI(after)
       })
       .done(function onComplete(response) {
         // we should need fewer things here: