diff --git a/test/editor_contenteditablemode_test.js b/test/editor_contenteditablemode_test.js
index 60e1091..779da41 100644
--- a/test/editor_contenteditablemode_test.js
+++ b/test/editor_contenteditablemode_test.js
@@ -12,11 +12,28 @@ if (wysihtml.browser.supported()) {
this.editableArea.className = "wysihtml-test-class";
this.editableArea.title = "Please enter your foo";
this.editableArea.innerHTML = "hey tiff, what's up?";
-
+
this.originalBodyClassName = document.body.className;
-
+
document.body.appendChild(this.editableArea);
-
+
+ },
+
+ clickOn: function(element) {
+ var mEvent;
+ //This is true only for IE,firefox
+ if (document.createEvent){
+ // To create a mouse event , first we need to create an event and then initialize it.
+ mEvent = document.createEvent('MouseEvent');
+ mEvent.initMouseEvent('click',true,true,window,0,0,0,0,0,false,false,false,false,0,null);
+ } else {
+ mEvent = new MouseEvent('click', {
+ 'view': window,
+ 'bubbles': true,
+ 'cancelable': true
+ });
+ }
+ element.dispatchEvent(mEvent);
},
teardown: function() {
@@ -37,12 +54,12 @@ if (wysihtml.browser.supported()) {
var editor = new wysihtml.Editor(this.editableArea);
editor.on("load", function() {
var editableElement = that.editableArea;
-
+
ok(true, "Load callback triggered");
ok(wysihtml.dom.hasClass(document.body, "wysihtml-supported"), " received correct class name");
ok(wysihtml.dom.hasClass(editableElement, "wysihtml-test-class"), "editable kept its original class name");
ok(wysihtml.dom.hasClass(editableElement, "wysihtml-sandbox"), "editable added its own sandbox class name");
-
+
equal(editor.config.contentEditableMode, true, "contentEditableMode deduced correctly as editable is initiated on non textarea");
equal(editor.config.noTextarea, true, "noTextarea mode deduced correctly as editable is initiated on non textarea");
equal(editableElement.style.display, "", "Editor contenteditable is visible");
@@ -53,79 +70,79 @@ if (wysihtml.browser.supported()) {
equal(editableElement.innerHTML.toLowerCase(), "hey tiff, what's up?", "Initial value preserved in editor");
ok(wysihtml.dom.hasClass(editableElement, "wysihtml-editor"), "Editor element has correct class name");
equal(typeof editor.synchronizer, "undefined", "Syncronizer correctly not initiated in contenteditable mode");
-
+
start();
});
});
-// EVENTS TESTS
+// EVENTS TESTS
asyncTest("Check events", function() {
expect(17);
-
+
var that = this;
var editor = new wysihtml.Editor(this.editableArea);
-
+
editor.on("beforeload", function() {
ok(true, "'beforeload' event correctly fired");
});
-
+
editor.on("load", function() {
var composerElement = that.editableArea;
-
+
editor.on("focus", function(event) {
ok(true, "'focus' event correctly fired");
ok(event, "event is defined");
ok(event instanceof Event, "event is instance of 'Event'");
ok(event && event.type === 'focus', "event is of type 'focus'");
});
-
+
editor.on("blur", function(event) {
ok(true, "'blur' event correctly fired");
ok(event, "event is defined");
ok(event instanceof Event, "event is instance of 'Event'");
ok(event && event.type === 'blur', "event is of type 'blur'");
});
-
+
editor.on("change", function(event) {
ok(true, "'change' event correctly fired");
ok(event, "event is defined");
ok(event instanceof Event, "event is instance of 'Event'");
ok(event && event.type === 'change', "event is of type 'change'");
});
-
-
+
+
editor.on("custom_event", function(event) {
ok(true, "'custom_event' correctly fired");
ok(event, "event is defined");
ok(event && event.type === 'custom_event', "event is of type 'custom_event'");
});
-
+
happen.once(composerElement, {type: "focus"});
editor.stopObserving("focus");
-
+
// Modify innerHTML in order to force 'change' event to trigger onblur
composerElement.innerHTML = "foobar";
happen.once(composerElement, {type: "blur"});
happen.once(composerElement, {type: "focusout"});
-
+
equal(wysihtml.dom.getStyle("margin-top").from(composerElement), "5px", ":focus styles are correctly unset");
-
-
+
+
editor.fire("custom_event", { type: 'custom_event' });
-
+
setTimeout(function() { start(); }, 100);
});
});
asyncTest("Check events paste", function() {
expect(12);
-
+
var that = this;
var editor = new wysihtml.Editor(this.editableArea);
-
+
editor.on("load", function() {
var composerElement = that.editableArea;
-
+
editor.on("paste", function(event) {
ok(event, "event is defined");
ok(event instanceof Event, "event is instance of 'Event'");
@@ -143,20 +160,20 @@ if (wysihtml.browser.supported()) {
var pasteEvent = document.createEvent("Event");
pasteEvent.initEvent("paste", true, true);
that.editableArea.dispatchEvent(pasteEvent);
-
+
setTimeout(function() { start(); }, 100);
});
});
asyncTest("Check events drop", function() {
expect(12);
-
+
var that = this;
var editor = new wysihtml.Editor(this.editableArea);
-
+
editor.on("load", function() {
var composerElement = that.editableArea;
-
+
//if changing from drop to paste it works
editor.on('drop', function(event) {
ok(event, "event is defined");
@@ -185,21 +202,21 @@ if (wysihtml.browser.supported()) {
});
-// Placeholder tests
+// Placeholder tests
asyncTest("Check placeholder", function() {
expect(12);
-
+
var that = this;
-
+
var placeholderText = "enter text ...";
this.editableArea.innerHTML = "";
this.editableArea.setAttribute("data-placeholder", "enter text ...");
-
+
var editor = new wysihtml.Editor(this.editableArea);
editor.on("load", function() {
var composerElement = that.editableArea;
equal(wysihtml.dom.getTextContent(composerElement), placeholderText, "Placeholder text correctly copied into textarea");
-
+
ok(wysihtml.dom.hasClass(composerElement, "wysihtml-placeholder"), "Editor got 'placeholder' css class");
ok(editor.hasPlaceholderSet(), "'hasPlaceholderSet' returns correct value when placeholder is actually set");
editor.fire("focus:composer");
@@ -208,7 +225,7 @@ if (wysihtml.browser.supported()) {
ok(!editor.hasPlaceholderSet(), "'hasPlaceholderSet' returns correct value when placeholder isn't actually set");
editor.fire("blur:composer");
equal(wysihtml.dom.getTextContent(composerElement), placeholderText, "Editor restored placeholder text after unfocus");
- editor.fire("focus:composer");
+ editor.fire("focus:composer");
equal(wysihtml.dom.getTextContent(composerElement), "");
composerElement.innerHTML = "some content";
editor.fire("blur:composer");
@@ -225,12 +242,12 @@ if (wysihtml.browser.supported()) {
});
});
-// Editor available functions test
+// Editor available functions test
asyncTest("Check public api", function() {
expect(13);
-
+
var that = this;
-
+
var editor = new wysihtml.Editor(this.editableArea, {
parserRules: { tags: { p: { rename_tag: "div" }, "strong": {} } },
classNames: {
@@ -238,47 +255,47 @@ if (wysihtml.browser.supported()) {
composer: "editor"
}
});
-
+
editor.on("load", function() {
ok(editor.isCompatible(), "isCompatible() returns correct value");
ok(wysihtml.dom.hasClass(document.body, "editor-is-supported"), " received correct class name");
-
+
var composerElement = that.editableArea;
editor.clear();
equal(wysihtml.dom.getTextContent(composerElement), "", "Editor empty after calling 'clear'");
ok(wysihtml.dom.hasClass(composerElement, "editor"), "Composer element has correct class name");
-
+
var html = "hello foo!";
editor.setValue(html);
equal(composerElement.innerHTML.toLowerCase(), html, "Editor content correctly set after calling 'setValue'");
ok(!editor.isEmpty(), "'isEmpty' returns correct value when the composer element isn't actually empty");
-
+
var value = editor.getValue(false, false);
equal(value.toLowerCase(), html, "Editor content correctly returned after calling 'getValue(false, false)'");
-
+
editor.clear();
value = editor.getValue();
equal(value, "");
ok(editor.isEmpty(), "'isEmpty' returns correct value when the composer element is actually empty");
-
+
equal(editor.parse("foo
").toLowerCase(), "foo
", "'parse' returns correct value");
-
+
// Check disable/enable
editor.disable();
ok(!composerElement.getAttribute("contentEditable"), "When disabled the composer hasn't the contentEditable attribute");
-
+
editor.enable();
equal(composerElement.getAttribute("contentEditable"), "true", "After enabling the editor the contentEditable property is true");
ok(!composerElement.getAttribute("disabled"), "After enabling the disabled attribute is unset");
-
+
start();
});
});
-
-// Parser tests
+
+// Parser tests
asyncTest("Parser (default parser method with parserRules as object)", function() {
expect(2);
-
+
var parserRules = {
tags: {
div: true,
@@ -287,14 +304,14 @@ if (wysihtml.browser.supported()) {
script: undefined
}
};
-
+
var input = "foobar
",
output = "foobar
";
-
+
var editor = new wysihtml.Editor(this.editableArea, {
parserRules: parserRules
});
-
+
editor.on("load", function() {
deepEqual(editor.config.parserRules, parserRules, "Parser rules correctly set on config object");
// Invoke parsing via second parameter of setValue()
@@ -303,7 +320,7 @@ if (wysihtml.browser.supported()) {
start();
});
});
-
+
asyncTest("Editable area html should be cleaned up upon initiation", function() {
expect(2);
var that = this,
@@ -315,31 +332,31 @@ if (wysihtml.browser.supported()) {
input = "",
output = "Hi,
there!
",
editor;
-
+
this.editableArea.innerHTML = input;
equal(that.editableArea.innerHTML, input, "Content is set as unclean before editor initiation");
editor = new wysihtml.Editor(this.editableArea, {
parserRules: parserRules
});
-
+
editor.on("load", function() {
equal(that.editableArea.innerHTML, output, "Content is cleaned after initiation");
start();
});
});
-
-
+
+
asyncTest("Parser (custom parser method with parserRules as object", function() {
expect(6);
this.editableArea.innerHTML = "foobar
";
-
+
var that = this,
parserRules = { script: undefined },
input = this.editableArea.innerHTML,
output = input;
-
-
+
+
var editor = new wysihtml.Editor(this.editableArea, {
parserRules: parserRules,
parser: function(html, config) {
@@ -352,7 +369,7 @@ if (wysihtml.browser.supported()) {
return html.replace(/\.*?\<\/script\>/gi, "");
}
});
-
+
editor.on("load", function() {
var output2 = "foobar
";
// Invoke parsing via second parameter of setValue()
@@ -360,21 +377,21 @@ if (wysihtml.browser.supported()) {
start();
});
});
-
+
asyncTest("Inserting an element which causes the textContent/innerText of the contentEditable element to be empty works correctly", function() {
expect(1);
-
+
var that = this;
-
+
var editor = new wysihtml.Editor(this.editableArea, {
parserRules: { tags: { "img": {} } }
});
editor.on("load", function() {
var html = '![]()
',
composerElement = that.editableArea;
-
+
composerElement.innerHTML = html;
-
+
// Fire events that could cause a change in the composer
happen.once(composerElement, {type: "keypress"});
@@ -420,52 +437,38 @@ if (wysihtml.browser.supported()) {
noerror = false;
};
- toolbar.dispatchEvent(new MouseEvent('click', {
- 'view': window,
- 'bubbles': true,
- 'cancelable': true
- }));
-
- document.body.dispatchEvent(new MouseEvent('click', {
- 'view': window,
- 'bubbles': true,
- 'cancelable': true
- }));
-
- editor.composer.element.dispatchEvent(new MouseEvent('click', {
- 'view': window,
- 'bubbles': true,
- 'cancelable': true
- }));
+ this.clickOn(toolbar);
+ this.clickOn(document.body);
+ this.clickOn(editor.composer.element);
setTimeout(function() {
ok(noerror, "Toolbar or body click did not bring up any error");
start();
}, 100);
-
- });
+
+ }.bind(this));
});
-
- /*
+
+ /*
// TODO: needs logic rethink of terms and conditions
asyncTest("If selection borders cross contenteditabel only editable gets modified", function() {
expect(3);
var that = this,
editor = new wysihtml.Editor(this.editableArea);
-
+
editor.on("load", function() {
editor.setValue("foobar", true);
editor.composer.selection.selectNode(that.editableArea);
equal(that.editableArea.innerHTML, "foobar", "Content was not bold before");
window.e = editor;
editor.composer.commands.exec('bold');
-
+
ok(wysihtml.dom.getStyle("font-weight").from(that.editableArea.children[0]) == 700 || wysihtml.dom.getStyle("font-weight").from(that.editableArea.children[0]) == "bold", "First child has style bold");
ok(wysihtml.dom.getStyle("font-weight").from(that.editableArea) == 400 || wysihtml.dom.getStyle("font-weight").from(that.editableArea) == "normal", "Editable element itself is not bold");
start();
});
});
*/
-
+
}