vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-06-28 06:10:09 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update the TinyMCE tests.

Browse Source 
In 4.0.20 all tests were reworked. The 'testrunner' was removed and the PhantomJS Runner QUnit plugin was added making it possible to run the tests from cli. However it is still necessary to run the tests in all supported browsers to test the fixes for all browser quirks and normalization. Also all tests are loaded in one html file.

See #27014

git-svn-id: https://develop.svn.wordpress.org/trunk@27679 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz
2014-03-24 05:59:45 +00:00
parent 9b56f72fb1
commit 0898014ebd
154 changed files with 9759 additions and 15877 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2259
tests/qunit/editor/external-plugins/table/plugin.js
View File

File diff suppressed because it is too large Load Diff

1
tests/qunit/editor/external-plugins/table/plugin.min.js vendored
View File

File diff suppressed because one or more lines are too long

104
tests/qunit/editor/index.html
View File

@@ -1,22 +1,96 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Test Runner</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="js/qunit/testrunner.css" type="text/css" />
<script src="js/qunit/testrunner.js"></script>
<script>
TestRunner.addSuites([
"tinymce/tests.js",
"tinymce/dom/tests.js",
"tinymce/html/tests.js",
"tinymce/ui/tests.js",
"tinymce/util/tests.js",
"plugins/tests.js"
]);
</script>
<meta charset="UTF-8" />
<title>TinyMCE QUnit tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
<title>QUnit tests</title>
<link rel="stylesheet" href="js/qunit/qunit.css" type="text/css" />
<link rel="stylesheet" href="../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" type="text/css" />
<link rel="stylesheet" href="tinymce/ui/css/ui-overrides.css" type="text/css" />
<style>
#qunit-modulefilter-container { float: none; }
</style>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
<script src="http://www.google.com/jsapi"></script>
<script>google.load("jquery", "1");</script>
<script src="js/qunit/qunit.js"></script>
<script src="../../../src/wp-includes/js/tinymce/tinymce.min.js"></script>
<!--<script src="../js/tinymce/classes/jquery.tinymce.js"></script> -->
<script src="js/utils.js"></script>
<script src="js/init.js"></script>
<!-- tinymce.dom.* -->
<script src="tinymce/dom/DOMUtils.js"></script>
<script src="tinymce/dom/EventUtils.js"></script>
<script src="tinymce/dom/Range.js"></script>
<script src="tinymce/dom/Selection.js"></script>
<script src="tinymce/dom/Serializer.js"></script>
<script src="tinymce/dom/TridentSelection.js"></script>
<!-- tinymce.html.* -->
<script src="tinymce/html/DomParser.js"></script>
<script src="tinymce/html/Entities.js"></script>
<script src="tinymce/html/Node.js"></script>
<script src="tinymce/html/SaxParser.js"></script>
<script src="tinymce/html/Schema.js"></script>
<script src="tinymce/html/Obsolete.js"></script>
<script src="tinymce/html/Styles.js"></script>
<script src="tinymce/html/Writer.js"></script>
<!-- tnymce.ui.* -->
<script src="tinymce/ui/AbsoluteLayout.js"></script>
<script src="tinymce/ui/Button.js"></script>
<script src="tinymce/ui/Collection.js"></script>
<script src="tinymce/ui/ColorButton.js"></script>
<script src="tinymce/ui/Control.js"></script>
<script src="tinymce/ui/FitLayout.js"></script>
<script src="tinymce/ui/FlexLayout.js"></script>
<script src="tinymce/ui/GridLayout.js"></script>
<script src="tinymce/ui/MenuButton.js"></script>
<script src="tinymce/ui/Panel.js"></script>
<script src="tinymce/ui/Selector.js"></script>
<script src="tinymce/ui/SplitButton.js"></script>
<script src="tinymce/ui/TabPanel.js"></script>
<script src="tinymce/ui/TextBox.js"></script>
<script src="tinymce/ui/Window.js"></script>
<!-- tinymce.util.* -->
<script src="tinymce/util/JSON.js"></script>
<script src="tinymce/util/JSONRequest.js"></script>
<script src="tinymce/util/LocalStorage.js"></script>
<script src="tinymce/util/Quirks_webkit.js"></script>
<script src="tinymce/util/URI.js"></script>
<script src="tinymce/util/XHR.js"></script>
<!-- tinymce.* -->
<script src="tinymce/Editor.js"></script>
<script src="tinymce/EditorCommands.js"></script>
<script src="tinymce/EnterKey.js"></script>
<script src="tinymce/ForceBlocks.js"></script>
<script src="tinymce/Formatter_apply.js"></script>
<script src="tinymce/Formatter_check.js"></script>
<script src="tinymce/Formatter_remove.js"></script>
<script src="tinymce/UndoManager.js"></script>
<!-- tinymce.plugins.* -->
<!--<script src="plugins/autosave.js"></script>
<script src="plugins/fullpage.js"></script>
<script src="plugins/jquery_plugin.js"></script>
<script src="plugins/legacyoutput.js"></script>
<script src="plugins/lists.js"></script> -->
<script src="plugins/media.js"></script>
<!--<script src="plugins/noneditable.js"></script> -->
<script src="plugins/paste.js"></script>
<!--<script src="plugins/searchreplace.js"></script>
<script src="plugins/spellchecker.js"></script>
<script src="plugins/table.js"></script>
<script src="plugins/wordcount.js"></script> -->
</body>
</html>

93
tests/qunit/editor/js/init.js Normal file
View File

@@ -0,0 +1,93 @@
(function() {
var coverObjects = [], modulesExecuted = {};
QUnit.config.reorder = false;
var oldModule = module;
QUnit.moduleStart(function(details) {
modulesExecuted[details.name] = true;
tinymce.remove();
document.getElementById('view').innerHTML = '<textarea></textarea>';
});
QUnit.moduleDone(function() {
tinymce.remove();
window.editor = window.inlineEditor = null;
});
QUnit.done(function() {
document.getElementById("view").style.display = 'none';
if (window.__$coverObject) {
coverObjects.push(window.__$coverObject);
$('<button>Coverage report</button>').on('click', function() {
window.open('coverage/index.html', 'coverage');
}).appendTo(document.body);
}
});
window.module = function(name, settings) {
settings = settings || {};
if (settings.setupModule) {
QUnit.moduleStart(function(details) {
if (details.name == name) {
settings.setupModule();
}
});
}
if (settings.teardownModule) {
QUnit.moduleDone(function(details) {
if (details.name == name) {
settings.teardownModule();
}
});
}
oldModule(name, settings);
};
window.getCoverObject = function() {
var coverObject = {}, fileName, gaps, gap, count, targetModuleName;
var isScoped = document.location.search.indexOf('module=') != -1;
for (var i = 0, length = coverObjects.length; i < length; i++) {
for (fileName in coverObjects[i]) {
gaps = coverObjects[i][fileName];
if (isScoped && fileName.indexOf('js/tinymce/classes') === 0) {
targetModuleName = "tinymce." + fileName.substr('js/tinymce/classes'.length + 1).replace(/\//g, '.');
targetModuleName = targetModuleName.replace(/\.js$/, '');
if (!modulesExecuted[targetModuleName]) {
continue;
}
}
if (!coverObject.hasOwnProperty(fileName)) {
coverObject[fileName] = gaps;
} else {
for (gap in gaps) {
if (gap === '__code') {
continue;
}
count = gaps[gap];
if (!coverObject[fileName].hasOwnProperty(gap)) {
coverObject[fileName][gap] = count;
} else {
coverObject[fileName][gap] += count;
}
}
}
}
}
return coverObject;
};
})();

326
tests/qunit/editor/js/qunit/qunit.css
View File

@@ -1,119 +1,237 @@
/*!
* QUnit 1.14.0
* http://qunitjs.com/
*
* Copyright 2013 jQuery Foundation and other contributors
* Released under the MIT license
* http://jquery.org/license
*
* Date: 2014-01-31T16:40Z
*/
ol#qunit-tests {
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
margin:0;
padding:0;
list-style-position:inside;
/** Font Family and Sizes */
font-size: smaller;
}
ol#qunit-tests li{
padding:0.4em 0.5em 0.4em 2.5em;
border-bottom:1px solid #fff;
font-size:small;
list-style-position:inside;
}
ol#qunit-tests li ol{
box-shadow: inset 0px 2px 13px #999;
-moz-box-shadow: inset 0px 2px 13px #999;
-webkit-box-shadow: inset 0px 2px 13px #999;
margin-top:0.5em;
margin-left:0;
padding:0.5em;
background-color:#fff;
border-radius:15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}
ol#qunit-tests li li{
border-bottom:none;
margin:0.5em;
background-color:#fff;
list-style-position: inside;
padding:0.4em 0.5em 0.4em 0.5em;
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult {
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif;
}
ol#qunit-tests li li.pass{
border-left:26px solid #C6E746;
background-color:#fff;
color:#5E740B;
}
ol#qunit-tests li li.fail{
border-left:26px solid #EE5757;
background-color:#fff;
color:#710909;
#qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
#qunit-tests { font-size: smaller; }
/** Resets */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter {
margin: 0;
padding: 0;
}
ol#qunit-tests li.pass{
background-color:#D2E0E6;
color:#528CE0;
/** Header */
#qunit-header {
padding: 0.5em 0 0.5em 1em;
color: #8699A4;
background-color: #0D3349;
font-size: 1.5em;
line-height: 1em;
font-weight: 400;
border-radius: 5px 5px 0 0;
}
ol#qunit-tests li.fail{
background-color:#EE5757;
color:#000;
#qunit-header a {
text-decoration: none;
color: #C2CCD1;
}
ol#qunit-tests li strong {
cursor:pointer;
#qunit-header a:hover,
#qunit-header a:focus {
color: #FFF;
}
h1#qunit-header{
background-color:#0d3349;
margin:0;
padding:0.5em 0 0.5em 1em;
color:#fff;
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
border-top-right-radius:15px;
border-top-left-radius:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-topleft:15px;
-webkit-border-top-right-radius:15px;
-webkit-border-top-left-radius:15px;
text-shadow: rgba(0, 0, 0, 0.5) 4px 4px 1px;
#qunit-testrunner-toolbar label {
display: inline-block;
padding: 0 0.5em 0 0.1em;
}
h2#qunit-banner{
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
height:5px;
margin:0;
padding:0;
}
h2#qunit-banner.qunit-pass{
background-color:#C6E746;
}
h2#qunit-banner.qunit-fail, #qunit-testrunner-toolbar {
background-color:#EE5757;
#qunit-banner {
height: 5px;
}
#qunit-testrunner-toolbar {
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
padding:0;
/*width:80%;*/
padding:0em 0 0.5em 2em;
font-size: small;
padding: 0.5em 0 0.5em 2em;
color: #5E740B;
background-color: #EEE;
overflow: hidden;
}
h2#qunit-userAgent {
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
background-color:#2b81af;
margin:0;
padding:0;
color:#fff;
font-size: small;
padding:0.5em 0 0.5em 2.5em;
#qunit-userAgent {
padding: 0.5em 0 0.5em 2.5em;
background-color: #2B81AF;
color: #FFF;
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
}
p#qunit-testresult{
font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
margin:0;
font-size: small;
color:#2b81af;
border-bottom-right-radius:15px;
border-bottom-left-radius:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-bottomleft:15px;
-webkit-border-bottom-right-radius:15px;
-webkit-border-bottom-left-radius:15px;
background-color:#D2E0E6;
padding:0.5em 0.5em 0.5em 2.5em;
#qunit-modulefilter-container {
float: right;
}
/** Tests: Pass/Fail */
#qunit-tests {
list-style-position: inside;
}
#qunit-tests li {
padding: 0.4em 0.5em 0.4em 2.5em;
border-bottom: 1px solid #FFF;
list-style-position: inside;
}
#qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running {
display: none;
}
#qunit-tests li strong {
cursor: pointer;
}
#qunit-tests li a {
padding: 0.5em;
color: #C2CCD1;
text-decoration: none;
}
#qunit-tests li a:hover,
#qunit-tests li a:focus {
color: #000;
}
#qunit-tests li .runtime {
float: right;
font-size: smaller;
}
.qunit-assert-list {
margin-top: 0.5em;
padding: 0.5em;
background-color: #FFF;
border-radius: 5px;
}
.qunit-collapsed {
display: none;
}
#qunit-tests table {
border-collapse: collapse;
margin-top: 0.2em;
}
#qunit-tests th {
text-align: right;
vertical-align: top;
padding: 0 0.5em 0 0;
}
#qunit-tests td {
vertical-align: top;
}
#qunit-tests pre {
margin: 0;
white-space: pre-wrap;
word-wrap: break-word;
}
#qunit-tests del {
background-color: #E0F2BE;
color: #374E0C;
text-decoration: none;
}
#qunit-tests ins {
background-color: #FFCACA;
color: #500;
text-decoration: none;
}
/*** Test Counts */
#qunit-tests b.counts { color: #000; }
#qunit-tests b.passed { color: #5E740B; }
#qunit-tests b.failed { color: #710909; }
#qunit-tests li li {
padding: 5px;
background-color: #FFF;
border-bottom: none;
list-style-position: inside;
}
/*** Passing Styles */
#qunit-tests li li.pass {
color: #3C510C;
background-color: #FFF;
border-left: 10px solid #C6E746;
}
#qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; }
#qunit-tests .pass .test-name { color: #366097; }
#qunit-tests .pass .test-actual,
#qunit-tests .pass .test-expected { color: #999; }
#qunit-banner.qunit-pass { background-color: #C6E746; }
/*** Failing Styles */
#qunit-tests li li.fail {
color: #710909;
background-color: #FFF;
border-left: 10px solid #EE5757;
white-space: pre;
}
#qunit-tests > li:last-child {
border-radius: 0 0 5px 5px;
}
#qunit-tests .fail { color: #000; background-color: #EE5757; }
#qunit-tests .fail .test-name,
#qunit-tests .fail .module-name { color: #000; }
#qunit-tests .fail .test-actual { color: #EE5757; }
#qunit-tests .fail .test-expected { color: #008000; }
#qunit-banner.qunit-fail { background-color: #EE5757; }
/** Result */
#qunit-testresult {
padding: 0.5em 0.5em 0.5em 2.5em;
color: #2B81AF;
background-color: #D2E0E6;
border-bottom: 1px solid #FFF;
}
#qunit-testresult .module-name {
font-weight: 700;
}
/** Fixture */
#qunit-fixture {
position: absolute;
top: -10000px;
left: -10000px;
width: 1000px;
height: 1000px;
}
strong b.fail{
color:#710909;
}
strong b.pass{
color:#5E740B;
}

2913
tests/qunit/editor/js/qunit/qunit.js
View File

File diff suppressed because it is too large Load Diff

13
tests/qunit/editor/js/qunit/reporter.js
View File

@@ -1,13 +0,0 @@
(function() {
if (parent != window && window.QUnit) {
QUnit.done = function(data) {
if (window.__$coverObject) {
parent.TestRunner.addCoverObject(window.__$coverObject);
}
if (parent.TestRunner) {
parent.TestRunner.done(data.failed, data.total, document.title);
}
};
}
})();

151
tests/qunit/editor/js/qunit/testrunner.css
View File

@@ -1,151 +0,0 @@
body, html {
margin: 0; padding: 0;
overflow: hidden;
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
font-size: 12px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #111;
background: #EEE;
}
a {
color: #111;
}
.runner, .sidebar, .controls, .tests {
position: absolute;
top: 0; left: 0;
}
.sidebar {
background: #DDD;
}
.controls {
background: #BBB;
}
.controls div {
padding: 2px;
}
.tests {
overflow: auto;
}
.suite {
padding: 10px;
}
.suite .selection {
float: right;
font-weight: normal;
}
.stats {
display: none;
float: right;
margin-right: 3px;
font-size: 10px;
line-height: 16px;
}
.test {
margin: 5px;
background: #EEE;
line-height: 16px;
}
.passed a {
color: #888;
}
span.passed {
color: green;
}
div.failed {
background: #EE5757;
}
span.failed {
color: red;
}
.failed span.failed {
color: black;
}
.running .stats, .failed .stats, .passed .stats, .skipped .stats {
display: inline;
font-weight: bold;
}
.suite-title {
font-weight: bold;
}
.gstatus {
float: right;
}
iframe {
position: absolute;
top: 0; left: 0;
border: 0;
padding: 0;
}
*[unselectable] {
-moz-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none;
}
button#coverage {
float: right;
}
#coverview {
display: none;
position: fixed;
background: #fff;
z-index: 9;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
#coverview iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#coverview .close {
position: absolute;
right: -14px;
top: -18px;
color: #000;
font-size: 14px;
display: block;
z-index: 11;
text-decoration: none;
font-family: Verdana;
font-weight: bold;
text-shadow: 0 0 2px #fff;
}
#overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #ccc;
background: rgba(0,0,0,0.3);
}

543
tests/qunit/editor/js/qunit/testrunner.js
View File

@@ -1,543 +0,0 @@
// Quick and dirty testrunner hack, it's ugly but it works
(function() {
function TestRunner() {
var suites = [], suiteUrls = [], actions = {};
var started, currentTest, testUrls = [], globalStats = {};
var coverObjects = [];
function get(id) {
return document.getElementById(id);
}
function addClass(elm, cls) {
if (cls && !hasClass(elm, cls)) {
elm.className += elm.className ? ' ' + cls : cls;
}
}
function removeClass(elm, cls) {
if (hasClass(elm, cls)) {
elm.className = elm.className.replace(new RegExp("(^|\\s+)" + cls + "(\\s+|$)", "g"), ' ');
}
}
function hasClass(elm, cls) {
return elm && cls && (' ' + elm.className + ' ').indexOf(' ' + cls + ' ') !== -1;
}
function init() {
function loadNext() {
var url = suiteUrls.shift();
if (url) {
loadSuite(url, function(json, url) {
json.baseURL = url.substring(0, url.lastIndexOf('/'));
if (json.baseURL) {
json.baseURL += '/';
}
suites.push(json);
loadNext();
});
} else {
render();
reflow();
hashToStates();
// WP
wpTests();
// Auto-start
started = true;
start();
}
}
loadNext();
}
function getHashData() {
var pos, hash = location.hash, items, item, data = {}, i;
pos = hash.indexOf('!');
if (pos > 0) {
items = hash.substring(pos + 1).split('&');
for (i = 0; i < items.length; i++) {
item = items[i].split('=');
data[item[0]] = item[1];
}
}
return data;
}
function setHashData(data) {
var name, hashItems = [];
for (name in data) {
if (data[name] !== null) {
hashItems.push(name + '=' + data[name]);
}
}
location.hash = '!' + hashItems.join('&');
}
function statesToHash() {
var i, checkboxes, states = [], hasDisabled;
checkboxes = get('tests').getElementsByTagName("input");
for (i = 0; i < checkboxes.length; i++) {
states[i] = checkboxes[i].checked ? '1' : '0';
hasDisabled = hasDisabled || states[i] === '0';
}
setHashData({
min: get('min').checked,
jsrobot: get('jsrobot').checked,
tests: hasDisabled ? states.join('') : null
});
}
function hashToStates() {
var i, data = getHashData(location.hash), checkboxes;
if (typeof(data.min) != "undefined") {
get('min').checked = data.min === "true";
}
if (typeof(data.jsrobot) != "undefined") {
get('jsrobot').checked = data.jsrobot === "true";
}
if (typeof(data.tests) != "undefined") {
checkboxes = get('tests').getElementsByTagName("input");
for (i = 0; i < checkboxes.length; i++) {
checkboxes[i].checked = data.tests.substr(i, 1) === '1';
}
}
}
function addAction(name, action) {
actions[name] = action;
}
function toggleCheckboxes(elm, state) {
var checkboxes = (elm || get('tests')).getElementsByTagName("input"), i;
for (i = 0; i < checkboxes.length; i++) {
checkboxes[i].checked = state;
}
}
function start() {
var si, ti, tests;
testUrls = [];
for (si = 0; si < suites.length; si++) {
tests = suites[si].tests;
for (ti = 0; ti < tests.length; ti++) {
if (get('c' + si + '-' + ti).checked) {
testUrls.push(tests[ti]);
}
removeClass(get('t' + si + '-' + ti), "passed");
removeClass(get('t' + si + '-' + ti), "failed");
}
}
globalStats = {
total: 0,
failed: 0
};
// Start first test
currentTest = testUrls.shift();
if (currentTest) {
get('testview').src = currentTest.url + "?min=" + get('min').checked;
}
get('coverage').disabled = true;
}
function stop() {
started = false;
get('testview').src = 'javascript:""';
get('start').innerHTML = 'start';
if (coverObjects.length) {
get('coverage').disabled = false;
}
}
addAction("start", function(elm) {
started = !started;
if (started) {
start();
} else {
stop();
reset();
}
elm.innerHTML = started ? 'stop' : 'start';
});
addAction("select-none", function(elm) {
toggleCheckboxes(get('s' + elm.getAttribute("data-suite")), false);
reset();
});
addAction("select-all", function(elm) {
toggleCheckboxes(get('s' + elm.getAttribute("data-suite")), true);
reset();
});
addAction("select-failed", function(elm) {
toggleCheckboxes(get('s' + elm.getAttribute("data-suite")), false);
reset();
var targetIndex = elm.getAttribute("data-suite");
for (si = 0; si < suites.length; si++) {
if (targetIndex !== null && targetIndex != si) {
continue;
}
tests = suites[si].tests;
for (ti = 0; ti < tests.length; ti++) {
if (tests[ti].failed) {
get('c' + si + '-' + ti).checked = true;
}
}
}
});
// WP
function wpTests( element ) {
var si, ti, tests, targetIndex = null;
if ( element ) {
targetIndex = element.getAttribute("data-suite");
}
toggleCheckboxes( get( 's' + targetIndex ), false );
reset();
for ( si = 0; si < suites.length; si++ ) {
if ( targetIndex !== null && targetIndex != si ) {
continue;
}
tests = suites[si].tests;
if ( si === 0 || si === 2 || si === 3 || si === 4 ) {
for ( ti in tests ) {
get( 'c' + si + '-' + ti ).checked = true;
}
} else if ( si === 1 ) {
for ( ti in tests ) {
if ( ti !== '1' ) {
// No jQuery integration
get( 'c' + si + '-' + ti ).checked = true;
}
}
} else if ( si === 5 ) {
for ( ti in tests ) {
// Only the media and paste plugins
if ( ti === '0' || ti === '2' ) {
get( 'c' + si + '-' + ti ).checked = true;
}
}
}
}
}
// WP
addAction("select-wordpress", wpTests );
addAction("coverage", function(elm) {
if (elm.disabled) {
return;
}
showCoverage();
});
function render() {
var si, ti, tests, html = '';
var div = document.createElement('div');
addClass(div, "runner");
html += '<div id="sidebar" class="sidebar" unselectable="true">';
html += '<div id="controls" class="controls">';
html += '<div>';
html += '<button id="start" data-action="start">Start</button>';
html += '<label><input id="min" type="checkbox" checked>Minified</label>';
html += '<label style="display:none"><input id="jsrobot" type="checkbox">JSRobot</label>';
html += '<button id="coverage" data-action="coverage" disabled>Coverage</button>';
html += '</div>';
html += '<div>';
html += '<span id="gstatus" class="gstatus"></span>';
html += 'Select: ';
html += '<a data-action="select-wordpress" href="javascript:;">WP</a> ';
html += '<a data-action="select-all" href="javascript:;">[All]</a> ';
html += '<a data-action="select-none" href="javascript:;">[None]</a> ';
html += '<a data-action="select-failed" href="javascript:;">[Failed]</a>';
html += '</div>';
html += '</div>';
html += '<div id="tests" class="tests">';
for (si = 0; si < suites.length; si++) {
tests = suites[si].tests;
html += '<div id="s' + si + '" class="suite"><div class="suite-title">';
html += '<div class="selection">';
html += '<a data-action="select-wordpress" data-suite="' + si + '" href="javascript:;">WP</a> ';
html += '<a data-action="select-all" data-suite="' + si + '" href="javascript:;">[All]</a> ';
html += '<a data-action="select-none" data-suite="' + si + '" href="javascript:;">[None]</a> ';
html += '<a data-action="select-failed" data-suite="' + si + '" href="javascript:;">[Failed]</a>';
html += '</div>' + suites[si].title;
html += '</div>';
for (ti = 0; ti < tests.length; ti++) {
tests[ti].suiteIndex = si;
tests[ti].testIndex = ti;
tests[ti].url = suites[si].baseURL + tests[ti].url;
html += (
'<div id="t' + si + '-' + ti + '" class="test">' +
'<span id="s' + si + '-' + ti + '" class="stats">Running</span>' +
'<input id="c' + si + '-' + ti + '" type="checkbox" checked />' +
'<a href="' + tests[ti].url + '" target="testview">' + tests[ti].title + '</a>' +
'</div>'
);
}
html += '</div>';
}
html += '</div>';
html += '</div>';
html += '<iframe id="testview" name="testview" src="javascript:\'\'"></iframe>';
// coverage
html += '<div id="overlay"></div>';
html += '<div id="coverview">';
html += '<a class="close" href="javascript:TestRunner.hideCoverage();" title="Close">x</a>';
html += '<iframe frameborder="0" src="javascript:\'\'"></iframe>';
html += '</div>';
div.innerHTML = html;
document.body.appendChild(div);
get('sidebar').onclick = function(e) {
var target;
e = e || event;
target = e.target || e.srcElement;
if ((action = actions[target.getAttribute("data-action")])) {
action(target);
}
statesToHash();
};
}
function addSuites(urls) {
suiteUrls.push.apply(suiteUrls, urls);
}
function loadSuite(url, callback) {
var xhr;
function ready() {
if (xhr.readyState == 4) {
callback(eval("(" + xhr.responseText + ")"), url);
xhr = null;
} else {
setTimeout(ready, 10);
}
}
xhr = new XMLHttpRequest();
if (xhr) {
xhr.open('GET', url, true);
xhr.send();
setTimeout(ready, 10);
}
}
function reflow() {
var viewPortW, viewPortH, sideBarWidth, controlsHeight;
function rect(id, x, y, w, h) {
var style, elm;
if ((elm = get(id))) {
style = elm.style;
style.left = x + "px";
style.top = y + "px";
style.width = w + "px";
style.height = h + "px";
}
}
viewPortW = window.innerWidth || document.documentElement.clientWidth;
viewPortH = window.innerHeight || document.documentElement.clientHeight;
sideBarWidth = 300;
controlsHeight = 60;
rect('testview', sideBarWidth, 0, viewPortW - sideBarWidth, viewPortH);
rect('sidebar', 0, 0, sideBarWidth, viewPortH);
rect('controls', 0, 0, sideBarWidth, controlsHeight);
rect('tests', 0, controlsHeight, sideBarWidth, viewPortH - controlsHeight);
}
function reset() {
var si, tests, ti;
stop();
get('gstatus').innerHTML = '';
removeClass(get("controls"), "failed");
for (si = 0; si < suites.length; si++) {
tests = suites[si].tests;
for (ti = 0; ti < tests.length; ti++) {
removeClass(get('t' + si + '-' + ti), "passed");
removeClass(get('t' + si + '-' + ti), "failed");
removeClass(get('t' + si + '-' + ti), "running");
}
}
}
function updateGlobalStatus() {
get('gstatus').innerHTML = 'Total: ' + globalStats.total + ", Failed: " + globalStats.failed;
addClass(get("controls"), globalStats.failed > 0 ? "failed" : "");
}
function done(failed, total) {
var nextTest, currentTestElm;
function runNextTest() {
if ((nextTest = testUrls.shift())) {
currentTest = nextTest;
currentTestElm = get('t' + currentTest.suiteIndex + '-' + currentTest.testIndex);
currentTestElm.scrollIntoView(false);
if (nextTest.jsrobot === true && !get('jsrobot').checked) {
get('s' + currentTest.suiteIndex + '-' + currentTest.testIndex).innerHTML = 'Skipped';
addClass(currentTestElm, "skipped");
runNextTest();
} else {
addClass(currentTestElm, "running");
get('testview').src = nextTest.url + "?min=" + get('min').checked;
}
} else {
stop();
}
}
if (started) {
currentTest.failed = failed;
currentTest.total = total;
globalStats.total += total;
globalStats.failed += failed;
updateGlobalStatus();
get('s' + currentTest.suiteIndex + '-' + currentTest.testIndex).innerHTML = (
'(<span class="failed">' + failed + '</span>, ' +
'<span class="passed">' + (total - failed) + '</span>, ' +
'<span class="total">' + total + '</span>)'
);
addClass(get('t' + currentTest.suiteIndex + '-' + currentTest.testIndex), failed > 0 ? 'failed' : 'passed');
removeClass(currentTestElm, "running");
runNextTest();
}
}
function addCoverObject(coverObject) {
coverObjects.push(coverObject);
}
// this is going to be called from the coverage iframe
function getCoverObject() {
var coverObject = {}, fileName, gaps, gap, count;
for (var i = 0, length = coverObjects.length; i < length; i++) {
for (fileName in coverObjects[i]) {
gaps = coverObjects[i][fileName];
if (!coverObject.hasOwnProperty(fileName)) {
coverObject[fileName] = gaps;
} else {
for (gap in gaps) {
if (gap === '__code') {
continue;
}
count = gaps[gap];
if (!coverObject[fileName].hasOwnProperty(gap)) {
coverObject[fileName][gap] = count;
} else {
coverObject[fileName][gap] += count;
}
}
}
}
}
return coverObject;
}
function showCoverage() {
var overlay, coverView, viewPortW, viewPortH;
viewPortW = window.innerWidth || document.documentElement.clientWidth;
viewPortH = window.innerHeight || document.documentElement.clientHeight;
overlay = get('overlay');
overlay.style.display = 'block';
coverView = get('coverview');
coverView.style.left = '30px';
coverView.style.top = '30px';
coverView.style.width = (viewPortW - 60) + 'px';
coverView.style.height = (viewPortH - 60) + 'px';
coverView.style.display = 'block';
coverView.getElementsByTagName('iframe')[0].src = 'coverage/index.html';
}
function hideCoverage() {
get('overlay').style.display = 'none';
get('coverview').style.display = 'none';
}
return {
init: init,
addSuites: addSuites,
reflow: reflow,
done: done,
addCoverObject: addCoverObject,
getCoverObject: getCoverObject,
showCoverage: showCoverage,
hideCoverage: hideCoverage
};
}
var testRunner = new TestRunner();
self.onload = function() {
testRunner.init();
};
self.onresize = function() {
testRunner.reflow();
};
self.TestRunner = testRunner;
})();

148
tests/qunit/editor/js/runner.js Normal file
View File

@@ -0,0 +1,148 @@
/*
* PhantomJS Runner QUnit Plugin 1.2.0
*
* PhantomJS binaries: http://phantomjs.org/download.html
* Requires PhantomJS 1.6+ (1.7+ recommended)
*
* Run with:
* phantomjs runner.js [url-of-your-qunit-testsuite]
*
* e.g.
* phantomjs runner.js http://localhost/qunit/test/index.html
*/
/*global phantom:false, require:false, console:false, window:false, QUnit:false */
(function() {
'use strict';
var url, page, timeout,
args = require('system').args;
// arg[0]: scriptName, args[1...]: arguments
if (args.length < 2 || args.length > 3) {
console.error('Usage:\n phantomjs runner.js [url-of-your-qunit-testsuite] [timeout-in-seconds]');
phantom.exit(1);
}
url = args[1];
page = require('webpage').create();
if (args[2] !== undefined) {
timeout = parseInt(args[2], 10);
}
// Route `console.log()` calls from within the Page context to the main Phantom context (i.e. current `this`)
page.onConsoleMessage = function(msg) {
console.log(msg);
};
page.onInitialized = function() {
page.evaluate(addLogging);
};
page.onCallback = function(message) {
var result,
failed;
if (message) {
if (message.name === 'QUnit.done') {
result = message.data;
failed = !result || !result.total || result.failed;
if (!result.total) {
console.error('No tests were executed. Are you loading tests asynchronously?');
}
phantom.exit(failed ? 1 : 0);
}
}
};
page.open(url, function(status) {
if (status !== 'success') {
console.error('Unable to access network: ' + status);
phantom.exit(1);
} else {
// Cannot do this verification with the 'DOMContentLoaded' handler because it
// will be too late to attach it if a page does not have any script tags.
var qunitMissing = page.evaluate(function() { return (typeof QUnit === 'undefined' || !QUnit); });
if (qunitMissing) {
console.error('The `QUnit` object is not present on this page.');
phantom.exit(1);
}
// Set a timeout on the test running, otherwise tests with async problems will hang forever
if (typeof timeout === 'number') {
setTimeout(function() {
console.error('The specified timeout of ' + timeout + ' seconds has expired. Aborting...');
phantom.exit(1);
}, timeout * 1000);
}
// Do nothing... the callback mechanism will handle everything!
}
});
function addLogging() {
window.document.addEventListener('DOMContentLoaded', function() {
var currentTestAssertions = [];
QUnit.log(function(details) {
var response;
// Ignore passing assertions
if (details.result) {
return;
}
response = details.message || '';
if (typeof details.expected !== 'undefined') {
if (response) {
response += ', ';
}
response += 'expected: ' + details.expected + ', but was: ' + details.actual;
}
if (details.source) {
response += "\n" + details.source;
}
currentTestAssertions.push('Failed assertion: ' + response);
});
QUnit.testDone(function(result) {
var i,
len,
name = '';
if (result.module) {
name += result.module + ': ';
}
name += result.name;
if (result.failed) {
console.log('\n' + 'Test failed: ' + name);
for (i = 0, len = currentTestAssertions.length; i < len; i++) {
console.log(' ' + currentTestAssertions[i]);
}
}
currentTestAssertions.length = 0;
});
QUnit.done(function(result) {
console.log('\n' + 'Took ' + result.runtime + 'ms to run ' + result.total + ' tests. ' + result.passed + ' passed, ' + result.failed + ' failed.');
if (typeof window.callPhantom === 'function') {
window.callPhantom({
'name': 'QUnit.done',
'data': result
});
}
});
}, false);
}
})();

530
tests/qunit/editor/js/utils.js
View File

@@ -1,299 +1,339 @@
function fontFace(face) {
if (tinymce.isOpera) {
return "'" + face + "'";
} else {
return face;
}
}
function findContainer(selector) {
var container;
if (tinymce.is(selector, 'string')) {
container = editor.dom.select(selector)[0];
} else {
container = selector;
}
if (container.firstChild) {
container = container.firstChild;
}
return container;
}
function setSelection(startSelector, startOffset, endSelector, endOffset) {
if (!endSelector) {
endSelector = startSelector;
endOffset = startOffset;
}
var startContainer = findContainer(startSelector);
var endContainer = findContainer(endSelector);
var rng = editor.dom.createRng();
function setRange(container, offset, start) {
offset = offset || 0;
if (offset === 'after') {
if (start) {
rng.setStartAfter(container);
} else {
rng.setEndAfter(container);
}
return;
} else if (offset === 'afterNextCharacter') {
container = container.nextSibling;
offset = 1;
}
if (start) {
rng.setStart(container, offset);
(function() {
function fontFace(face) {
if (tinymce.isOpera) {
return "'" + face + "'";
} else {
rng.setEnd(container, offset);
return face;
}
}
setRange(startContainer, startOffset, true);
setRange(endContainer, endOffset, false);
editor.selection.setRng(rng);
}
function initWhenTinyAndRobotAreReady(initTinyFunction) {
function loaded() {
QUnit.start();
function findContainer(selector) {
var container;
if (tinymce.is(selector, 'string')) {
container = editor.dom.select(selector)[0];
} else {
container = selector;
}
if (container.firstChild) {
container = container.firstChild;
}
return container;
}
tinymce.on('AddEditor', function(e) {
e.editor.on('Init', function() {
loaded();
});
});
function setSelection(startSelector, startOffset, endSelector, endOffset) {
if (!endSelector) {
endSelector = startSelector;
endOffset = startOffset;
}
var startContainer = findContainer(startSelector);
var endContainer = findContainer(endSelector);
var rng = editor.dom.createRng();
window.robot.onload(initTinyFunction);
}
function setRange(container, offset, start) {
offset = offset || 0;
function trimContent(content) {
return content.replace(/^<p>&nbsp;<\/p>\n?/, '').replace(/\n?<p>&nbsp;<\/p>$/, '');
}
if (offset === 'after') {
if (start) {
rng.setStartAfter(container);
} else {
rng.setEndAfter(container);
}
return;
} else if (offset === 'afterNextCharacter') {
container = container.nextSibling;
offset = 1;
}
if (start) {
rng.setStart(container, offset);
} else {
rng.setEnd(container, offset);
}
}
/**
* Fakes a key event.
*
* @param {Element/String} e DOM element object or element id to send fake event to.
* @param {String} na Event name to fake like "keydown".
* @param {Object} o Optional object with data to send with the event like keyCode and charCode.
*/
function fakeKeyEvent(e, na, o) {
var ev;
o = tinymce.extend({
keyCode : 13,
charCode : 0
}, o);
e = tinymce.DOM.get(e);
if (e.fireEvent) {
ev = document.createEventObject();
tinymce.extend(ev, o);
e.fireEvent('on' + na, ev);
return;
setRange(startContainer, startOffset, true);
setRange(endContainer, endOffset, false);
editor.selection.setRng(rng);
}
if (document.createEvent) {
try {
// Fails in Safari
ev = document.createEvent('KeyEvents');
ev.initKeyEvent(na, true, true, window, false, false, false, false, o.keyCode, o.charCode);
} catch (ex) {
ev = document.createEvent('Events');
ev.initEvent(na, true, true);
function trimContent(content) {
return content.replace(/^<p>&nbsp;<\/p>\n?/, '').replace(/\n?<p>&nbsp;<\/p>$/, '');
}
/**
* Fakes a key event.
*
* @param {Element/String} e DOM element object or element id to send fake event to.
* @param {String} na Event name to fake like "keydown".
* @param {Object} o Optional object with data to send with the event like keyCode and charCode.
*/
function fakeKeyEvent(e, na, o) {
var ev;
o = tinymce.extend({
keyCode : 13,
charCode : 0
}, o);
e = tinymce.DOM.get(e);
if (e.fireEvent) {
ev = document.createEventObject();
tinymce.extend(ev, o);
e.fireEvent('on' + na, ev);
return;
}
if (document.createEvent) {
try {
// Fails in Safari
ev = document.createEvent('KeyEvents');
ev.initKeyEvent(na, true, true, window, false, false, false, false, o.keyCode, o.charCode);
} catch (ex) {
ev = document.createEvent('Events');
ev.initEvent(na, true, true);
ev.keyCode = o.keyCode;
ev.charCode = o.charCode;
}
} else {
ev = document.createEvent('UIEvents');
if (ev.initUIEvent)
ev.initUIEvent(na, true, true, window, 1);
ev.keyCode = o.keyCode;
ev.charCode = o.charCode;
}
} else {
ev = document.createEvent('UIEvents');
if (ev.initUIEvent)
ev.initUIEvent(na, true, true, window, 1);
ev.keyCode = o.keyCode;
ev.charCode = o.charCode;
e.dispatchEvent(ev);
}
e.dispatchEvent(ev);
}
function normalizeRng(rng) {
if (rng.startContainer.nodeType == 3) {
if (rng.startOffset == 0)
rng.setStartBefore(rng.startContainer);
else if (rng.startOffset >= rng.startContainer.nodeValue.length - 1)
rng.setStartAfter(rng.startContainer);
}
function normalizeRng(rng) {
if (rng.startContainer.nodeType == 3) {
if (rng.startOffset == 0)
rng.setStartBefore(rng.startContainer);
else if (rng.startOffset >= rng.startContainer.nodeValue.length - 1)
rng.setStartAfter(rng.startContainer);
if (rng.endContainer.nodeType == 3) {
if (rng.endOffset == 0)
rng.setEndBefore(rng.endContainer);
else if (rng.endOffset >= rng.endContainer.nodeValue.length - 1)
rng.setEndAfter(rng.endContainer);
}
return rng;
}
if (rng.endContainer.nodeType == 3) {
if (rng.endOffset == 0)
rng.setEndBefore(rng.endContainer);
else if (rng.endOffset >= rng.endContainer.nodeValue.length - 1)
rng.setEndAfter(rng.endContainer);
}
// TODO: Replace this with the new event logic in 3.5
function type(chr) {
var editor = tinymce.activeEditor, keyCode, charCode, event = tinymce.dom.Event, evt, startElm, rng;
return rng;
}
function fakeEvent(target, type, evt) {
editor.dom.fire(target, type, evt);
}
// TODO: Replace this with the new event logic in 3.5
function type(chr) {
var editor = tinymce.activeEditor, keyCode, charCode, event = tinymce.dom.Event, evt, startElm, rng;
function fakeEvent(target, type, evt) {
editor.dom.fire(target, type, evt);
}
// Numeric keyCode
if (typeof(chr) == "number") {
charCode = keyCode = chr;
} else if (typeof(chr) == "string") {
// String value
if (chr == '\b') {
keyCode = 8;
charCode = chr.charCodeAt(0);
} else if (chr == '\n') {
keyCode = 13;
charCode = chr.charCodeAt(0);
// Numeric keyCode
if (typeof(chr) == "number") {
charCode = keyCode = chr;
} else if (typeof(chr) == "string") {
// String value
if (chr == '\b') {
keyCode = 8;
charCode = chr.charCodeAt(0);
} else if (chr == '\n') {
keyCode = 13;
charCode = chr.charCodeAt(0);
} else {
charCode = chr.charCodeAt(0);
keyCode = charCode;
}
} else {
charCode = chr.charCodeAt(0);
keyCode = charCode;
evt = chr;
}
} else {
evt = chr;
}
evt = evt || {keyCode: keyCode, charCode: charCode};
evt = evt || {keyCode: keyCode, charCode: charCode};
startElm = editor.selection.getStart();
fakeEvent(startElm, 'keydown', evt);
fakeEvent(startElm, 'keypress', evt);
startElm = editor.selection.getStart();
fakeEvent(startElm, 'keydown', evt);
fakeEvent(startElm, 'keypress', evt);
if (!evt.isDefaultPrevented()) {
if (keyCode == 8) {
if (editor.getDoc().selection) {
rng = editor.getDoc().selection.createRange();
if (!evt.isDefaultPrevented()) {
if (keyCode == 8) {
if (editor.getDoc().selection) {
rng = editor.getDoc().selection.createRange();
if (rng.text.length === 0) {
rng.moveStart('character', -1);
rng.select();
}
rng.execCommand('Delete', false, null);
} else {
rng = editor.selection.getRng();
if (rng.startContainer.nodeType == 1 && rng.collapsed) {
var nodes = rng.startContainer.childNodes, lastNode = nodes[nodes.length - 1];
// If caret is at <p>abc|</p> and after the abc text node then move it to the end of the text node
// Expand the range to include the last char <p>ab[c]</p> since IE 11 doesn't delete otherwise
if (rng.startOffset >= nodes.length - 1 && lastNode && lastNode.nodeType == 3 && lastNode.data.length > 0) {
rng.setStart(lastNode, lastNode.data.length - 1);
rng.setEnd(lastNode, lastNode.data.length);
editor.selection.setRng(rng);
if (rng.text.length === 0) {
rng.moveStart('character', -1);
rng.select();
}
rng.execCommand('Delete', false, null);
} else {
rng = editor.selection.getRng();
if (rng.startContainer.nodeType == 1 && rng.collapsed) {
var nodes = rng.startContainer.childNodes, lastNode = nodes[nodes.length - 1];
// If caret is at <p>abc|</p> and after the abc text node then move it to the end of the text node
// Expand the range to include the last char <p>ab[c]</p> since IE 11 doesn't delete otherwise
if (rng.startOffset >= nodes.length - 1 && lastNode && lastNode.nodeType == 3 && lastNode.data.length > 0) {
rng.setStart(lastNode, lastNode.data.length - 1);
rng.setEnd(lastNode, lastNode.data.length);
editor.selection.setRng(rng);
}
}
editor.getDoc().execCommand('Delete', false, null);
}
} else if (typeof(chr) == 'string') {
rng = editor.selection.getRng(true);
editor.getDoc().execCommand('Delete', false, null);
}
} else if (typeof(chr) == 'string') {
rng = editor.selection.getRng(true);
if (rng.startContainer.nodeType == 3 && rng.collapsed) {
rng.startContainer.insertData(rng.startOffset, chr);
rng.setStart(rng.startContainer, rng.startOffset + 1);
rng.collapse(true);
editor.selection.setRng(rng);
} else {
rng.insertNode(editor.getDoc().createTextNode(chr));
if (rng.startContainer.nodeType == 3 && rng.collapsed) {
rng.startContainer.insertData(rng.startOffset, chr);
rng.setStart(rng.startContainer, rng.startOffset + 1);
rng.collapse(true);
editor.selection.setRng(rng);
} else {
rng.insertNode(editor.getDoc().createTextNode(chr));
}
}
}
fakeEvent(startElm, 'keyup', evt);
}
fakeEvent(startElm, 'keyup', evt);
}
function cleanHtml(html) {
html = html.toLowerCase().replace(/[\r\n]+/gi, '');
html = html.replace(/ (sizcache[0-9]+|sizcache|nodeindex|sizset[0-9]+|sizset|data\-mce\-expando|data\-mce\-selected)="[^"]*"/gi, '');
html = html.replace(/<span[^>]+data-mce-bogus[^>]+>[\u200B\uFEFF]+<\/span>|<div[^>]+data-mce-bogus[^>]+><\/div>/gi, '');
html = html.replace(/ style="([^"]+)"/gi, function(val1, val2) {
val2 = val2.replace(/;$/, '');
return ' style="' + val2.replace(/\:([^ ])/g, ': $1') + ';"';
});
function cleanHtml(html) {
html = html.toLowerCase().replace(/[\r\n]+/gi, '');
html = html.replace(/ (sizcache[0-9]+|sizcache|nodeindex|sizset[0-9]+|sizset|data\-mce\-expando|data\-mce\-selected)="[^"]*"/gi, '');
html = html.replace(/<span[^>]+data-mce-bogus[^>]+>[\u200B\uFEFF]+<\/span>|<div[^>]+data-mce-bogus[^>]+><\/div>/gi, '');
return html;
}
return html;
}
function normalizeHtml(html) {
var writer = new tinymce.html.Writer();
function normalizeHtml(html) {
var writer = new tinymce.html.Writer();
new tinymce.html.SaxParser({
validate: false,
comment: writer.comment,
cdata: writer.cdata,
text: writer.text,
end: writer.end,
pi: writer.pi,
doctype: writer.doctype,
new tinymce.html.SaxParser({
validate: false,
comment: writer.comment,
cdata: writer.cdata,
text: writer.text,
end: writer.end,
pi: writer.pi,
doctype: writer.doctype,
start: function(name, attrs, empty) {
attrs.sort(function(a, b) {
if (a.name === b.name) {
return 0;
}
start: function(name, attrs, empty) {
attrs.sort(function(a, b) {
if (a.name === b.name) {
return 0;
}
return a.name > b.name ? 1 : -1;
});
return a.name > b.name ? 1 : -1;
});
writer.start(name, attrs, empty);
}
}).parse(html);
writer.start(name, attrs, empty);
return writer.getContent();
}
/**
* Measures the x, y, w, h of the specified element/control relative to the view element.
*/
function rect(ctrl) {
var outerRect, innerRect;
if (ctrl.nodeType) {
innerRect = ctrl.getBoundingClientRect();
} else {
innerRect = ctrl.getEl().getBoundingClientRect();
}
}).parse(html);
return writer.getContent();
}
outerRect = document.getElementById('view').getBoundingClientRect();
/**
* Measures the x, y, w, h of the specified element/control relative to the view element.
*/
function rect(ctrl) {
var outerRect, innerRect;
if (ctrl.nodeType) {
innerRect = ctrl.getBoundingClientRect();
} else {
innerRect = ctrl.getEl().getBoundingClientRect();
return [
Math.round(innerRect.left - outerRect.left),
Math.round(innerRect.top - outerRect.top),
Math.round(innerRect.right - innerRect.left),
Math.round(innerRect.bottom - innerRect.top)
];
}
outerRect = document.getElementById('view').getBoundingClientRect();
function size(ctrl) {
return rect(ctrl).slice(2);
}
return [
Math.round(innerRect.left - outerRect.left),
Math.round(innerRect.top - outerRect.top),
Math.round(innerRect.right - innerRect.left),
Math.round(innerRect.bottom - innerRect.top)
];
}
function resetScroll(elm) {
elm.scrollTop = 0;
elm.scrollLeft = 0;
}
function size(ctrl) {
return rect(ctrl).slice(2);
}
// Needed since fonts render differently on different platforms
function nearlyEqualRects(rect1, rect2, diff) {
diff = diff || 1;
function resetScroll(elm) {
elm.scrollTop = 0;
elm.scrollLeft = 0;
}
// Needed since fonts render differently on different platforms
function nearlyEqualRects(rect1, rect2, diff) {
diff = diff || 1;
for (var i = 0; i < 4; i++) {
if (Math.abs(rect1[i] - rect2[i]) > diff) {
deepEqual(rect1, rect2);
return;
for (var i = 0; i < 4; i++) {
if (Math.abs(rect1[i] - rect2[i]) > diff) {
deepEqual(rect1, rect2);
return;
}
}
ok(true);
}
ok(true);
}
function getFontmostWindow() {
return editor.windowManager.windows[editor.windowManager.windows.length - 1];
}
function pressArrowKey(evt) {
var dom = editor.dom, target = editor.selection.getNode();
evt = tinymce.extend({keyCode: 37}, evt);
dom.fire(target, 'keydown', evt);
dom.fire(target, 'keypress', evt);
dom.fire(target, 'keyup', evt);
}
function pressEnter(evt) {
var dom = editor.dom, target = editor.selection.getNode();
evt = tinymce.extend({keyCode: 13}, evt);
dom.fire(target, 'keydown', evt);
dom.fire(target, 'keypress', evt);
dom.fire(target, 'keyup', evt);
}
function trimBrsOnIE(html) {
return html.replace(/<br[^>]*>/gi, '');
}
window.Utils = {
fontFace: fontFace,
findContainer: findContainer,
setSelection: setSelection,
trimContent: trimContent,
fakeKeyEvent: fakeKeyEvent,
normalizeRng: normalizeRng,
type: type,
cleanHtml: cleanHtml,
normalizeHtml: normalizeHtml,
rect: rect,
size: size,
resetScroll: resetScroll,
nearlyEqualRects: nearlyEqualRects,
getFontmostWindow: getFontmostWindow,
pressArrowKey: pressArrowKey,
pressEnter: pressEnter,
trimBrsOnIE: trimBrsOnIE
};
})();

170
tests/qunit/editor/plugins/autolink.html
View File

@@ -1,170 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Automatic link tests</title>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="js/dsl.js"></script>
<script src="js/autolink.actions.js"></script>
<script src="js/states.js"></script>
<script><!--
window.robotUsesSymbols = true;
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Automatic Links", {
autostart: false,
setup: function() {
window.queue = new dsl.Queue();
}
});
if (!tinymce.isIE) {
asyncTest('Typing a HTTP URL', function() {
TypingHTTPURL.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPURL.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPURL.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPURL.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPURL.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</h1>$'));
TypingHTTPURL.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingHTTPURL.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.ephox.com">http://www.ephox.com</a>(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingEclipsedHTTPURL.inA(NonEmptyParagraph).gives(new RegExp('^<p>\\(<a href="http://www.ephox.com">http://www.ephox.com</a>\\)(\\s|&nbsp;)Test</p>$'));
TypingHTTPURLAndNewline.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="http://www.ephox.com">http://www.ephox.com</a></p><p>(Test|<a href=\"http://www.ephox.com\"></a>Test)</p>$'));
queue.done();
});
asyncTest('Typing a HTTPS URL', function() {
TypingHTTPSURL.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPSURL.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPSURL.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPSURL.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingHTTPSURL.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</h1>$'));
TypingHTTPSURL.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingHTTPSURL.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="https://www.ephox.com">https://www.ephox.com</a>(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingEclipsedHTTPSURL.inA(NonEmptyParagraph).gives(new RegExp('^<p>\\(<a href="https://www.ephox.com">https://www.ephox.com</a>\\)(\\s|&nbsp;)Test</p>$'));
TypingHTTPSURLAndNewline.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="https://www.ephox.com">https://www.ephox.com</a></p><p>(Test|<a href=\"https://www.ephox.com\"></a>Test)</p>$'));
queue.done();
});
asyncTest('Typing a SSH URL', function() {
TypingSSHURL.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingSSHURL.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingSSHURL.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingSSHURL.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingSSHURL.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</h1>$'));
TypingSSHURL.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingSSHURL.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="ssh://www.ephox.com">ssh://www.ephox.com</a>(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingEclipsedSSHURL.inA(NonEmptyParagraph).gives(new RegExp('^<p>\\(<a href="ssh://www.ephox.com">ssh://www.ephox.com</a>\\)(\\s|&nbsp;)Test</p>$'));
TypingSSHURLAndNewline.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="ssh://www.ephox.com">ssh://www.ephox.com</a></p><p>(Test|<a href=\"ssh://www.ephox.com\"></a>Test)</p>$'));
queue.done();
});
asyncTest('Typing a FTP URL', function() {
TypingFTPURL.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingFTPURL.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingFTPURL.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingFTPURL.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingFTPURL.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</h1>$'));
TypingFTPURL.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingFTPURL.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="ftp://www.ephox.com">ftp://www.ephox.com</a>(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingEclipsedFTPURL.inA(NonEmptyParagraph).gives(new RegExp('^<p>\\(<a href="ftp://www.ephox.com">ftp://www.ephox.com</a>\\)(\\s|&nbsp;)Test</p>$'));
TypingFTPURLAndNewline.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="ftp://www.ephox.com">ftp://www.ephox.com</a></p><p>(Test|<a href=\"ftp://www.ephox.com\"></a>Test)</p>$'));
queue.done();
});
asyncTest('Typing a WWW URL', function() {
TypingWWWURL.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingWWWURL.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingWWWURL.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingWWWURL.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</p>$'));
TypingWWWURL.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</h1>$'));
TypingWWWURL.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingWWWURL.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.ephox.com">www.ephox.com</a>(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingEclipsedWWWURL.inA(NonEmptyParagraph).gives(new RegExp('^<p>\\(<a href="http://www.ephox.com">www.ephox.com</a>\\)(\\s|&nbsp;)Test</p>$'));
TypingWWWURLAndNewline.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="http://www.ephox.com">www.ephox.com</a></p><p>(Test|<a href=\"http://www.ephox.com\"></a>Test)</p>$'));
queue.done();
});
asyncTest('Typing a WWW URL with end dot', function() {
TypingWWWURLWithEndDot.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</p>$'));
TypingWWWURLWithEndDot.inA(ParagraphWithMarginLeft).gives(new RegExp('^<p style="margin-left: 60px;"><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</p>$'));
TypingWWWURLWithEndDot.inA(ParagraphWithPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px;"><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</p>$'));
TypingWWWURLWithEndDot.inA(ParagraphWithMarginAndPaddingLeft).gives(new RegExp('^<p style="padding-left: 60px; margin-left: 60px;"><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</p>$'));
TypingWWWURLWithEndDot.inA(NonEmptyHeading).gives(new RegExp('^<h1><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</h1>$'));
TypingWWWURLWithEndDot.inA(TableCellWithoutBrs2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test</td><td>&nbsp;</td></tr></tbody></table>$'));
TypingWWWURLWithEndDot.inA(TableCellWithBrsFirstLine2).gives(new RegExp('^<table><tbody><tr><td><a href="http://www.site.com">www.site.com</a>.(\\s|&nbsp;)Test<br />Line 2</td><td>&nbsp;</td></tr></tbody></table>$'));
queue.done();
});
asyncTest('Typing a mail address', function() {
TypingMailAddr.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="mailto:user@domain.com">user@domain.com</a>(\\s|&nbsp;)Test</p>$'));
TypingDashedMailAddr.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="mailto:first-last@domain.com">first-last@domain.com</a>(\\s|&nbsp;)Test</p>$'));
queue.done();
});
asyncTest('Typing a mail address with protocol', function() {
TypingMailAddrWithProtocol.inA(NonEmptyParagraph).gives(new RegExp('^<p><a href="mailto:user@domain.com">mailto:user@domain.com</a>(\\s|&nbsp;)Test</p>$'));
queue.done();
});
} else {
test("IE has built in support", function() {
ok(true, "Skipped");
});
}
var initTinyFunction = function(){
tinymce.init({
mode : "exact",
elements : "elm1",
plugins : "autolink",
add_unload_trigger : false,
webkit_fake_resize: false,
theme_advanced_styles : 'test1=test1;test2=test2',
valid_styles : {
'*' : 'text-align,padding-left,color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
indent : 0,
init_instance_callback : function(ed) {
editor = ed;
}
});
}
--></script>
</head>
<body>
<h1 id="qunit-header">Automatic link tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
</div>
<script src="../js/jsrobot/robot.js"></script>
<script>
initWhenTinyAndRobotAreReady(initTinyFunction);
</script>
</body>
</html>

62
tests/qunit/editor/plugins/autosave.html → tests/qunit/editor/plugins/autosave.js
View File

@@ -1,23 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for the Autosave plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var editor;
module("tinymce.plugins.Autosave", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Autosave plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
plugins: 'autosave',
autosave_ask_before_unload: false,
init_instance_callback: function(ed) {
window.editor = ed;
editor.plugins.autosave.removeDraft();
QUnit.start();
}
});
}
});
test("isEmpty true", function() {
@@ -75,30 +72,3 @@ test("hasDraft/storeDraft/restoreDraft", function() {
editor.plugins.autosave.restoreDraft();
equal(editor.getContent(), '<p>X</p>');
});
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
plugins: 'autosave',
autosave_ask_before_unload: false,
init_instance_callback: function(ed) {
editor = ed;
editor.plugins.autosave.removeDraft();
QUnit.start();
}
});
</script>
<h1 id="qunit-header">Unit tests for the Table plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

103
tests/qunit/editor/plugins/fullpage.html → tests/qunit/editor/plugins/fullpage.js
View File

@@ -1,42 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<title>Fullpage plugin tests</title>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
module("tinymce.plugins.Fullpage", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
tinymce.init({
selector: "textarea",
plugins: "fullpage",
add_unload_trigger: false,
skin: false,
valid_styles: {
'*': 'text-align,padding-left,color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
indent: 0,
setup: function(ed) {
ed.on('NodeChange', false);
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
},
module("Fullpage plugin", {
autostart: false,
teardown: function() {
editor.getBody().dir = 'ltr';
}
});
function normalizeHTML(html) {
return html.replace(/\s/g, '');
}
function hasLink(href) {
var links = editor.getDoc().getElementsByTagName('link');
for (var i = 0; i < links.length; i++) {
if (links[i].href.indexOf('/' + href) != -1) {
return true;
}
}
}
test('Keep header/footer intact', function() {
expect(2);
function normalizeHTML(html) {
return html.replace(/\s/g, '');
}
editor.setContent('<html><body><p>Test</p>');
equal(normalizeHTML(editor.getContent()), '<html><body><p>Test</p>', 'Invalid HTML content is still editable.');
@@ -86,12 +82,22 @@ test('fullpage_hide_in_source_view: false', function() {
equal(editor.getContent({source_view: true}), '<p>1</p>');
});
test('fullpage link elements', function() {
test('link elements', function() {
editor.setContent('<html><head><link rel="stylesheet" href="a.css"><link rel="something"></head><body><p>c</p></body></html>');
equal(editor.getContent(), '<html><head><link rel="stylesheet" href="a.css"><link rel="something"></head><body>\n<p>c</p>\n</body></html>');
});
test('fullpage add/remove stylesheets', function() {
test('add/remove stylesheets', function() {
function hasLink(href) {
var links = editor.getDoc().getElementsByTagName('link');
for (var i = 0; i < links.length; i++) {
if (links[i].href.indexOf('/' + href) != -1) {
return true;
}
}
}
editor.setContent('<html><head><link rel="stylesheet" href="a.css"></head><body><p>c</p></body></html>');
ok(hasLink("a.css"));
ok(!hasLink("b.css"));
@@ -117,38 +123,3 @@ test('fullpage add/remove stylesheets', function() {
ok(!hasLink("b.css"));
ok(!hasLink("c.css"));
});
tinymce.init({
mode : "exact",
elements : "elm1",
plugins : "fullpage",
add_unload_trigger : false,
valid_styles : {
'*' : 'text-align,padding-left,color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
indent : 0,
setup: function(ed) {
ed.on('NodeChange', false);
},
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Fullpage plugin tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
</body>
</html>

126
tests/qunit/editor/plugins/jquery_plugin.html
View File

@@ -1,126 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>jQuery Plugin tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1");
</script>
<script src="../../js/tinymce/classes/jquery.tinymce.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("jQuery plugin", {
autostart: false
});
test("Get contents using jQuery", function() {
expect(4);
tinymce.get('elm1').setContent('<p>Editor 1</p>');
equal($('#elm1').html(), '<p>Editor 1</p>');
equal($('#elm1').val(), '<p>Editor 1</p>');
equal($('#elm1').attr('value'), '<p>Editor 1</p>');
equal($('#elm1').text(), 'Editor 1');
});
test("Set contents using jQuery", function() {
expect(4);
$('#elm1').html('Test 1');
equal($('#elm1').html(), '<p>Test 1</p>');
$('#elm1').val('Test 2');
equal($('#elm1').html(), '<p>Test 2</p>');
$('#elm1').text('Test 3');
equal($('#elm1').html(), '<p>Test 3</p>');
$('#elm1').attr('value', 'Test 4');
equal($('#elm1').html(), '<p>Test 4</p>');
});
test("append/prepend contents using jQuery", function() {
expect(2);
tinymce.get('elm1').setContent('<p>Editor 1</p>');
$('#elm1').append('<p>Test 1</p>');
equal($('#elm1').html(), '<p>Editor 1</p>\n<p>Test 1</p>');
$('#elm1').prepend('<p>Test 2</p>');
equal($('#elm1').html(), '<p>Test 2</p>\n<p>Editor 1</p>\n<p>Test 1</p>');
});
test("Find using :tinymce selector", function() {
expect(1);
equal($('textarea:tinymce').length, 2);
});
test("Set contents using :tinymce selector", function() {
expect(3);
$('textarea:tinymce').val('Test 1');
equal($('#elm1').val(), '<p>Test 1</p>');
equal($('#elm2').val(), '<p>Test 1</p>');
equal($('#elm3').val(), 'Textarea');
});
test("Get contents using :tinymce selector", function() {
expect(1);
$('textarea:tinymce').val('Test get');
equal($('textarea:tinymce').val(), '<p>Test get</p>');
});
QUnit.stop();
$(function() {
$('textarea.tinymce').tinymce({
// Location of TinyMCE script
script_url : location.search.indexOf('min=true') > 0 ? '../../js/tinymce/tinymce.min.js' : '../../js/tinymce/tinymce.js',
// General options
plugins : "pagebreak,layer,table,save,emoticons,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,template",
// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emoticons,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
init_instance_callback : function(ed) {
var ed1 = tinymce.get('elm1'), ed2 = tinymce.get('elm2');
// When both editors are initialized
if (ed1 && ed1.initialized && ed2 && ed2.initialized)
QUnit.start();
}
});
});
</script>
</head>
<body>
<h1 id="qunit-header">TinyMCE jQuery plugin tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1" class="tinymce">Editor 1</textarea>
<textarea id="elm2" name="elm2" class="tinymce">Editor 2</textarea>
<textarea id="elm3" name="elm3">Textarea</textarea>
</div>
</body>
</html>

96
tests/qunit/editor/plugins/jquery_plugin.js vendored Normal file
View File

@@ -0,0 +1,96 @@
module("tinymce.plugins.jQuery", {
setupModule: function() {
document.getElementById('view').innerHTML = (
'<textarea id="elm1"></textarea>' +
'<textarea id="elm2"></textarea>' +
'<textarea id="elm3">Textarea</textarea>'
);
QUnit.stop();
$(function() {
$('#elm1,#elm2').tinymce({
plugins: [
"pagebreak,layer,table,save,emoticons,insertdatetime,preview,media,searchreplace",
"print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,template"
],
init_instance_callback: function() {
var ed1 = tinymce.get('elm1'), ed2 = tinymce.get('elm2');
// When both editors are initialized
if (ed1 && ed1.initialized && ed2 && ed2.initialized) {
QUnit.start();
}
}
});
});
}
});
test("Get editor instance", function() {
equal($('#elm1').tinymce().id, 'elm1');
equal($('#elm2').tinymce().id, 'elm2');
equal($('#elm3').tinymce(), null);
});
test("Get contents using jQuery", function() {
expect(4);
tinymce.get('elm1').setContent('<p>Editor 1</p>');
equal($('#elm1').html(), '<p>Editor 1</p>');
equal($('#elm1').val(), '<p>Editor 1</p>');
equal($('#elm1').attr('value'), '<p>Editor 1</p>');
equal($('#elm1').text(), 'Editor 1');
});
test("Set contents using jQuery", function() {
expect(4);
$('#elm1').html('Test 1');
equal($('#elm1').html(), '<p>Test 1</p>');
$('#elm1').val('Test 2');
equal($('#elm1').html(), '<p>Test 2</p>');
$('#elm1').text('Test 3');
equal($('#elm1').html(), '<p>Test 3</p>');
$('#elm1').attr('value', 'Test 4');
equal($('#elm1').html(), '<p>Test 4</p>');
});
test("append/prepend contents using jQuery", function() {
expect(2);
tinymce.get('elm1').setContent('<p>Editor 1</p>');
$('#elm1').append('<p>Test 1</p>');
equal($('#elm1').html(), '<p>Editor 1</p>\n<p>Test 1</p>');
$('#elm1').prepend('<p>Test 2</p>');
equal($('#elm1').html(), '<p>Test 2</p>\n<p>Editor 1</p>\n<p>Test 1</p>');
});
test("Find using :tinymce selector", function() {
expect(1);
equal($('textarea:tinymce').length, 2);
});
test("Set contents using :tinymce selector", function() {
expect(3);
$('textarea:tinymce').val('Test 1');
equal($('#elm1').val(), '<p>Test 1</p>');
equal($('#elm2').val(), '<p>Test 1</p>');
equal($('#elm3').val(), 'Textarea');
});
test("Get contents using :tinymce selector", function() {
expect(1);
$('textarea:tinymce').val('Test get');
equal($('textarea:tinymce').val(), '<p>Test get</p>');
});

52
tests/qunit/editor/plugins/js/autolink.actions.js
View File

@@ -1,52 +0,0 @@
function fakeTypeAURL(url) {
return function(callback) {
// type the URL and then press the space bar
tinymce.execCommand('mceInsertContent', false, url);
window.robot.type(32, false, callback, editor.selection.getNode());
};
}
function fakeTypeAnEclipsedURL(url) {
return function(callback) {
// type the URL and then type ')'
tinymce.execCommand('mceInsertContent', false, '(' + url);
window.robot.typeSymbol(")", function() {
window.robot.type(32, false, callback, editor.selection.getNode());
}, editor.selection.getNode());
};
}
function fakeTypeANewlineURL(url) {
return function(callback) {
// type the URL and then press the enter key
tinymce.execCommand('mceInsertContent', false, url);
window.robot.type('\n', false, callback, editor.selection.getNode());
};
}
createAction('Typing HTTP URL', fakeTypeAURL('http://www.ephox.com'));
createAction('Typing HTTPS URL', fakeTypeAURL('https://www.ephox.com'));
createAction('Typing SSH URL', fakeTypeAURL('ssh://www.ephox.com'));
createAction('Typing FTP URL', fakeTypeAURL('ftp://www.ephox.com'));
createAction('Typing WWW URL', fakeTypeAURL('www.ephox.com'));
createAction('Typing WWW URL With End Dot', fakeTypeAURL('www.site.com.'));
createAction('Typing Mail Addr', fakeTypeAURL('user@domain.com'));
createAction('Typing Mail Addr With Protocol', fakeTypeAURL('mailto:user@domain.com'));
createAction('Typing Dashed Mail Addr', fakeTypeAURL('first-last@domain.com'));
createAction('Typing Eclipsed HTTP URL', fakeTypeAnEclipsedURL('http://www.ephox.com'));
createAction('Typing Eclipsed HTTPS URL', fakeTypeAnEclipsedURL('https://www.ephox.com'));
createAction('Typing Eclipsed SSH URL', fakeTypeAnEclipsedURL('ssh://www.ephox.com'));
createAction('Typing Eclipsed FTP URL', fakeTypeAnEclipsedURL('ftp://www.ephox.com'));
createAction('Typing Eclipsed WWW URL', fakeTypeAnEclipsedURL('www.ephox.com'));
createAction('Typing HTTP URL And Newline', fakeTypeANewlineURL('http://www.ephox.com'));
createAction('Typing HTTPS URL And Newline', fakeTypeANewlineURL('https://www.ephox.com'));
createAction('Typing SSH URL And Newline', fakeTypeANewlineURL('ssh://www.ephox.com'));
createAction('Typing FTP URL And Newline', fakeTypeANewlineURL('ftp://www.ephox.com'));
createAction('Typing WWW URL And Newline', fakeTypeANewlineURL('www.ephox.com'));
createAction('Applying OL', 'InsertOrderedList');
createAction('Applying UL', 'InsertUnorderedList');
createAction('Indenting', 'Indent');
createAction('Outdenting', 'Outdent');
createAction('Typing Enter', fakeKeyPressAction('\n'));
createAction('Typing Tab', fakeKeyPressAction('\t'));
createAction('Typing Shift Tab', fakeKeyPressAction('\t', true));

138
tests/qunit/editor/plugins/js/dsl.js
View File

@@ -1,138 +0,0 @@
var editor;
function getFunctionName(func) {
if (func.name && func.name != "") {
return func.name;
} else if (typeof func == "function" || typeof func == "object") {
var fName = ("" + func).match(/function\s*([\w\$]+)\s*\(/);
if (fName !== null && fName != "") {
return fName[1];
} else {
for (var v in window) {
if (window[v] === func) {
func.name = v;
return v;
}
}
}
}
}
function assertState(expected, message) {
var content = editor.getContent().replace(/[\n\r]/g, '');
if (expected && expected.replace) expected = expected.replace(/[\n\r]/g, '');
// Safari reports "function", while Firefox and IE report "object"
if (typeof expected == "function" || typeof expected == "object") {
if (expected.test(content))
equal(content, content, message);
else
equal(content, expected.toString(), message);
} else {
equal(content, expected, message);
}
}
tinymce.create('dsl.Queue', {
Queue: function() {
this.queue = [];
},
add: function(task) {
this.queue.push(task);
},
next: function() {
if (this.queue.length > 0) {
var task = this.queue.shift();
task();
return true;
} else {
QUnit.start();
return false;
}
},
done: function() {
expect(this.queue.length);
this.next();
}
});
tinymce.create('dsl.Action', {
Action: function(name, action) {
this.name = name;
this.a = this.curryPreposition('a');
this.inA = this.curryPreposition('in a');
this.to = this.curryPreposition('to');
if (tinymce.is(action, 'string')) {
this.action = function(callback) {
editor.execCommand(action);
callback();
};
} else {
this.action = action;
}
},
curryPreposition: function(preposition) {
return function(state) {
return this.go(state, preposition);
};
},
go: function(state, preposition) {
var message = this.name + " " + preposition + " " + getFunctionName(state);
var action = this.action;
var actionPerformed = false;
function defer(callback) {
return function() {
var args = arguments;
queue.add(function() {
if (actionPerformed) {
callback.apply(undefined, args);
queue.next();
return;
}
editor.focus();
state();
action(function() {
actionPerformed = true;
callback.apply(undefined, args);
queue.next();
});
});
return this;
};
}
var dslState = {
gives: defer(function(expected) {
assertState(expected, message);
}),
enablesState: defer(function(state) {
ok(editor.queryCommandState(state), message + " enables " + state + " command");
}),
disablesState: defer(function(state) {
ok(!editor.queryCommandState(state), message + " disables " + state + " command");
})
};
dslState.andGives = dslState.gives;
return dslState;
}
});
// Action Utilities
function fakeKeyPressAction(keyCode, shiftKey) {
return function(callback) {
setTimeout(function() {
window.robot.type(keyCode, shiftKey, callback, editor.selection.getNode());
}, 1);
};
}
function createAction(name, action) {
window[name.replace(/\s+/g, '')] = new dsl.Action(name, action);
}

176
tests/qunit/editor/plugins/js/states.js
View File

@@ -1,176 +0,0 @@
function createState(content, startSelector, startOffset, endSelector, endOffset) {
return function() {
editor.setContent(content);
setSelection(startSelector, startOffset, endSelector, endOffset);
};
}
/** Collapsed Selection States **/
function EmptyParagraph() {
var body = editor.getBody();
while (body.firstChild) {
editor.dom.remove(body.firstChild);
}
var p = body.ownerDocument.createElement('p');
p.appendChild(body.ownerDocument.createTextNode(''));
body.appendChild(p, body);
setSelection(p.firstChild, 0);
}
function EmptyHeading() {
EmptyParagraph();
editor.dom.rename(editor.getBody().firstChild, 'h1');
setSelection(editor.getBody().firstChild.firstChild, 0);
}
function TextAfterUL() {
editor.setContent('<ul><li>Item</li></ul>Test');
setSelection(editor.dom.getRoot().lastChild, 2);
}
function TextAfterOL() {
editor.setContent('<ol><li>Item</li></ol>Test');
setSelection(editor.dom.getRoot().lastChild, 2);
}
EmptyContent = createState('', 'body', 0);
PlainText = createState('Test', 'body', 0);
NonEmptyParagraph = createState('<p>Test</p>', 'p', 0);
ParagraphWithMarginLeft = createState('<p style="margin-left: 60px;">Test</p>', 'p', 0);
ParagraphWithPaddingLeft = createState('<p style="padding-left: 60px;">Test</p>', 'p', 0);
ParagraphWithMarginAndPaddingLeft = createState('<p style="margin-left: 60px; padding-left: 60px;">Test</p>', 'p', 0);
CenteredListItem = createState('<ul><li style="text-align: center;">Item1</li><li>Item2</li></ul>', 'li:nth-child(1)', 2);
ItemInCenteredList = createState('<ul style="text-align: center;"><li>Item1</li><li>Item2</li></ul>', 'li:nth-child(1)', 2);
RightAlignedListItem = createState('<ul><li style="text-align: right;">Item1</li><li>Item2</li></ul>', 'li:nth-child(1)', 2);
ItemInRightAlignedList = createState('<ul style="text-align: right;"><li>Item1</li><li>Item2</li></ul>', 'li:nth-child(1)', 2);
ParagraphBetweenOrderedLists = createState('<ol><li>Item1</li></ol><p>Test</p><ol><li>Item2</li></ol>', 'p', 2);
ParagraphBetweenUnorderedLists = createState('<ul><li>Item1</li></ul><p>Test</p><ul><li>Item2</li></ul>', 'p', 2);
ParagraphBetweenMixedLists = createState('<ol><li>Item1</li></ol><p>Test</p><ul><li>Item2</li></ul>', 'p', 2);
NonEmptyHeading = createState('<h1>Test</h1>', 'h1', 0);
TableCellWithoutBrs = createState('<table><tbody><tr><td>Test</td><td>&nbsp;</td></tr></tbody></table>', 'td', 4);
TableCellWithoutBrs2 = createState('<table><tbody><tr><td>Test</td><td>&nbsp;</td></tr></tbody></table>', 'td', 0);
TableCellWithBrsFirstLine = createState('<table><tbody><tr><td>Test<br>Line 2</td><td>&nbsp;</td></tr></tbody></table>', 'td', 1);
TableCellWithBrsFirstLine2 = createState('<table><tbody><tr><td>Test<br>Line 2</td><td>&nbsp;</td></tr></tbody></table>', 'td', 0);
TableCellWithBrsMiddleLine = createState('<table><tbody><tr><td>Test<br/>Line 2<br/>Line 3</td><td>&nbsp;</td></tr></tbody></table>', 'td br:nth-child(1)', 'afterNextCharacter');
TableCellWithBrsLastLine = createState('<table><tbody><tr><td>Test<br>Line 2</td><td>&nbsp;</td></tr></tbody></table>', 'td br:nth-child(1)', 'afterNextCharacter');
TableCellWithAdjacentBrsFirstLine = createState('<table><tbody><tr><td>Test<br><br>Line 2</td><td>&nbsp;</td></tr></tbody></table>', 'td', 1);
HeadingInOrderedList = createState('<ol><li><h2>Test</h2></li></ol>', 'h2', '2');
HeadingInUnorderedList = createState('<ul><li><h2>Test</h2></li></ul>', 'h2', '2');
HeadingInOrderedListBeforeParagraph = createState('<ol><li><h2>Test</h2></li></ol><p>Content<br />After</p>', 'h2', '2');
DefinitionListDescription = createState('<dl><dt>Term</dt><dd>Description</dd></dl>', 'dd', 2);
DefinitionListTerm = createState('<dl><dt>Term</dt><dd>Description</dd></dl>', 'dt', 2);
EndOfParagraphBeforeOL = createState('<p>Test</p><ol><li>Item</li></ol>', 'p', 4);
EndOfParagraphBeforeOLWithListType = createState('<p>Test</p><ol style="list-style-type: lower-alpha;"><li>Item</li></ol>', 'p', 4);
EndOfParagraphBeforeUL = createState('<p>Test</p><ul><li>Item</li></ul>', 'p', 4);
StartOfParagraphAfterOL = createState('<ol><li>Item</li></ol><p>Test</p>', 'p', 1);
StartOfParagraphAfterUL = createState('<ul><li>Item</li></ul><p>Test</p>', 'p', 1);
StartOfParagraphAfterOLWithListType = createState('<ol style="list-style-type: lower-alpha;"><li>Item</li></ol><p>Test</p>', 'p', 1);
EmptyOrderedListItem = createState('<ol><li>Before</li><li>&nbsp;</li><li>After</li></ol>', 'li:nth-child(2)', 0);
EmptyUnorderedListItem = createState('<ul><li>Before</li><li>&nbsp;</li><li>After</li></ul>', 'li:nth-child(2)', 0);
NonEmptyOrderedListItem = createState('<ol><li>Before</li><li>Test</li><li>After</li></ol>', 'li:nth-child(2)', 0);
NonEmptyUnorderedListItem = createState('<ul><li>Before</li><li>Test</li><li>After</li></ul>', 'li:nth-child(2)', 0);
NestedEmptyOrderedListItem = createState('<ol><li>Before<ol><li>&nbsp;</li></ol></li><li>After</li></ol>', 'li ol li', 0);
NestedEmptyUnorderedListItem = createState('<ul><li>Before<ul><li>&nbsp;</li></ul></li><li>After</li></ul>', 'li ul li', 0);
NestedNonEmptyOrderedListItem = createState('<ol><li>Before<ol><li>Test</li></ol></li><li>After</li></ol>', 'li ol li', 0);
NestedNonEmptyUnorderedListItem = createState('<ul><li>Before<ul><li>Test</li></ul></li><li>After</li></ul>', 'li ul li', 0);
NestedOrderedListWithMultipleItems = createState('<ol><li>Before<ol><li>Item1</li><li>Item2</li></ol></li></ol>', 'li ol li', 0);
NestedUnorderedListWithMultipleItems = createState('<ul><li>Before<ul><li>Item1</li><li>Item2</li></ul></li></ul>', 'li ul li', 0);
OrderedLowerAlphaListItem = createState('<ol style="list-style-type: lower-alpha;"><li>Item 1</li><li>Item 2</li></ol>', 'li:nth-child(2)', 0);
UnorderedSquareListItem = createState('<ul style="list-style-type: square;"><li>Item 1</li><li>Item 2</li></ul>', 'li:nth-child(2)', 0);
OrderedListItemWithNestedChild = createState('<ol><li>Item1<ol><li>Nested</li></ol></li></ol>', 'li:nth-child(1)', 2);
UnorderedListItemWithNestedChild = createState('<ul><li>Item1<ul><li>Nested</li></ul></li></ul>', 'li:nth-child(1)', 2);
OrderedListWithAdjacentNestedLists = createState('<ol><li style="list-style-type: none;"><ol><li>Item 1</li></ol></li><li>Item 2</li><li style="list-style-type: none;"><ol><li>Item 3</li></ol></li></ol>', 'li:nth-child(2)', 4);
UnorderedListWithAdjacentNestedLists = createState('<ul><li style="list-style-type: none;"><ul><li>Item 1</li></ul></li><li>Item 2</li><li style="list-style-type: none;"><ul><li>Item 3</li></ul></li></ul>', 'li:nth-child(2)', 4);
OrderedListItemWithMargin = createState('<ol><li style="margin-left: 60px;">Test</li></ol>', 'li', 0);
UnorderedListItemWithMargin = createState('<ul><li style="margin-left: 60px;">Test</li></ul>', 'li', 0);
OrderedListItemWithNestedAlphaList = createState('<ol><li>Item<ol style="list-style-type: lower-alpha;"><li>Nested</li></ol></li></ol>', 'li', 2);
/** Collapsed DIV Tests **/
OrderedListItemInsideDiv = createState('<div id="div"><ol>\n<li>Item1</li><li>Item2</li></ol></div>', 'li:nth-child(1)', 2);
UnorderedListItemInsideDiv = createState('<div id="div"><ul>\n<li>Item1</li><li>Item2</li></ul></div>', 'li:nth-child(1)', 2);
ParagraphInDiv = createState('<div><p>Item</p></div>', 'p', 2);
TextInDiv = createState('<div>Item</div>', 'div', 2);
TextWithBrsInDivFirstLine = createState('<div>Item1<br />Item2</div>', 'div', 2);
TextWithBrsInDivMiddleLine = createState('<div>Item1<br />Item2<br />Item3</div>', 'br:nth-child(1)', 'afterNextCharacter');
TextWithBrsInDivLastLine = createState('<div>Item1<br />Item2</div>', 'br:nth-child(1)', 'afterNextCharacter');
TextWithBrsInFormattingInDiv = function() {
var rng;
editor.setContent('<div><strong>Before<br /></strong>Item1<br />Item2<br />Item3</div>');
rng = editor.dom.createRng();
rng.setStart(editor.dom.select('div')[0].childNodes[1], 0);
rng.setEnd(editor.dom.select('div')[0], 6);
editor.selection.setRng(rng);
};
TextWithBrInsideFormatting = function() {
var rng;
editor.setContent('<div><em><strong>Before<br /><span class="foo">Item1</span></strong></em>Item2<br />Item3</div>');
rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].childNodes[0], 2);
rng.setEnd(editor.dom.select('div')[0], 4);
editor.selection.setRng(rng);
};
/** Expanded Selection States **/
SingleParagraphSelection = createState('<p>This is a test</p>', 'p', 5, 'p', 7);
MultipleParagraphSelection = createState('<p>This is a test</p><p>Second paragraph</p>', 'p:nth-child(1)', 5, 'p:nth-child(2)', 6);
SingleHeadingSelection = createState('<h1>This is a test</h1>', 'h1', 5, 'h1', 7);
MultipleHeadingSelection = createState('<h1>This is a test</h1><h1>Second paragraph</h1>', 'h1:nth-child(1)', 5, 'h1:nth-child(2)', 6);
SingleBlockSelection = createState('<div>This is a test</div>', 'div', 5, 'div', 7);
MultipleBlockSelection = createState('<div>This is a test</div><div>Second paragraph</div>', 'div:nth-child(1)', 5, 'div:nth-child(2)', 6);
SingleBlockWithBrSelection = createState('<div>Item1<br />Item2</div>', 'div', 3, 'br', 'afterNextCharacter');
MultipleBlockWithBrSelection = createState('<div>Item1<br />Item2</div><div>Item3</div>', 'div:nth-child(1)', 2, 'div:nth-child(2)', 3);
MultipleBlockWithBrPartialSelection = createState('<div>Item1<br />Item2</div><div>Item3<br />Item4</div>', 'div:nth-child(1)', 2, 'div:nth-child(2)', 3);
MultipleBlockWithBrPartialSelectionAtEnd = createState('<div>Item1<br />Item2</div><div>Item3<br />Item4</div>', 'div:nth-child(1) br', 'afterNextCharacter', 'div:nth-child(2) br', 'afterNextCharacter');
MultipleBlockWithEmptyDivsAllSelected = createState('<div id="start">&nbsp;</div><div>a</div><div></div><div>b</div><div></div><div id="end">&nbsp;</div>', '#start', 0, '#end', 0);
CellWithoutBrSelection = createState('<table><tbody><tr><td>Cell 1</td></tr></tbody></table>', 'td', 1, 'td', 1); //selection is a single point so it will avoid table selection bugs in ie9.
CellWithBrSingleLineSelection = createState('<table><tbody><tr><td>Cell 1<br>Line 2</td></tr></tbody></table>', 'td', 1, 'td', 4);
CellWithBrMultipleLineSelection = createState('<table><tbody><tr><td>Cell 1<br>Line 2</td></tr></tbody></table>', 'td', 1, 'td', 4);
TableCellWithTextAfterUL = createState('<table><tbody><tr><td><ul><li>Existing</li></ul><span id="start">Line1</span><br />Line2<br id="end" />Line3<br />Line4</td></tr></tbody></table>', '#start', 1, '#end', 'afterNextCharacter');
ParagraphToHeadingSelection = createState('<p>This is a test</p><h1>Second paragraph</h1>', 'p', 5, 'h1', 6);
ParagraphToBlockSelection = createState('<p>This is a test</p><div>Second paragraph</div>', 'p', 5, 'div', 6);
HeadingToParagraphSelection = createState('<h1>This is a test</h1><p>Second paragraph</p>', 'h1', 5, 'p', 6);
BlockToParagraphSelection = createState('<div>This is a test</div><p>Second paragraph</p>', 'div', 5, 'p', 6);
MultipleParagraphAndHeadingSelection = createState('<p>This is a test</p><h1>Second paragraph</h1><div>Third paragraph</div>', 'p', 5, 'div', 5);
ThreeBoldDivsWithBrSelection = createState('<div><strong>One</strong></div><div><strong>Two</strong></div><div><strong>Three<br></strong></div>', 'div:nth-child(1) strong', 2, 'div:nth-child(3) strong', 2);
SingleLiOlSelection = createState('<ol><li>Item 1</li></ol>', 'li', 1, 'li', 4);
MultiLiOlSelection = createState('<ol><li>Item 1</li><li>Item 2</li></ol>', 'li:nth-child(1)', 1, 'li:nth-child(2)', 4);
SingleLiUlSelection = createState('<ul><li>Item 1</li></ul>', 'li', 1, 'li', 4);
MultiLiUlSelection = createState('<ul><li>Item 1</li><li>Item 2</li></ul>', 'li:nth-child(1)', 1, 'li:nth-child(2)', 4);
MultiNestedLiUlSelection = createState('<ul><li style="list-style-type: none;"><ul><li>Item 1</li><li>Item 2</li></ul></li></ul>', 'li li:nth-child(1)', 1, 'li li:nth-child(2)', 4);
MultiNestedLiOlSelection = createState('<ol><li style="list-style-type: none;"><ol><li>Item 1</li><li>Item 2</li></ol></li></ol>', 'li li:nth-child(1)', 1, 'li li:nth-child(2)', 4);
IndentedOlInOlCorrectSelection = createState('<ol><li>Item 1<ol><li>Indented</li></ol></li></ol>', 'li', 1, 'li li', 4);
IndentedUlInUlCorrectSelection = createState('<ul><li>Item 1<ul><li>Indented</li></ul></li></ul>', 'li', 1, 'li li', 4);
IndentedOlInOlIncorrectSelection = createState('<ol><li>Item 1</li><ol><li>Indented</li></ol></ol>', 'li', 1, 'ol ol li', 4);
IndentedUlInUlIncorrectSelection = createState('<ul><li>Item 1</li><ul><li>Indented</li></ul></ul>', 'li', 1, 'ul ul li', 4);
IndentedOlInUlCorrectSelection = createState('<ul><li>Item 1<ol><li>Indented</li></ol></li></ul>', 'li', 1, 'li li', 4);
IndentedUlInOlCorrectSelection = createState('<ol><li>Item 1<ul><li>Indented</li></ul></li></ol>', 'li', 1, 'li li', 4);
IndentedOlInUlIncorrectSelection = createState('<ul><li>Item 1</li><ol><li>Indented</li></ol></ul>', 'li', 1, 'ul ol li', 4);
IndentedUlInOlIncorrectSelection = createState('<ol><li>Item 1</li><ul><li>Indented</li></ul></ol>', 'li', 1, 'ol ul li', 4);
// TODO: Paragraph/heading to list combinations.
ParagraphBeforeOlSelection = createState('<p>Before</p><ol><li>Item 1</li></ol>', 'p', 3, 'li', 4);
ParagraphBeforeUlSelection = createState('<p>Before</p><ul><li>Item 1</li></ul>', 'p', 3, 'li', 4);
ParagraphAfterOlSelection = createState('<ol><li>Item 1</li></ol><p>After</p>', 'li', 4, 'p', 3);
ParagraphAfterUlSelection = createState('<ul><li>Item 1</li></ul><p>After</p>', 'li', 4, 'p', 3);
ParagraphBeforeAndAfterOlSelection = createState('<p>Before</p><ol><li>Item 1</li></ol><p id="after">After</p>', 'p', 4, '#after', 3);
ParagraphBeforeAndAfterUlSelection = createState('<p>Before</p><ul><li>Item 1</li></ul><p id="after">After</p>', 'p', 4, '#after', 3);
SelectionEndingAtBr = createState('<p>Item<br>After</p>', 'p', 2, 'br', 'after');
SelectionStartingAtBr = createState('<p>Before<br>Item</p>', 'p', 'after', 'br', 'afterNextCharacter');

89
tests/qunit/editor/plugins/legacyoutput.html → tests/qunit/editor/plugins/legacyoutput.js
View File

@@ -1,130 +1,93 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for Media Plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="../js/utils.js"></script>
<script>
var editor;
module("tinymce.plugins.Legacyoutput", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Legacyoutput plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
plugins: 'legacyoutput',
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test("Font color", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('forecolor', false, '#FF0000');
equal(editor.getContent().toLowerCase(), '<p><font color="#ff0000">text</font></p>');
});
test("Font size", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('fontsize', false, 7);
equal(editor.getContent(), '<p><font size="7">text</font></p>');
});
test("Font face", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('fontname', false, "times");
equal(editor.getContent(), '<p><font face="times">text</font></p>');
});
test("Bold", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('bold');
equal(editor.getContent(), '<p><b>text</b></p>');
});
test("Italic", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('italic');
equal(editor.getContent(), '<p><i>text</i></p>');
});
test("Underline", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('underline');
equal(editor.getContent(), '<p><u>text</u></p>');
});
test("Strikethrough", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('strikethrough');
equal(editor.getContent(), '<p><strike>text</strike></p>');
});
test("Justifyleft", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('justifyleft');
equal(editor.getContent(), '<p align="left">text</p>');
});
test("Justifycenter", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('justifycenter');
equal(editor.getContent(), '<p align="center">text</p>');
});
test("Justifyright", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('justifyright');
equal(editor.getContent(), '<p align="right">text</p>');
});
test("Justifyfull", function() {
editor.setContent('<p>text</p>');
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.execCommand('justifyfull');
equal(editor.getContent(), '<p align="justify">text</p>');
});
function initTiny(settings, load) {
var default_settings = {
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
document_base_url : '/tinymce/tinymce/trunk/tests/',
plugins : 'legacyoutput',
init_instance_callback : function(ed) {
editor = ed;
load();
}
};
var settings = tinymce.extend(default_settings, settings);
tinymce.init(settings);
}
initTiny({}, QUnit.start);
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for Legacyoutput Plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>
});

357
tests/qunit/editor/plugins/lists.html → tests/qunit/editor/plugins/lists.js
View File

@@ -1,22 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for lists plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor, inlineEditor, rng;
module("tinymce.plugins.Lists", {
setupModule: function() {
document.getElementById('view').innerHTML = '<textarea id="elm1"></textarea><div id="elm2"></div>';
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
function wait() {
if (editor && inlineEditor) {
if (!QUnit.started) {
QUnit.start();
QUnit.started = true;
}
} else {
setTimeout(wait, 0);
}
}
module("tinymce.Lists", {
autostart: false,
setup: function() {
tinymce.init({
selector: '#elm1',
plugins: "lists",
add_unload_trigger: false,
skin: false,
indent: false,
schema: 'html5',
entities: 'raw',
valid_elements: 'li,ol,ul,em,strong,span,#p,div,br',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display,position,top,left'
},
disable_nodechange: true,
init_instance_callback: function(ed) {
window.editor = ed;
wait();
}
});
tinymce.init({
selector: '#elm2',
inline: true,
add_unload_trigger: false,
skin: false,
plugins: "lists",
disable_nodechange: true,
init_instance_callback: function(ed) {
window.inlineEditor = ed;
wait();
}
});
},
teardown: function() {
editor.settings.forced_root_block = 'p';
}
});
@@ -37,10 +68,10 @@ test('Apply UL list to single P', function() {
);
editor.focus();
setSelection('p', 0);
Utils.setSelection('p', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(), '<ul><li>a</li></ul>');
equal(editor.getContent(),'<ul><li>a</li></ul>');
equal(editor.selection.getNode().nodeName, 'LI');
});
@@ -50,7 +81,7 @@ test('Apply UL list to single empty P', function() {
);
editor.focus();
setSelection('p', 0);
Utils.setSelection('p', 0);
execCommand('InsertUnorderedList');
equal(trimBrs(editor.getContent({format: 'raw'})), '<ul><li></li></ul>');
@@ -65,10 +96,10 @@ test('Apply UL list to multiple Ps', function() {
);
editor.focus();
setSelection('p', 0, 'p:last', 0);
Utils.setSelection('p', 0, 'p:last', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -84,10 +115,10 @@ test('Apply OL list to single P', function() {
);
editor.focus();
setSelection('p', 0);
Utils.setSelection('p', 0);
execCommand('InsertOrderedList');
equal(editor.getContent(), '<ol><li>a</li></ol>');
equal(editor.getContent(),'<ol><li>a</li></ol>');
equal(editor.selection.getNode().nodeName, 'LI');
});
@@ -97,7 +128,7 @@ test('Apply OL list to single empty P', function() {
);
editor.focus();
setSelection('p', 0);
Utils.setSelection('p', 0);
execCommand('InsertOrderedList');
equal(trimBrs(editor.getContent({format: 'raw'})), '<ol><li></li></ol>');
@@ -112,10 +143,10 @@ test('Apply OL list to multiple Ps', function() {
);
editor.focus();
setSelection('p', 0, 'p:last', 0);
Utils.setSelection('p', 0, 'p:last', 0);
execCommand('InsertOrderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -135,10 +166,10 @@ test('Apply OL to UL list', function() {
);
editor.focus();
setSelection('li', 0, 'li:last', 0);
Utils.setSelection('li', 0, 'li:last', 0);
execCommand('InsertOrderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -158,10 +189,10 @@ test('Apply OL to UL list with collapsed selection', function() {
);
editor.focus();
setSelection('li:nth-child(2)');
Utils.setSelection('li:nth-child(2)');
execCommand('InsertOrderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -181,10 +212,10 @@ test('Apply UL to OL list', function() {
);
editor.focus();
setSelection('li', 0, 'li:last', 0);
Utils.setSelection('li', 0, 'li:last', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -204,10 +235,10 @@ test('Apply UL to OL list collapsed selection', function() {
);
editor.focus();
setSelection('li:nth-child(2)');
Utils.setSelection('li:nth-child(2)');
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -229,10 +260,10 @@ test('Apply UL to P and merge with adjacent lists', function() {
);
editor.focus();
setSelection('p', 1);
Utils.setSelection('p', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -254,10 +285,10 @@ test('Apply UL to OL and merge with adjacent lists', function() {
);
editor.focus();
setSelection('ol li', 1);
Utils.setSelection('ol li', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -279,10 +310,10 @@ test('Apply OL to P and merge with adjacent lists', function() {
);
editor.focus();
setSelection('p', 1);
Utils.setSelection('p', 1);
execCommand('InsertOrderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -304,10 +335,10 @@ test('Apply OL to UL and merge with adjacent lists', function() {
);
editor.focus();
setSelection('ul li', 1);
Utils.setSelection('ul li', 1);
execCommand('InsertOrderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -325,10 +356,10 @@ test('Apply UL list to single text line', function() {
);
editor.focus();
setSelection('body', 0);
Utils.setSelection('body', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(), '<ul><li>a</li></ul>');
equal(editor.getContent(),'<ul><li>a</li></ul>');
equal(editor.selection.getNode().nodeName, 'LI');
});
@@ -340,10 +371,10 @@ test('Apply UL list to single text line with BR', function() {
);
editor.focus();
setSelection('body', 0);
Utils.setSelection('body', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(), '<ul><li>a</li></ul>');
equal(editor.getContent(),'<ul><li>a</li></ul>');
equal(editor.selection.getNode().nodeName, 'LI');
});
@@ -403,7 +434,7 @@ test('Apply UL list to multiple formatted lines separated by BR', function() {
);
editor.focus();
setSelection('strong', 0, 'em', 0);
Utils.setSelection('strong', 0, 'em', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
@@ -521,10 +552,10 @@ test('Remove UL at single LI', function() {
);
editor.focus();
setSelection('li');
Utils.setSelection('li');
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<p>a</p>'
);
equal(editor.selection.getStart().nodeName, 'P');
@@ -540,10 +571,10 @@ test('Remove UL at start LI', function() {
);
editor.focus();
setSelection('li');
Utils.setSelection('li');
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<p>a</p>' +
'<ul>' +
'<li>b</li>' +
@@ -563,10 +594,10 @@ test('Remove UL at start empty LI', function() {
);
editor.focus();
setSelection('li');
Utils.setSelection('li');
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<p>\u00a0</p>' +
'<ul>' +
'<li>b</li>' +
@@ -586,10 +617,10 @@ test('Remove UL at middle LI', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 1);
Utils.setSelection('li:nth-child(2)', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'</ul>' +
@@ -611,10 +642,10 @@ test('Remove UL at middle empty LI', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 0);
Utils.setSelection('li:nth-child(2)', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'</ul>' +
@@ -636,10 +667,10 @@ test('Remove UL at end LI', function() {
);
editor.focus();
setSelection('li:last', 1);
Utils.setSelection('li:last', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -659,10 +690,10 @@ test('Remove UL at end empty LI', function() {
);
editor.focus();
setSelection('li:last', 0);
Utils.setSelection('li:last', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -686,10 +717,10 @@ test('Remove UL at middle LI inside parent OL', function() {
);
editor.focus();
setSelection('ul li:nth-child(2)', 1);
Utils.setSelection('ul li:nth-child(2)', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<ul>' +
@@ -722,10 +753,10 @@ test('Remove UL at middle LI inside parent OL (html5)', function() {
);
editor.focus();
setSelection('ul li:nth-child(2)', 1);
Utils.setSelection('ul li:nth-child(2)', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ul>' +
@@ -756,10 +787,10 @@ test('Remove UL with single LI in BR mode', function() {
);
editor.focus();
setSelection('li', 1);
Utils.setSelection('li', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'a'
);
equal(editor.selection.getStart().nodeName, 'BODY');
@@ -776,10 +807,10 @@ test('Remove UL with multiple LI in BR mode', function() {
);
editor.focus();
setSelection('li:first', 1, 'li:last', 1);
Utils.setSelection('li:first', 1, 'li:last', 1);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'a<br />' +
'b'
);
@@ -796,10 +827,10 @@ test('Remove empty UL between two textblocks', function() {
);
editor.focus();
setSelection('li:first', 0);
Utils.setSelection('li:first', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<div>a</div>' +
'<p>\u00a0</p>' +
'<div>b</div>'
@@ -819,10 +850,10 @@ test('Remove empty UL between two textblocks in BR mode', function() {
);
editor.focus();
setSelection('li:first', 0);
Utils.setSelection('li:first', 0);
execCommand('InsertUnorderedList');
equal(editor.getContent(),
equal(editor.getContent(),
'<div>a</div>' +
'<br />' +
'<div>b</div>'
@@ -845,10 +876,10 @@ test('Outdent inside LI in beginning of OL in LI', function() {
);
editor.focus();
setSelection('li li', 1);
Utils.setSelection('li li', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b' +
@@ -876,10 +907,10 @@ test('Outdent inside LI in middle of OL in LI', function() {
);
editor.focus();
setSelection('li li:nth-child(2)', 1);
Utils.setSelection('li li:nth-child(2)', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -910,10 +941,10 @@ test('Outdent inside LI in end of OL in LI', function() {
);
editor.focus();
setSelection('li li:last', 1);
Utils.setSelection('li li:last', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -941,10 +972,10 @@ test('Outdent inside LI in beginning of OL in OL', function() {
);
editor.focus();
setSelection('ol ol li', 1);
Utils.setSelection('ol ol li', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -970,10 +1001,10 @@ test('Outdent inside LI in middle of OL in OL', function() {
);
editor.focus();
setSelection('ol ol li:nth-child(2)', 1);
Utils.setSelection('ol ol li:nth-child(2)', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<ol>' +
@@ -1003,10 +1034,10 @@ test('Outdent inside first/last LI in inner OL', function() {
);
editor.focus();
setSelection('ol ol li:nth-child(1)', 0, 'ol ol li:nth-child(2)', 1);
Utils.setSelection('ol ol li:nth-child(1)', 0, 'ol ol li:nth-child(2)', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>1</li>' +
'<li>2</li>' +
@@ -1033,10 +1064,10 @@ test('Outdent inside first LI in inner OL where OL is single child of parent LI'
);
editor.focus();
setSelection('ol ol li:first', 0);
Utils.setSelection('ol ol li:first', 0);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b' +
@@ -1062,10 +1093,10 @@ test('Outdent inside LI in end of OL in OL', function() {
);
editor.focus();
setSelection('ol ol li:last', 1);
Utils.setSelection('ol ol li:last', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<ol>' +
@@ -1090,10 +1121,10 @@ test('Outdent inside only child LI in OL in OL', function() {
);
editor.focus();
setSelection('ol ol li', 0);
Utils.setSelection('ol ol li', 0);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'<li>b</li>' +
@@ -1115,10 +1146,10 @@ test('Outdent multiple LI in OL and nested OL', function() {
);
editor.focus();
setSelection('li', 0, 'li li', 1);
Utils.setSelection('li', 0, 'li li', 1);
execCommand('Outdent');
equal(editor.getContent(),
equal(editor.getContent(),
'<p>a</p>' +
'<ol>' +
'<li>b</li>' +
@@ -1136,10 +1167,10 @@ test('Indent single LI in OL', function() {
);
editor.focus();
setSelection('li', 0);
Utils.setSelection('li', 0);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a</li>' +
'</ol>'
@@ -1158,10 +1189,10 @@ test('Indent middle LI in OL', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 0);
Utils.setSelection('li:nth-child(2)', 0);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -1184,10 +1215,10 @@ test('Indent last LI in OL', function() {
);
editor.focus();
setSelection('li:last', 0);
Utils.setSelection('li:last', 0);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -1213,10 +1244,10 @@ test('Indent last LI to same level as middle LI', function() {
);
editor.focus();
setSelection('li:last', 1);
Utils.setSelection('li:last', 1);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -1242,10 +1273,10 @@ test('Indent first LI and nested LI OL', function() {
);
editor.focus();
setSelection('li', 0, 'li li', 0);
Utils.setSelection('li', 0, 'li li', 0);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ol>' +
'<li>a' +
'<ol>' +
@@ -1271,10 +1302,10 @@ test('Indent second LI to same level as nested LI', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 0);
Utils.setSelection('li:nth-child(2)', 0);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1305,10 +1336,10 @@ test('Indent second LI to same level as nested LI 2', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 1);
Utils.setSelection('li:nth-child(2)', 1);
execCommand('Indent');
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1333,10 +1364,10 @@ test('Backspace at beginning of single LI in UL', function() {
);
editor.focus();
setSelection('li', 0);
Utils.setSelection('li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<p>a</p>'
);
@@ -1352,7 +1383,7 @@ test('Backspace at beginning of first LI in UL', function() {
);
editor.focus();
setSelection('li', 0);
Utils.setSelection('li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
@@ -1375,10 +1406,10 @@ test('Backspace at beginning of middle LI in UL', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 0);
Utils.setSelection('li:nth-child(2)', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>ab</li>' +
'<li>c</li>' +
@@ -1401,10 +1432,10 @@ test('Backspace at beginning of start LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li', 0);
Utils.setSelection('li li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>ab' +
'<ul>' +
@@ -1431,10 +1462,10 @@ test('Backspace at beginning of middle LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li:nth-child(2)', 0);
Utils.setSelection('li li:nth-child(2)', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1456,10 +1487,10 @@ test('Backspace at beginning of single LI in UL', function() {
);
editor.focus();
setSelection('li', 0);
Utils.setSelection('li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<p>a</p>'
);
@@ -1475,7 +1506,7 @@ test('Backspace at beginning of first LI in UL', function() {
);
editor.focus();
setSelection('li', 0);
Utils.setSelection('li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
@@ -1498,10 +1529,10 @@ test('Backspace at beginning of middle LI in UL', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 0);
Utils.setSelection('li:nth-child(2)', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>ab</li>' +
'<li>c</li>' +
@@ -1524,10 +1555,10 @@ test('Backspace at beginning of start LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li', 0);
Utils.setSelection('li li', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>ab' +
'<ul>' +
@@ -1554,10 +1585,10 @@ test('Backspace at beginning of middle LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li:nth-child(2)', 0);
Utils.setSelection('li li:nth-child(2)', 0);
editor.plugins.lists.backspaceDelete();
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1581,10 +1612,10 @@ test('Delete at end of single LI in UL', function() {
);
editor.focus();
setSelection('li', 1);
Utils.setSelection('li', 1);
editor.plugins.lists.backspaceDelete(true);
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'</ul>'
@@ -1602,7 +1633,7 @@ test('Delete at end of first LI in UL', function() {
);
editor.focus();
setSelection('li', 1);
Utils.setSelection('li', 1);
editor.plugins.lists.backspaceDelete(true);
equal(editor.getContent(),
@@ -1624,10 +1655,10 @@ test('Delete at end of middle LI in UL', function() {
);
editor.focus();
setSelection('li:nth-child(2)', 1);
Utils.setSelection('li:nth-child(2)', 1);
editor.plugins.lists.backspaceDelete(true);
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a</li>' +
'<li>bc</li>' +
@@ -1650,10 +1681,10 @@ test('Delete at end of start LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li', 1);
Utils.setSelection('li li', 1);
editor.plugins.lists.backspaceDelete(true);
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1680,10 +1711,10 @@ test('Delete at end of middle LI in UL inside UL', function() {
);
editor.focus();
setSelection('li li:nth-child(2)', 1);
Utils.setSelection('li li:nth-child(2)', 1);
editor.plugins.lists.backspaceDelete(true);
equal(editor.getContent(),
equal(editor.getContent(),
'<ul>' +
'<li>a' +
'<ul>' +
@@ -1712,59 +1743,3 @@ test('Backspace in LI in UL in inline body element contained within LI', functio
inlineEditor.plugins.lists.backspaceDelete();
equal(inlineEditor.getContent(), '<p>a</p>');
});
function wait() {
if (editor && inlineEditor) {
if (!QUnit.started) {
QUnit.start();
QUnit.started = true;
}
} else {
setTimeout(wait, 0);
}
}
tinymce.init({
mode: "exact",
plugins: "lists",
elements: "elm1",
add_unload_trigger: false,
indent: false,
schema: 'html5',
entities: 'raw',
valid_elements: 'li,ol,ul,em,strong,span,#p,div,br',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display,position,top,left'
},
disable_nodechange: true,
init_instance_callback: function(ed) {
editor = ed;
wait();
}
});
tinymce.init({
selector: '#elm2',
inline: true,
add_unload_trigger: false,
plugins: "lists",
init_instance_callback: function(ed) {
inlineEditor = ed;
wait();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for lists plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<a href="javascript:;" onclick="alert(tinymce.get('elm1').getContent({format: 'raw'}));return false;">[Get raw]</a>
<ul><li><div id="elm2"></div></li></ul>
<a href="javascript:;" onclick="alert(tinymce.get('elm2').getContent({format: 'raw'}));return false;">[Get raw]</a>
</body>
</html>

81
tests/qunit/editor/plugins/media.html → tests/qunit/editor/plugins/media.js
View File

@@ -1,20 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for Media Plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
module("tinymce.plugins.Media", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Media plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
plugins: 'media',
document_base_url: '/tinymce/tinymce/trunk/tests/',
media_scripts: [
{filter: 'http://media1.tinymce.com'},
{filter: 'http://media2.tinymce.com', width: 100, height: 200}
],
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test("Object retain as is", function() {
@@ -42,7 +45,7 @@ test("Embed retain as is", function() {
equal(editor.getContent(),
// IE produces a different attribute order for some odd reason, I love IE
tinymce.isIE ?
tinymce.isIE ?
'<p><video width="300" height="150" controls="controls" loop="loop" autoplay="autoplay" src="320x240.ogg">text<a href="#">link</a></video></p>' :
'<p><video width="300" height="150" src="320x240.ogg" autoplay="autoplay" loop="loop" controls="controls">text<a href="#">link</a></video></p>'
);
@@ -55,7 +58,7 @@ test("Video retain as is", function() {
equal(editor.getContent(),
// IE produces a different attribute order for some odd reason, I love IE
tinymce.isIE ?
tinymce.isIE ?
'<p><video width="300" height="150" controls="controls" loop="loop" autoplay="autoplay" src="320x240.ogg">text<a href="#">link</a></video></p>' :
'<p><video width="300" height="150" src="320x240.ogg" autoplay="autoplay" loop="loop" controls="controls">text<a href="#">link</a></video></p>'
);
@@ -76,8 +79,8 @@ test("Audio retain as is", function() {
'<audio src="sound.mp3">' +
'<track kind="captions" src="foo.en.vtt" srclang="en" label="English">' +
'<track kind="captions" src="foo.sv.vtt" srclang="sv" label="Svenska">' +
'text<a href="#">link</a>' +
'</audio>'
'text<a href="#">link</a>' +
'</audio>'
);
equal(editor.getContent(),
@@ -85,9 +88,9 @@ test("Audio retain as is", function() {
'<audio src="sound.mp3">' +
'<track kind="captions" src="foo.en.vtt" srclang="en" label="English">' +
'<track kind="captions" src="foo.sv.vtt" srclang="sv" label="Svenska">' +
'text<a href="#">link</a>' +
'</audio>' +
'</p>'
'text<a href="#">link</a>' +
'</audio>' +
'</p>'
);
});
@@ -146,35 +149,3 @@ test("Media script elements", function() {
'</p>'
);
});
tinymce.init({
mode: "exact",
elements: "elm1",
add_unload_trigger: false,
document_base_url: '/tinymce/tinymce/trunk/tests/',
plugins: 'media',
media_scripts: [
{filter: 'http://media1.tinymce.com'},
{filter: 'http://media2.tinymce.com', width: 100, height: 200}
],
init_instance_callback: function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for Media Plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

135
tests/qunit/editor/plugins/noneditable.html → tests/qunit/editor/plugins/noneditable.js
View File

@@ -1,32 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for noneditable</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor, rng;
module("tinymce.plugins.Noneditable", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Noneditable plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
indent: false,
noneditable_regexp: [/\{[^\}]+\}/g],
plugins: 'noneditable',
forced_root_block: '',
convert_fonts_to_spans: false,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test('expand to noneditable (start)', function() {
editor.setContent('<p><span class="mceNonEditable">no</span>yes</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.firstChild.firstChild, 1);
rng.setEnd(editor.getBody().firstChild.lastChild, 1);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 0);
@@ -37,13 +43,13 @@ test('expand to noneditable (start)', function() {
test('expand to noneditable (end)', function() {
editor.setContent('<p>yes<span class="mceNonEditable">no</span></p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.firstChild, 1);
rng.setEnd(editor.getBody().firstChild.lastChild.firstChild, 1);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, '#text');
equal(rng.startOffset, 1);
@@ -54,13 +60,13 @@ test('expand to noneditable (end)', function() {
test('expand to noneditable (start/end)', function() {
editor.setContent('<p>yes<span class="mceNonEditable">noedit</span>yes</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 1);
rng.setEnd(editor.dom.select('span')[0].firstChild, 2);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -71,14 +77,14 @@ test('expand to noneditable (start/end)', function() {
test('type after non editable', function() {
editor.setContent('<p><span class="mceNonEditable">no</span>yes</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 2);
rng.setEnd(editor.dom.select('span')[0].firstChild, 2);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
type('X');
rng = normalizeRng(editor.selection.getRng(true));
Utils.type('X');
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.getAttribute('data-mce-bogus'), 'true');
equal(rng.startContainer.nodeName, 'SPAN');
@@ -91,14 +97,14 @@ test('type after non editable', function() {
test('type between non editable', function() {
editor.setContent('<p><span class="mceNonEditable">no</span><span class="mceNonEditable">no</span></p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 2);
rng.setEnd(editor.dom.select('span')[0].firstChild, 2);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
type('X');
rng = normalizeRng(editor.selection.getRng(true));
Utils.type('X');
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.getAttribute('data-mce-bogus'), 'true');
equal(rng.startContainer.nodeName, 'SPAN');
@@ -111,14 +117,14 @@ test('type between non editable', function() {
test('type after last non editable', function() {
editor.setContent('<p><span class="mceNonEditable">no</span></p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 2);
rng.setEnd(editor.dom.select('span')[0].firstChild, 2);
editor.selection.setRng(rng);
editor.dom.fire(editor.getBody(), 'mouseup');
type('X');
rng = normalizeRng(editor.selection.getRng(true));
Utils.type('X');
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.getAttribute('data-mce-bogus'), 'true');
equal(rng.startContainer.nodeName, 'SPAN');
@@ -130,13 +136,13 @@ test('type after last non editable', function() {
test('escape noneditable inline element (left)', function() {
editor.setContent('<p>no <span class="mceNonEditable">yes</span> no</p><p class="mceNonEditable">no</p>');
var container = editor.dom.select('p')[0];
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.selectNode(editor.dom.select('span')[0]);
editor.selection.setRng(rng);
type({keyCode: 37});
rng = normalizeRng(editor.selection.getRng(true));
Utils.type({keyCode: 37});
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, 'SPAN');
equal(rng.startContainer.parentNode.nodeName, 'P');
@@ -146,13 +152,13 @@ test('escape noneditable inline element (left)', function() {
test('escape noneditable inline element (right)', function() {
editor.setContent('<p>no <span class="mceNonEditable">yes</span> no</p><p class="mceNonEditable">no</p>');
var container = editor.dom.select('p')[0];
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.selectNode(editor.dom.select('span')[0]);
editor.selection.setRng(rng);
type({keyCode: 39});
rng = normalizeRng(editor.selection.getRng(true));
Utils.type({keyCode: 39});
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, 'SPAN');
equal(rng.startContainer.parentNode.nodeName, 'P');
@@ -162,12 +168,13 @@ test('escape noneditable inline element (right)', function() {
test('escape noneditable block element (left)', function(){
editor.setContent('<p>yes</p><p class="mceNonEditable">no</p><p>yes</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.selectNode(editor.dom.select('p')[1]);
editor.selection.setRng(rng);
type({keyCode: 37});
rng = normalizeRng(editor.selection.getRng(true));
Utils.type({keyCode: 37});
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, "P");
equal(editor.dom.nodeIndex(rng.startContainer), 0);
@@ -178,12 +185,13 @@ test('escape noneditable block element (left)', function(){
test('escape noneditable block element (right)', function(){
editor.setContent('<p>yes</p><p class="mceNonEditable">no</p><p>yes</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.selectNode(editor.dom.select('p')[1]);
editor.selection.setRng(rng);
type({keyCode: 39});
rng = normalizeRng(editor.selection.getRng(true));
Utils.type({keyCode: 39});
rng = Utils.normalizeRng(editor.selection.getRng(true));
equal(rng.startContainer.nodeName, "P");
equal(editor.dom.nodeIndex(rng.startContainer), 2);
@@ -198,40 +206,3 @@ test('noneditable regexp', function() {
equal(editor.dom.select('span').length, 2);
equal(editor.getContent(), '<p>{test1}{test2}</p>');
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
indent : false,
theme_advanced_styles : 'test1=test1;test2=test2',
noneditable_regexp : [/\{[^\}]+\}/g],
valid_elements : '@[contenteditable|id|class|style|title|dir<ltr?rtl|lang|xml::lang|onclick|ondblclick|onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|onkeydown|onkeyup],a[rel|rev|charset|hreflang|tabindex|accesskey|type|name|href|target|title|class|onfocus|onblur],strong,b,em,i,strike,u,#p,-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup,-blockquote[cite],-table[border|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],object[classid|width|height|codebase|*],param[name|value],embed[type|width|height|src|*],script[src|type],map[name],area[shape|coords|href|alt|target],bdo,button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method],input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value|tabindex|accesskey],kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value],q[cite],samp,select[disabled|multiple|name|size],small,textarea[cols|rows|disabled|name|readonly],tt,var,big',
plugins: 'noneditable',
forced_root_block : '',
convert_fonts_to_spans : false,
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests noneditable plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

109
tests/qunit/editor/plugins/paste.html → tests/qunit/editor/plugins/paste.js
View File

@@ -1,23 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for the Paste plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var editor;
module("tinymce.plugins.Paste", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Paste plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
plugins: 'paste',
setup: function(ed) {
ed.on('NodeChange', false);
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test("Paste simple text content", function() {
@@ -155,7 +153,7 @@ test("Paste Word without mso markings", function() {
)
});
equal(trimContent(editor.getContent()), (
equal(Utils.trimContent(editor.getContent()), (
'<p>Comic Sans MS</p>'
));
});
@@ -174,7 +172,7 @@ test("Paste Word links", function() {
)
});
equal(trimContent(editor.getContent()), (
equal(Utils.trimContent(editor.getContent()), (
'<p>' +
'<a href="#_Toc238571849">1</a>' +
'<a href="#_Toc238571849">2</a>' +
@@ -186,37 +184,31 @@ test("Paste Word links", function() {
});
test("Paste Word retain styles", function() {
var rng = editor.dom.createRng();
editor.settings.paste_retain_style_properties = 'color,background-color,font-family';
// Test color
editor.setContent('');
editor.execCommand('SelectAll');
editor.execCommand('mceInsertClipboardContent', false, {content: '<p class="MsoNormal" style="color: #ff0000">Test</p>'});
equal(trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p style=\"color: #ff0000;\">Test</p>');
equal(Utils.trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p style=\"color: #ff0000;\">Test</p>');
// Test background-color
editor.setContent('');
editor.execCommand('SelectAll');
editor.execCommand('mceInsertClipboardContent', false, {content: '<p class="MsoNormal" style="background-color: #ff0000">Test</p>'});
equal(trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p style=\"background-color: #ff0000;\">Test</p>');
equal(Utils.trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p style=\"background-color: #ff0000;\">Test</p>');
editor.settings.paste_retain_style_properties = '';
});
test("Paste part of list from IE", function() {
var rng = editor.dom.createRng();
editor.setContent('');
editor.execCommand('SelectAll');
editor.execCommand('mceInsertClipboardContent', false, {content: '<li>item2</li><li>item3</li>'});
equal(trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<ul><li>item2</li><li>item3</li></ul>', 'List tags are inferred when pasting LI');
equal(Utils.trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<ul><li>item2</li><li>item3</li></ul>', 'List tags are inferred when pasting LI');
});
test("Disable default filters", function() {
var rng = editor.dom.createRng();
editor.settings.paste_enable_default_filters = false;
// Test color
@@ -224,7 +216,7 @@ test("Disable default filters", function() {
editor.execCommand('SelectAll');
editor.execCommand('mceInsertClipboardContent', false, {content: '<p class="MsoNormal" style="color: #ff0000;">Test</p>'});
equal(trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p class="MsoNormal" style="color: #ff0000;">Test</p>');
equal(Utils.trimContent(editor.getContent().replace(/[\r\n]+/g, '')), '<p class="MsoNormal" style="color: #ff0000;">Test</p>');
editor.settings.paste_enable_default_filters = true;
});
@@ -233,7 +225,7 @@ test('paste invalid content with spans on page', function() {
var startingContent = '<p>123 testing <span id="x">span later in document</span></p>',
insertedContent = '<ul><li>u</li><li>l</li></ul>';
editor.setContent(startingContent);
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].firstChild, 0);
editor.selection.setRng(rng);
@@ -244,7 +236,7 @@ test('paste invalid content with spans on page', function() {
test('paste plain text with space', function() {
editor.setContent('<p>text</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 1);
rng.setEnd(editor.dom.select('p')[0].firstChild, 2);
editor.selection.setRng(rng);
@@ -255,18 +247,18 @@ test('paste plain text with space', function() {
test('paste plain text with linefeeds', function() {
editor.setContent('<p>text</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 1);
rng.setEnd(editor.dom.select('p')[0].firstChild, 2);
editor.selection.setRng(rng);
editor.execCommand('mceInsertClipboardContent', false, {text: 'a\nb\n\c\n'});
editor.execCommand('mceInsertClipboardContent', false, {text: 'a\nb\nc\n'});
equal(editor.getContent().replace(/[\r\n]+/g, ''), '<p>ta<br />b<br />c<br />xt</p>');
});
test('paste plain text with double linefeeds', function() {
editor.setContent('<p>text</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 1);
rng.setEnd(editor.dom.select('p')[0].firstChild, 2);
editor.selection.setRng(rng);
@@ -277,7 +269,7 @@ test('paste plain text with double linefeeds', function() {
test('paste plain text with entities', function() {
editor.setContent('<p>text</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 1);
rng.setEnd(editor.dom.select('p')[0].firstChild, 2);
editor.selection.setRng(rng);
@@ -288,7 +280,7 @@ test('paste plain text with entities', function() {
test('paste plain text with paragraphs', function() {
editor.setContent('<p>text</p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 1);
rng.setEnd(editor.dom.select('p')[0].firstChild, 2);
editor.selection.setRng(rng);
@@ -322,13 +314,13 @@ test('paste pre process text (event)', function() {
}
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.on('PastePreProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {text: 'b\n2'});
equal(editor.getContent(), '<p>PRE:b<br />2</p>');
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.off('PastePreProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {text: 'c'});
equal(editor.getContent(), '<p>c</p>');
@@ -340,13 +332,13 @@ test('paste pre process html (event)', function() {
}
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.on('PastePreProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {content: '<em>b</em>'});
equal(editor.getContent(), '<p>PRE:<em>b</em></p>');
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.off('PastePreProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {content: '<em>c</em>'});
equal(editor.getContent(), '<p><em>c</em></p>');
@@ -358,13 +350,13 @@ test('paste post process (event)', function() {
}
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.on('PastePostProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {content: '<em>b</em>'});
equal(editor.getContent(), '<p><em>b</em>:POST</p>');
editor.setContent('<p>a</p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.off('PastePostProcess', callback);
editor.execCommand('mceInsertClipboardContent', false, {content: '<em>c</em>'});
equal(editor.getContent(), '<p><em>c</em></p>');
@@ -409,32 +401,3 @@ test('paste innerText of textnode with whitespace', function() {
editor.getBody().innerHTML = '<pre> a </pre>';
equal(tinymce.pasteplugin.Utils.innerText(editor.getBody().firstChild.innerHTML), ' a ');
});
tinymce.init({
mode: "exact",
elements: "elm1",
add_unload_trigger: false,
plugins: 'paste',
setup: function(ed) {
ed.on('NodeChange', false);
},
init_instance_callback: function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
<h1 id="qunit-header">Unit tests for the Paste plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format: 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

59
tests/qunit/editor/plugins/plugin_dependency_chain.html
View File

@@ -1,59 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic editor functionality tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
function check_plugin_loaded(name){
var pluginManager = tinymce.PluginManager;
var depPlugin = pluginManager.get(name);
ok(depPlugin, name + " plugin should have loaded");
}
test('Dependency Chain Legacy style test', function() {
expect(3);
check_plugin_loaded("example");
check_plugin_loaded("example_dependency");
check_plugin_loaded("depend_chain");
});
tinymce.create('tinymce.plugins.DependencyChain', {});
// Register plugin
tinymce.PluginManager.add('depend_chain', tinymce.plugins.DependencyChain, ["example_dependency"]);
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
plugins: "depend_chain",
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Plugin Dependency Functional tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
</body>
</html>

59
tests/qunit/editor/plugins/plugin_dependency_chain_legacy.html
View File

@@ -1,59 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Plugin Dependency Functional tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
function check_plugin_loaded(name){
var pluginManager = tinymce.PluginManager;
var depPlugin = pluginManager.get(name);
ok(depPlugin, name + " plugin should have loaded");
}
test('Dependency Chain Legacy style test', function() {
expect(3);
check_plugin_loaded("example");
check_plugin_loaded("example_dependency");
check_plugin_loaded("depend_chain");
});
tinymce.create('tinymce.plugins.DependencyChain', {});
// Register plugin
tinymce.PluginManager.add('depend_chain', tinymce.plugins.DependencyChain, ["example_dependency"]);
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
plugins: "-depend_chain",
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Plugin Dependency Functional tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
</body>
</html>

69
tests/qunit/editor/plugins/plugin_dependency_init_call_order.html
View File

@@ -1,69 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic editor functionality tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
function check_plugin_order(order){
deepEqual(plugin_load_order, order, "Load order for plugins");
}
test('PluginDependencyIsLoaded', function() {
expect(1);
check_plugin_order(["one", "two", "three", "four"]);
});
var plugin_load_order =[];
tinymce.create('tinymce.plugins.One', {
init: function(ed, url) {plugin_load_order.push("one");}
});
tinymce.create('tinymce.plugins.Two', {
init: function(ed, url) {plugin_load_order.push("two");}
});
tinymce.create('tinymce.plugins.Three', {
init: function(ed, url) {plugin_load_order.push("three");}
});
tinymce.create('tinymce.plugins.Four', {
init: function(ed, url) {plugin_load_order.push("four");}
});
// Register plugin
tinymce.PluginManager.add('two', tinymce.plugins.Two, ["one"]);
tinymce.PluginManager.add('three', tinymce.plugins.Three, ["two"]);
tinymce.PluginManager.add('one', tinymce.plugins.One);
tinymce.PluginManager.add('four', tinymce.plugins.Four, ["one", "two"]);
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
plugins: "-three,-four",
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Plugin Dependency Functional tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
</body>
</html>

58
tests/qunit/editor/plugins/plugin_dependency_specific_location.html
View File

@@ -1,58 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic editor functionality tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
function check_plugin_loaded(name){
var pluginManager = tinymce.PluginManager;
var depPlugin = pluginManager.get(name);
ok(depPlugin, name + " plugin should have loaded");
}
test('Plugin Dependency Loaded from a Specific location', function() {
expect(2);
check_plugin_loaded("specific_location");
check_plugin_loaded("autolink");
});
tinymce.create('tinymce.plugins.SpecificLocation', {});
// Register plugin
tinymce.PluginManager.add('specific_location', tinymce.plugins.SpecificLocation, [{prefix: "plugins/", resource:"autolink", suffix:'/plugin' + tinymce.suffix + '.js'}]);
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
plugins: "-specific_location",
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Plugin Dependency Functional tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
</body>
</html>

65
tests/qunit/editor/plugins/searchreplace.html → tests/qunit/editor/plugins/searchreplace.js
View File

@@ -1,21 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for searchreplace plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor, rng;
module("tinymce.plugins.SearchReplace", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.SearchReplace", {
autostart: false
tinymce.init({
selector: "textarea",
plugins: "searchreplace",
elements: "elm1",
add_unload_trigger: false,
skin: false,
indent: false,
disable_nodechange: true,
init_instance_callback : function(ed) {
window.editor = ed;
window.setTimeout(function() {
QUnit.start();
}, 0);
}
});
}
});
test('Find no match', function() {
@@ -97,36 +99,9 @@ test('Find multiple matches and unmark them', function() {
test('Find multiple matches with pre blocks', function() {
editor.getBody().innerHTML = 'abc<pre> abc </pre>abc';
equal(3, editor.plugins.searchreplace.find('b'));
equal(normalizeHtml(editor.getBody().innerHTML), (
equal(Utils.normalizeHtml(editor.getBody().innerHTML), (
'a<span class="mce-match-marker mce-match-marker-selected" data-mce-bogus="1" data-mce-index="0">b</span>c' +
'<pre> a<span class="mce-match-marker" data-mce-bogus="1" data-mce-index="1">b</span>c </pre>' +
'a<span class="mce-match-marker" data-mce-bogus="1" data-mce-index="2">b</span>c'
));
});
tinymce.init({
mode: "exact",
plugins: "searchreplace",
elements: "elm1",
add_unload_trigger: false,
indent: false,
disable_nodechange: true,
init_instance_callback : function(ed) {
editor = ed;
window.setTimeout(function() {
QUnit.start();
}, 0);
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for lists plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<a href="javascript:;" onclick="alert(tinymce.get('elm1').getContent({format: 'raw'}));return false;">[Get raw]</a>
</body>
</html>

108
tests/qunit/editor/plugins/spellchecker.html
View File

@@ -1,108 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for spellchecker plugin</title>
<meta http-eqiv="X-UA-Compatible" content="IE-edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editors = {}, awaitingInit=2;
initTinyMCE({
instance_name: 'no_lang'
});
initTinyMCE({
instance_name: 'one_lang',
spellchecker_languages: 'English=en'
});
initTinyMCE({
instance_name: 'many_lang',
spellchecker_languages: 'English=en,French=fr,German=de'
});
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.Spellchecker", {
autostart: false
});
// Default spellchecker language should match editor language
test('Check default language', function() {
var mainLanguage = editors.no_lang.settings.language || 'en';
equal(editors.no_lang.settings.spellchecker_language, mainLanguage);
});
// Spellchecker button may include a language menu
// When no languages are specified, the default list of languages should be
// used, matching the list in the old TinyMCE 3 spellchecker plugin.
test('Check spellcheck button is a splitbutton (no languages)', function() {
var spellcheckButton = editors.no_lang.buttons.spellchecker;
equal(spellcheckButton.type, 'splitbutton');
});
// When exactly one spellchecker language is specified, there's no need to
// display a selection menu.
test('Check spellcheck button is a normal button (one language)', function() {
var spellcheckButton = editors.one_lang.buttons.spellchecker;
equal(spellcheckButton.type, 'button');
});
// When more than one spellchecker language is specified, a selection menu
// should be provided to choose between them.
test('Check spellcheck button is a splitbutton (many languages)', function() {
var spellcheckButton = editors.many_lang.buttons.spellchecker;
equal(spellcheckButton.type, 'splitbutton');
});
function initTinyMCE(args) {
var instance_name = args.instance_name;
var init_args = {
mode: "exact",
plugins: "spellchecker",
selector: '#' + instance_name,
add_unload_trigger: false,
disable_nodechange: true,
toolbar1: "spellchecker",
init_instance_callback: function(ed) {
editors[instance_name] = ed;
checkEditorsReady();
}
};
if (args.spellchecker_languages) {
init_args.spellchecker_languages = args.spellchecker_languages;
}
tinymce.init(init_args);
}
function checkEditorsReady() {
awaitingInit--;
if (awaitingInit == 0) {
window.setTimeout(function() {
QUnit.start();
}, 0);
}
}
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for spellchecker plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="no_lang"></textarea>
<a href="javascript:;" onclick="alert(tinymce.get('no_lang').getContent({format: 'raw'}));return false;">[Get raw]</a>
<textarea id="one_lang"></textarea>
<a href="javascript:;" onclick="alert(tinymce.get('one_lang').getContent({format: 'raw'}));return false;">[Get raw]</a>
<textarea id="many_lang"></textarea>
<a href="javascript:;" onclick="alert(tinymce.get('many_lang').getContent({format: 'raw'}));return false;">[Get raw]</a>
</body>
</html>

95
tests/qunit/editor/plugins/spellchecker.js Normal file
View File

@@ -0,0 +1,95 @@
(function() {
var count = 0;
module("tinymce.plugins.Spellchecker", {
setupModule: function() {
document.getElementById('view').innerHTML = (
'<textarea id="no_lang"></textarea>' +
'<textarea id="one_lang"></textarea>' +
'<textarea id="many_lang"></textarea>'
);
QUnit.stop();
function wait() {
if (++count == 3) {
QUnit.start();
}
}
tinymce.init({
selector: '#no_lang',
plugins: "spellchecker",
add_unload_trigger: false,
skin: false,
disable_nodechange: true,
toolbar: 'spellchecker',
init_instance_callback: function(ed) {
window.editor = ed;
wait();
}
});
tinymce.init({
selector: '#one_lang',
plugins: "spellchecker",
add_unload_trigger: false,
skin: false,
spellchecker_languages: 'English=en',
disable_nodechange: true,
toolbar: 'spellchecker',
init_instance_callback: function(ed) {
window.editor = ed;
wait();
}
});
tinymce.init({
selector: '#many_lang',
plugins: "spellchecker",
add_unload_trigger: false,
skin: false,
spellchecker_languages: 'English=en,French=fr,German=de',
disable_nodechange: true,
toolbar: 'spellchecker',
init_instance_callback: function(ed) {
window.editor = ed;
wait();
}
});
},
teardown: function() {
editor.settings.forced_root_block = 'p';
}
});
// Default spellchecker language should match editor language
test('Check default language', function() {
var mainLanguage = tinymce.get('no_lang').settings.language || 'en';
equal(tinymce.get('no_lang').settings.spellchecker_language, mainLanguage);
});
// Spellchecker button may include a language menu
// When no languages are specified, the default list of languages should be
// used, matching the list in the old TinyMCE 3 spellchecker plugin.
test('Check spellcheck button is a splitbutton (no languages)', function() {
var spellcheckButton = tinymce.get('no_lang').buttons.spellchecker;
equal(spellcheckButton.type, 'splitbutton');
});
// When exactly one spellchecker language is specified, there's no need to
// display a selection menu.
test('Check spellcheck button is a normal button (one language)', function() {
var spellcheckButton = tinymce.get('one_lang').buttons.spellchecker;
equal(spellcheckButton.type, 'button');
});
// When more than one spellchecker language is specified, a selection menu
// should be provided to choose between them.
test('Check spellcheck button is a splitbutton (many languages)', function() {
var spellcheckButton = tinymce.get('many_lang').buttons.spellchecker;
equal(spellcheckButton.type, 'splitbutton');
});
})();

148
tests/qunit/editor/plugins/table.html → tests/qunit/editor/plugins/table.js
View File

@@ -1,31 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for the Table plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var editor;
module("tinymce.plugins.Table", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Table plugin", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
plugins: 'table',
valid_styles: {
'*' : 'width,height,text-align,float'
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
function getFontmostWindow() {
return editor.windowManager.windows[editor.windowManager.windows.length - 1];
}
function fillAndSubmitWindowForm(data) {
var win = getFontmostWindow();
var win = Utils.getFontmostWindow();
win.fromJSON(data);
win.find('form')[0].submit();
@@ -33,16 +27,16 @@ function fillAndSubmitWindowForm(data) {
}
function cleanTableHtml(html) {
return cleanHtml(html).replace(/<p>(&nbsp;|<br[^>]+>)<\/p>$/, '');
return Utils.cleanHtml(html).replace(/<p>(&nbsp;|<br[^>]+>)<\/p>$/, '');
}
test("Table properties dialog (get data from plain table)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
deepEqual(getFontmostWindow().toJSON(), {
"align": false,
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "",
"border": "",
"caption": false,
"cellpadding": "",
@@ -51,7 +45,7 @@ test("Table properties dialog (get data from plain table)", function() {
"width": ""
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table properties dialog (get data from full table)", function() {
@@ -66,11 +60,11 @@ test("Table properties dialog (get data from full table)", function() {
'</table>'
);
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
deepEqual(getFontmostWindow().toJSON(), {
"align": false,
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "",
"border": "4",
"caption": true,
"cellpadding": "3",
@@ -79,12 +73,12 @@ test("Table properties dialog (get data from full table)", function() {
"width": "100"
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table properties dialog (add caption)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
fillAndSubmitWindowForm({
caption: true
@@ -98,7 +92,7 @@ test("Table properties dialog (add caption)", function() {
test("Table properties dialog (remove caption)", function() {
editor.setContent('<table><caption>&nbsp;</caption><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
fillAndSubmitWindowForm({
caption: false
@@ -112,7 +106,7 @@ test("Table properties dialog (remove caption)", function() {
test("Table properties dialog (change size in pixels)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
fillAndSubmitWindowForm({
width: 100,
@@ -127,7 +121,7 @@ test("Table properties dialog (change size in pixels)", function() {
test("Table properties dialog (change size in %)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
fillAndSubmitWindowForm({
width: "100%",
@@ -142,7 +136,7 @@ test("Table properties dialog (change size in %)", function() {
test("Table properties dialog (change: border,cellpadding,cellspacing,align)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceInsertTable');
fillAndSubmitWindowForm({
border: "1",
@@ -159,26 +153,26 @@ test("Table properties dialog (change: border,cellpadding,cellspacing,align)", f
test("Table cell properties dialog (get data from plain cell)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableCellProps');
deepEqual(getFontmostWindow().toJSON(), {
"align": false,
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "",
"height": "",
"scope": "",
"type": "td",
"width": ""
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table cell properties dialog (get data from complex cell)", function() {
editor.setContent('<table><tr><th style="text-align: right; width: 10px; height: 11px" scope="row">X</th></tr></table>');
setSelection('th', 0);
Utils.setSelection('th', 0);
editor.execCommand('mceTableCellProps');
deepEqual(getFontmostWindow().toJSON(), {
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "right",
"height": "11",
"scope": "row",
@@ -186,12 +180,12 @@ test("Table cell properties dialog (get data from complex cell)", function() {
"width": "10"
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table cell properties dialog (update all)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableCellProps');
fillAndSubmitWindowForm({
@@ -210,35 +204,35 @@ test("Table cell properties dialog (update all)", function() {
test("Table row properties dialog (get data from plain cell)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableRowProps');
deepEqual(getFontmostWindow().toJSON(), {
"align": false,
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "",
"height": "",
"type": "tbody"
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table row properties dialog (get data from complex cell)", function() {
editor.setContent('<table><thead><tr style="height: 10px; text-align: right"><td>X</td></tr></thead></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableRowProps');
deepEqual(getFontmostWindow().toJSON(), {
deepEqual(Utils.getFontmostWindow().toJSON(), {
"align": "right",
"height": "10",
"type": "thead"
});
getFontmostWindow().close();
Utils.getFontmostWindow().close();
});
test("Table row properties dialog (update all)", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableRowProps');
fillAndSubmitWindowForm({
@@ -255,94 +249,66 @@ test("Table row properties dialog (update all)", function() {
test("mceTableDelete command", function() {
editor.setContent('<table><tr><td>X</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableDelete');
equal(cleanTableHtml(editor.getContent()), '');
});
test("mceTableDeleteCol command", function() {
editor.setContent('<table><tr><td>1</td><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableDeleteCol');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>2</td></tr></tbody></table>');
});
test("mceTableDeleteRow command", function() {
editor.setContent('<table><tr><td>1</td></tr><tr><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableDeleteRow');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>2</td></tr></tbody></table>');
});
test("mceTableInsertColAfter command", function() {
editor.setContent('<table><tr><td>1</td></tr><tr><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableInsertColAfter');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>1</td><td>&nbsp;</td></tr><tr><td>2</td><td>&nbsp;</td></tr></tbody></table>');
});
test("mceTableInsertColBefore command", function() {
editor.setContent('<table><tr><td>1</td></tr><tr><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableInsertColBefore');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>&nbsp;</td><td>1</td></tr><tr><td>&nbsp;</td><td>2</td></tr></tbody></table>');
});
test("mceTableInsertRowAfter command", function() {
editor.setContent('<table><tr><td>1</td><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableInsertRowAfter');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>1</td><td>2</td></tr><tr><td>&nbsp;</td><td>&nbsp;</td></tr></tbody></table>');
});
test("mceTableInsertRowBefore command", function() {
editor.setContent('<table><tr><td>1</td><td>2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableInsertRowBefore');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td>&nbsp;</td><td>&nbsp;</td></tr><tr><td>1</td><td>2</td></tr></tbody></table>');
});
test("mceTableMergeCells command with cell selection", function() {
editor.setContent('<table><tr><td class="mce-item-selected">1</td><td class="mce-item-selected">2</td></tr></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableMergeCells');
equal(cleanTableHtml(editor.getContent()), '<table><tbody><tr><td colspan="2">12</td></tr></tbody></table>');
});
test("mceTableSplitCells command", function() {
editor.setContent('<table><tbody><tr><td colspan="2">12</td></tr></tbody></table>');
setSelection('td', 0);
Utils.setSelection('td', 0);
editor.execCommand('mceTableSplitCells');
equal(
cleanTableHtml(editor.getContent()),
'<table><tbody><tr><td>12</td><td>&nbsp;</td></tr></tbody></table>'
);
});
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
plugins: 'table',
valid_styles: {
'*' : 'width,height,text-align,float'
},
init_instance_callback: function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
<h1 id="qunit-header">Unit tests for the Table plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

189
tests/qunit/editor/plugins/table_robot.html
View File

@@ -1,189 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Table plugin tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="../js/jsrobot/robot.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module('Table plugin', {
autostart: false
});
var VK;
var UP_ARROW = 0x26;
var DOWN_ARROW = 0x28;
var ENTER = 0xA;
if (tinymce.isWebKit) {
asyncTest('Selecting Cell and typing should update cell correctly in WebKit', function() {
editor.setContent('<table><tr><td><p>first cell</p></td><td><p>second cell</p></td></tr></table>');
// in order for the robot to work well, we need to focus the editor before performing selection on it.
editor.focus();
// in order to simulate the section on tables as per the plugin we do a select then call out to the fix table selection
// (which is called by selection events).
editor.selection.select(editor.dom.select('td')[0]);
editor.fire('keydown');
robot.type('g',false, function(){
var expected = '<table><tbody><tr><td><p>g</p></td><td><p>second cell</p></td></tr></tbody></table>';
var actual = editor.getContent();
equal(actual, expected);
start();
}, editor.getBody());
});
} else {
asyncTest('Empty stub', function() {
start();
ok(true, "Dummy");
});
}
function testCursorKey(html, nodeToSelect, keyCode, expected) {
editor.setContent(html);
editor.focus();
setSelection(nodeToSelect, 0);
editor.focus();
robot.type(keyCode, false, function() {
var node = editor.selection.getNode();
var actual = node.firstChild.nodeValue;
equal(actual, expected);
start();
}, editor.getBody());
}
asyncTest('space key does not nuke content in th cells', 1, function() {
editor.setContent('<table><tbody><tr><th id="a">abcdef</th></tr></tbody></table>');
editor.focus();
setSelection('#a', 3);
editor.focus();
robot.type(VK.SPACEBAR, false, function() {
var actual = editor.dom.get('a').innerHTML;
var expected = 'abc def';
equal(actual, expected);
start()
}, editor.getBody());
});
asyncTest('arrow up key moves to row above', function() {
var html = '<table><tr><td>0</td><td>1</td></tr><tr><td>0</td><td id="b">2</td></tr></table>';
testCursorKey(html, '#b', UP_ARROW, '1');
});
asyncTest('arrow up key moves to row above for heading cells', function() {
var html = '<table><tr><td>0</td><td>1</td></tr><tr><td>0</td><th id="b">2</th></tr></table>';
testCursorKey(html, '#b', UP_ARROW, '1');
});
asyncTest('arrow down key moves to row below', function() {
var html = '<table><tr><td id="a"></td></tr><tr><td>2</td></tr></table>';
testCursorKey(html, '#a', DOWN_ARROW, '2');
});
asyncTest('arrow up key in cell with colspan moves to row above', function() {
var html = '<table><tr><td>1</td><td></td></tr><tr><td id="b" colspan="2"></td></tr></table>';
testCursorKey(html, '#b', UP_ARROW, '1');
});
asyncTest('arrow down key in cell with colspan moves to row below', function() {
var html = '<table><tr><td id="a" colspan="2"></td></tr><tr><td>2</td><td></td></tr></table>';
testCursorKey(html, '#a', DOWN_ARROW, '2');
});
asyncTest('arrow key up in top row escapes table', function() {
var html = '<p>outside</p><table><tr><td id="a"></td></tr><tr><td></td></tr></table>';
testCursorKey(html, '#a', UP_ARROW, 'outside');
});
asyncTest('arrow key down in bottom row escapes table', function() {
var html = '<table><tr><td></td></tr><tr><td id="b"></td></tr></table><p>outside</p>';
testCursorKey(html, '#b', DOWN_ARROW, 'outside');
});
asyncTest('arrow key up in bottom row to last p in above tr', 1, function() {
var html = "<table><tr><td><p id='a'>a</p><p id='b'>b</p></td></tr><tr><td><p id='c'>c</p><p>d</p></td></tr></table>";
testCursorKey(html, '#c', UP_ARROW, 'b');
});
asyncTest('arrow key down in top row to first p in below tr', 1, function() {
var html = "<table><tr><td><p id='a'>a</p><p id='b'>b</p></td></tr><tr><td><p id='c'>c</p><p>d</p></td></tr></table>";
testCursorKey(html, '#b', DOWN_ARROW, 'c');
});
asyncTest('arrow key down into table cell with br', 1, function() {
var html = "<table><tr><td id='a'></td></tr><tr><td>something<br></td></tr></table>";
testCursorKey(html, '#a', DOWN_ARROW, 'something');
});
asyncTest('shift-enter in table cell ending with BR places caret on new line', function() {
editor.setContent('<table><tr><td>d <strong>e</strong><br></td></tr></table>');
setSelection('strong', 1);
robot.type(ENTER, true, function(){
var expected = '<table><tbody><tr><td>d <strong>e<br /></strong></td></tr></tbody></table>';
var actual = editor.getContent();
var range = editor.selection.getRng(true);
equal(cleanHtml(actual), expected);
equal(range.startContainer.nodeName, 'STRONG');
equal(range.startOffset, 2);
equal(range.collapsed, true);
start();
}, editor.getBody());
});
// Only run on Gecko since WebKit and IE can place a caret after a table
if (tinymce.Env.gecko) {
test("Insert table and remove caret placeholder", function() {
editor.setContent('<table><tbody><tr><td>x</td></tr></tbody></table>');
equal(editor.getBody().firstChild.nodeName, "TABLE");
equal(editor.getBody().lastChild.nodeName, "P");
equal(editor.getContent(), '<table><tbody><tr><td>x</td></tr></tbody></table>');
});
} else {
test("Skipped since it works in this browser", function() {
ok(true, "Dummy assert");
});
}
var initTinyFunction = function(){
tinymce.init({
mode : "exact",
elements : "elm1",
cleanup: true,
indent: false,
add_unload_trigger : false,
webkit_fake_resize: false,
plugins: "table",
init_instance_callback : function(ed) {
editor = ed;
VK = tinymce.util.VK;
}
});
};
</script>
</head>
<body>
<h1 id="qunit-header">Table plugin tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
<script>
initWhenTinyAndRobotAreReady(initTinyFunction);
</script>
</body>
</html>

24
tests/qunit/editor/plugins/tests.js
View File

@@ -1,24 +0,0 @@
{
"title": "Plugins tests",
"tests": [
{"title": "Media", "url": "media.html"},
{"title": "Noneditable", "url": "noneditable.html"},
{"title": "Paste", "url": "paste.html"},
{"title": "Table", "url": "table.html"},
{"title": "Table (robot)", "url": "table_robot.html", "jsrobot": true},
{"title": "jQuery", "url": "jquery_plugin.html"},
{"title": "Autolink (robot)", "url": "autolink.html", "jsrobot": true},
{"title": "Autosave", "url": "autosave.html"},
{"title": "Wordcount", "url": "wordcount.html"},
{"title": "Fullpage", "url": "fullpage.html"},
{"title": "Legacyoutput", "url": "legacyoutput.html"},
{"title": "Plugin Dependencies", "url": "plugin_dependency_simple.html"},
{"title": "Plugin Dependency Chain", "url": "plugin_dependency_chain.html"},
{"title": "Plugin Dependency Chain Legacy", "url": "plugin_dependency_chain_legacy.html"},
{"title": "Dependency Chain Init Call Order", "url": "plugin_dependency_init_call_order.html"},
{"title": "Dependency With Specific Location", "url": "plugin_dependency_specific_location.html"},
{"title": "Lists", "url": "lists.html"},
{"title": "Searchreplace", "url": "searchreplace.html"},
{"title": "Spellchecker", "url": "spellchecker.html"}
]
}

122
tests/qunit/editor/plugins/wordcount.html
View File

@@ -1,122 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for the Wordcount plugin</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.plugins.Wordcount", {
autostart: false
});
test("Blank document has 0 words", function() {
expect(1);
editor.setContent('');
var result = editor.plugins.wordcount.getCount();
equal(result, 0);
});
test("Simple word count", function() {
expect(1);
editor.setContent('<p>My sentence is this.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 4);
});
test("Does not count dashes", function() {
expect(1);
editor.setContent('<p>Something -- ok</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 2);
});
test("Does not count asterisks, non-word characters", function() {
expect(1);
editor.setContent('<p>* something\n· something else</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 3);
});
test("Does not count htmlentities", function() {
expect(1);
editor.setContent('<p>It&rsquo;s my life &ndash; &#8211; &#x2013; don\'t you forget.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 6);
});
test("Counts hyphenated words as one word", function() {
expect(1);
editor.setContent('<p>Hello some-word here.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 3);
});
test("Counts words between blocks as two words", function() {
expect(1);
editor.setContent('<p>Hello</p><p>world</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 2);
});
/*
The blocking functionality in the wordcount plugin prevents this code from
being tested correctly.
I'm of the opinion that the blocking code isn't really doing
anything crucial, and should be ripped out, so this module can be tested.
---------
test("should set the word count in the target html element", function() {
expect(1);
editor.setContent('<p>Hey, it\'s me!</p>');
equal(parseInt(document.getElementById('elm1-word-count').innerHTML), 3);
});
*/
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
wordcount_target_id: 'current-count',
plugins : 'wordcount',
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
<h1 id="qunit-header">Unit tests for the Wordcount plugin</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="word-count">
Current Count: <span id="current-count"></span>
</div>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

81
tests/qunit/editor/plugins/wordcount.js Normal file
View File

@@ -0,0 +1,81 @@
module("tinymce.plugins.Wordcount", {
setupModule: function() {
QUnit.stop();
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
wordcount_target_id: 'current-count',
plugins: 'wordcount',
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test("Blank document has 0 words", function() {
expect(1);
editor.setContent('');
var result = editor.plugins.wordcount.getCount();
equal(result, 0);
});
test("Simple word count", function() {
expect(1);
editor.setContent('<p>My sentence is this.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 4);
});
test("Does not count dashes", function() {
expect(1);
editor.setContent('<p>Something -- ok</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 2);
});
test("Does not count asterisks, non-word characters", function() {
expect(1);
editor.setContent('<p>* something\n\u00b7 something else</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 3);
});
test("Does not count numbers", function() {
expect(1);
editor.setContent('<p>Something 123 ok</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 2);
});
test("Does not count htmlentities", function() {
expect(1);
editor.setContent('<p>It&rsquo;s my life &ndash; &#8211; &#x2013; don\'t you forget.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 6);
});
test("Counts hyphenated words as one word", function() {
expect(1);
editor.setContent('<p>Hello some-word here.</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 3);
});
test("Counts words between blocks as two words", function() {
expect(1);
editor.setContent('<p>Hello</p><p>world</p>');
var result = editor.plugins.wordcount.getCount();
equal(result, 2);
});

BIN
tests/qunit/editor/test.gif
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 43 B

80
tests/qunit/editor/tinymce/Editor.html → tests/qunit/editor/tinymce/Editor.js
View File

@@ -1,20 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.Editor</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.Editor", {
autostart: false
setupModule: function() {
QUnit.stop();
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
disable_nodechange: true,
skin: false,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
custom_elements: 'custom1,~custom2',
extended_valid_elements: 'custom1,custom2',
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test('Event: change', function() {
@@ -34,7 +38,7 @@ test('Event: change', function() {
});
test('Event: beforeExecCommand', function() {
var level, lastLevel, cmd, ui, value;
var cmd, ui, value;
editor.on('BeforeExecCommand', function(e) {
cmd = e.command;
@@ -142,19 +146,19 @@ test('editor_methods - getParam', function() {
expect(5);
editor.settings.test = 'a,b,c';
equal(editor.getParam('test', '', 'hash')['c'], 'c');
equal(editor.getParam('test', '', 'hash').c, 'c');
editor.settings.test = 'a';
equal(editor.getParam('test', '', 'hash')['a'], 'a');
equal(editor.getParam('test', '', 'hash').a, 'a');
editor.settings.test = 'a=b';
equal(editor.getParam('test', '', 'hash')['a'], 'b');
equal(editor.getParam('test', '', 'hash').a, 'b');
editor.settings.test = 'a=b;c=d,e';
equal(editor.getParam('test', '', 'hash')['c'], 'd,e');
equal(editor.getParam('test', '', 'hash').c, 'd,e');
editor.settings.test = 'a=b,c=d';
equal(editor.getParam('test', '', 'hash')['c'], 'd');
equal(editor.getParam('test', '', 'hash').c, 'd');
});
test('setContent', function() {
@@ -165,7 +169,7 @@ test('setContent', function() {
function callback(e) {
e.content = e.content.replace(/test/, 'X');
count++;
};
}
editor.on('SetContent', callback);
editor.on('BeforeSetContent', callback);
@@ -189,33 +193,3 @@ test('custom elements', function() {
equal(editor.getContent().replace(/[\r\n]/g, ''), '<custom1>c1</custom1><p><custom2>c1</custom2></p>');
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
custom_elements: 'custom1,~custom2',
extended_valid_elements: 'custom1,custom2',
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for tinymce.Editor</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

159
tests/qunit/editor/tinymce/EditorCommands.html → tests/qunit/editor/tinymce/EditorCommands.js
View File

@@ -1,25 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.EditorCommands</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.EditorCommands", {
autostart: false
setupModule: function() {
QUnit.stop();
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
disable_nodechange: true,
indent: false,
skin: false,
entities: 'raw',
convert_urls: false,
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,padding-left,text-align,display'
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
function getContent() {
return editor.getContent({format:'raw'}).toLowerCase().replace(/[\r\n]+/g, '');
};
}
test('mceInsertContent - p inside text of p', function() {
var rng;
@@ -34,7 +38,7 @@ test('mceInsertContent - p inside text of p', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<p>abc</p>');
equal(getContent(), '<p>1</p><p>abc</p><p>4</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -55,7 +59,7 @@ test('mceInsertContent - p inside whole p', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<p>abc</p>');
equal(getContent(), '<p>abc</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -76,7 +80,7 @@ test('mceInsertContent - pre in text of pre', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<pre>abc</pre>');
equal(getContent(), '<pre>1</pre><pre>abc</pre><pre>4</pre>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'PRE');
equal(rng.startOffset, 1);
@@ -97,7 +101,7 @@ test('mceInsertContent - h1 in text of h1', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<h1>abc</h1>');
equal(getContent(), '<h1>1</h1><h1>abc</h1><h1>4</h1>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'H1');
equal(rng.startOffset, 1);
@@ -118,7 +122,7 @@ test('mceInsertContent - li inside li', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<li>abc</li>');
equal(getContent(), '<ul><li>1</li><li>abc</li><li>4</li></ul>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'LI');
equal(rng.startOffset, 1);
@@ -135,7 +139,7 @@ test('mceInsertContent - p inside empty editor', function() {
editor.setContent('');
editor.execCommand('mceInsertContent', false, '<p>abc</p>');
equal(getContent(), '<p>abc</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -150,10 +154,10 @@ test('mceInsertContent - text inside empty p', function() {
expect(7);
editor.getBody().innerHTML = '<p></p>';
setSelection('p', 0);
Utils.setSelection('p', 0);
editor.execCommand('mceInsertContent', false, 'abc');
equal(editor.getBody().innerHTML.toLowerCase().replace(/^<br>/, ''), '<p>abc</p>'); // Opera inserts a BR at the beginning of contents if the P is empty
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -174,7 +178,7 @@ test('mceInsertContent - text inside empty p with br caret node', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, 'abc');
equal(editor.getBody().innerHTML.toLowerCase(), '<p>abc</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -195,7 +199,7 @@ test('mceInsertContent - image inside p', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<img src="about:blank" />');
equal(editor.getContent(), '<p><img src="about:blank" alt="" /></p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer.nodeName, 'P');
equal(rng.startOffset, 1);
@@ -230,7 +234,7 @@ test('mceInsertContent - hr', function() {
editor.selection.setRng(rng);
editor.execCommand('mceInsertContent', false, '<hr />');
equal(editor.getContent(), '<p>1</p><hr /><p>3</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer, editor.getBody().lastChild);
equal(rng.startContainer.nodeName, 'P');
@@ -240,8 +244,6 @@ test('mceInsertContent - hr', function() {
});
test('mceInsertContent - forced root block', function() {
var rng;
expect(1);
// Forced root block
@@ -252,13 +254,11 @@ test('mceInsertContent - forced root block', function() {
});
test('mceInsertContent - mixed inline content inside td', function() {
var rng;
expect(1);
// Forced root block
editor.getBody().innerHTML = '<table><tr><td>X</td></tr></table>';
setSelection('td', 0, 'td', 0);
Utils.setSelection('td', 0, 'td', 0);
editor.execCommand('mceInsertContent', false, 'test<b>123</b><!-- a -->');
equal(editor.getContent(), '<table><tbody><tr><td>test<strong>123</strong><!-- a -->X</td></tr></tbody></table>');
});
@@ -267,7 +267,7 @@ test('mceInsertContent - invalid insertion with spans on page', function(){
var startingContent = '<p>123 testing <em>span later in document</em></p>',
insertedContent = '<ul><li>u</li><li>l</li></ul>';
editor.setContent(startingContent);
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].firstChild, 0);
editor.selection.setRng(rng);
@@ -278,35 +278,35 @@ test('mceInsertContent - invalid insertion with spans on page', function(){
test('mceInsertContent - text with space before at start of block', function() {
editor.getBody().innerHTML = '<p>a</p>';
setSelection('p', 0);
Utils.setSelection('p', 0);
editor.execCommand('mceInsertContent', false, ' b');
equal(editor.getContent(), '<p>\u00a0ba</p>');
});
test('mceInsertContent - text with space after at end of block', function() {
editor.getBody().innerHTML = '<p>a</p>';
setSelection('p', 1);
Utils.setSelection('p', 1);
editor.execCommand('mceInsertContent', false, 'b ');
equal(editor.getContent(), '<p>ab\u00a0</p>');
});
test('mceInsertContent - text with space before/after at middle of block', function() {
editor.getBody().innerHTML = '<p>ac</p>';
setSelection('p', 1);
Utils.setSelection('p', 1);
editor.execCommand('mceInsertContent', false, ' b ');
equal(editor.getContent(), '<p>a b c</p>');
});
test('mceInsertContent - inline element with space before/after at middle of block', function() {
editor.getBody().innerHTML = '<p>ac</p>';
setSelection('p', 1);
Utils.setSelection('p', 1);
editor.execCommand('mceInsertContent', false, ' <em>b</em> ');
equal(editor.getContent(), '<p>a <em>b</em> c</p>');
});
test('mceInsertContent - block element with space before/after at middle of block', function() {
editor.getBody().innerHTML = '<p>ac</p>';
setSelection('p', 1);
Utils.setSelection('p', 1);
editor.execCommand('mceInsertContent', false, ' <p>b</p> ');
equal(editor.getContent(), '<p>a</p><p>b</p><p>c</p>');
});
@@ -323,7 +323,7 @@ test('InsertHorizontalRule', function() {
editor.selection.setRng(rng);
editor.execCommand('InsertHorizontalRule');
equal(editor.getContent(), '<p>1</p><hr /><p>3</p>');
rng = normalizeRng(editor.selection.getRng(true));
rng = Utils.normalizeRng(editor.selection.getRng(true));
ok(rng.collapsed);
equal(rng.startContainer, editor.getBody().lastChild);
equal(rng.startContainer.nodeName, 'P');
@@ -334,14 +334,12 @@ test('InsertHorizontalRule', function() {
test('Justify - multiple block elements selected - queryCommandState', function() {
editor.setContent('<div style="text-align: left;"><div id="a" style="text-align: right;">one</div><div id="b" style="text-align: right;">two</div></div>');
setSelection('#a', 0, '#b', 3);
Utils.setSelection('#a', 0, '#b', 3);
equal(editor.queryCommandState('JustifyLeft'), false);
ok(editor.queryCommandState('JustifyRight'));
});
test('Formatting commands (xhtmlTextStyles)', function() {
var c;
expect(19);
editor.focus();
editor.setContent('test 123');
@@ -367,7 +365,7 @@ test('Formatting commands (xhtmlTextStyles)', function() {
editor.setContent('test 123');
editor.execCommand('SelectAll');
editor.execCommand('FontName',false,'Arial');
equal(editor.getContent(), '<p><span style="font-family: ' + fontFace('Arial') + ';">test 123</span></p>');
equal(editor.getContent(), '<p><span style="font-family: ' + Utils.fontFace('Arial') + ';">test 123</span></p>');
editor.setContent('test 123');
editor.execCommand('SelectAll');
@@ -403,19 +401,19 @@ test('Formatting commands (xhtmlTextStyles)', function() {
equal(editor.getContent(), '<p><span style="text-decoration: line-through;">test 123</span></p>');
editor.setContent('<p><font face="Arial">test 123</font></p>');
equal(editor.getContent(), '<p><span style="font-family: ' + fontFace('Arial') + ';">test 123</span></p>');
equal(editor.getContent(), '<p><span style="font-family: ' + Utils.fontFace('Arial') + ';">test 123</span></p>');
editor.setContent('<p><font size="7">test 123</font></p>');
equal(editor.getContent(), '<p><span style="font-size: 300%;">test 123</span></p>');
editor.setContent('<p><font face="Arial" size="7">test 123</font></p>');
equal(editor.getContent(), '<p><span style="font-size: 300%; font-family: ' + fontFace('Arial') + ';">test 123</span></p>');
equal(editor.getContent(), '<p><span style="font-size: 300%; font-family: ' + Utils.fontFace('Arial') + ';">test 123</span></p>');
editor.setContent('<font style="background-color: #ff0000" color="#ff0000">test</font><font face="Arial">test</font>');
equal(editor.getContent(), '<p><span style="color: #ff0000; background-color: #ff0000;">test</span><span style="font-family: ' + fontFace('Arial') + ';">test</span></p>');
equal(editor.getContent(), '<p><span style="color: #ff0000; background-color: #ff0000;">test</span><span style="font-family: ' + Utils.fontFace('Arial') + ';">test</span></p>');
editor.setContent('<p><font face="Arial" style="color: #ff0000">test 123</font></p>');
equal(editor.getContent(), '<p><span style="color: #ff0000; font-family: ' + fontFace('Arial') + ';">test 123</span></p>');
equal(editor.getContent(), '<p><span style="color: #ff0000; font-family: ' + Utils.fontFace('Arial') + ';">test 123</span></p>');
});
test('Formatting commands (alignInline)', function() {
@@ -441,20 +439,20 @@ test('Formatting commands (alignInline)', function() {
editor.execCommand('JustifyFull');
equal(editor.getContent(), '<p style="text-align: justify;">test 123</p>');
editor.setContent('<img src="../media/logo.jpg" />');
editor.setContent('<img src="tinymce/ui/img/raster.gif" />');
editor.selection.select(editor.dom.select('img')[0]);
editor.execCommand('JustifyLeft');
equal(editor.getContent(), '<p><img style="float: left;" src="../media/logo.jpg" alt="" /></p>');
equal(editor.getContent(), '<p><img style="float: left;" src="tinymce/ui/img/raster.gif" alt="" /></p>');
editor.setContent('<img src="../media/logo.jpg" />');
editor.setContent('<img src="tinymce/ui/img/raster.gif" />');
editor.selection.select(editor.dom.select('img')[0]);
editor.execCommand('JustifyCenter');
equal(editor.getContent(), '<p><img style="margin-right: auto; margin-left: auto; display: block;" src="../media/logo.jpg" alt="" /></p>');
equal(editor.getContent(), '<p><img style="margin-right: auto; margin-left: auto; display: block;" src="tinymce/ui/img/raster.gif" alt="" /></p>');
editor.setContent('<img src="../media/logo.jpg" />');
editor.setContent('<img src="tinymce/ui/img/raster.gif" />');
editor.selection.select(editor.dom.select('img')[0]);
editor.execCommand('JustifyRight');
equal(editor.getContent(), '<p><img style="float: right;" src="../media/logo.jpg" alt="" /></p>');
equal(editor.getContent(), '<p><img style="float: right;" src="tinymce/ui/img/raster.gif" alt="" /></p>');
});
test('mceBlockQuote', function() {
@@ -582,7 +580,7 @@ test('mceInsertLink (link adjacent text)', function() {
rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.lastChild, 0);
rng.setEnd(editor.getBody().firstChild.lastChild, 1);
rng.setEnd(editor.getBody().firstChild.lastChild, 1);
editor.selection.setRng(rng);
editor.execCommand('mceInsertLink', false, 'link');
@@ -590,20 +588,16 @@ test('mceInsertLink (link adjacent text)', function() {
});
test('mceInsertLink (link text inside text)', function() {
var rng;
expect(1);
editor.setContent('<p><a href="#"><em>abc</em></a></p>');
setSelection('em', 1, 'em', 2);
Utils.setSelection('em', 1, 'em', 2);
editor.execCommand('mceInsertLink', false, 'link');
equal(editor.getContent(), '<p><a href="link"><em>abc</em></a></p>');
});
test('mceInsertLink (link around existing links)', function() {
var rng;
expect(1);
editor.setContent('<p><a href="#1">1</a><a href="#2">2</a></p>');
@@ -614,8 +608,6 @@ test('mceInsertLink (link around existing links)', function() {
});
test('mceInsertLink (link around existing links with different attrs)', function() {
var rng;
expect(1);
editor.setContent('<p><a id="a" href="#1">1</a><a id="b" href="#2">2</a></p>');
@@ -626,8 +618,6 @@ test('mceInsertLink (link around existing links with different attrs)', function
});
test('mceInsertLink (link around existing complex contents with links)', function() {
var rng;
expect(1);
editor.setContent('<p><span id="s1"><strong><a id="a" href="#1"><em>1</em></a></strong></span><span id="s2"><em><a id="b" href="#2"><strong>2</strong></a></em></span></p>');
@@ -638,12 +628,10 @@ test('mceInsertLink (link around existing complex contents with links)', functio
});
test('mceInsertLink (link text inside link)', function() {
var rng;
expect(1);
editor.setContent('<p><a href="#">test</a></p>');
setSelection('p', 0, 'p', 1);
Utils.setSelection('p', 0, 'p', 1);
editor.execCommand('SelectAll');
editor.execCommand('mceInsertLink', false, 'link');
@@ -651,8 +639,6 @@ test('mceInsertLink (link text inside link)', function() {
});
test('unlink', function() {
expect(1);
editor.setContent('<p><a href="test">test</a> <a href="test">123</a></p>');
editor.execCommand('SelectAll');
editor.execCommand('unlink');
@@ -713,8 +699,6 @@ test('indent/outdent', function() {
});
test('RemoveFormat', function() {
var t = this;
expect(4);
editor.setContent('<p><em>test</em> <strong>123</strong> <a href="123">123</a> 123</p>');
@@ -736,35 +720,4 @@ test('RemoveFormat', function() {
editor.execCommand('SelectAll');
editor.execCommand('RemoveFormat');
equal(editor.getContent(), '<p>dfn tag code tag samp tag kbd tag var tag cite tag mark tag q tag</p>');
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
indent : false,
entities : 'raw',
convert_urls : false,
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,padding-left,text-align,display'
},
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for tinymce.EditorCommands</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>
});

686
tests/qunit/editor/tinymce/EnterKey.html → tests/qunit/editor/tinymce/EnterKey.js
View File

File diff suppressed because it is too large Load Diff

116
tests/qunit/editor/tinymce/ForceBlocks.html
View File

@@ -1,116 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.ForceBlocks</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.ForceBlocks", {
autostart: false,
setup: function() {
editor.settings.forced_root_block = 'p';
editor.settings.forced_root_block_attrs = null;
}
});
function pressArrowKey(evt) {
var dom = editor.dom, target = editor.selection.getNode();
evt = tinymce.extend({keyCode: 37}, evt);
dom.fire(target, 'keydown', evt);
dom.fire(target, 'keypress', evt);
dom.fire(target, 'keyup', evt);
}
test('Wrap single root text node in P', function() {
editor.getBody().innerHTML = 'abcd';
setSelection('body', 2);
pressArrowKey();
equal(cleanHtml(editor.getBody().innerHTML), '<p>abcd</p>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap single root text node in P with attrs', function() {
editor.settings.forced_root_block_attrs = {"class": "class1"};
editor.getBody().innerHTML = 'abcd';
setSelection('body', 2);
pressArrowKey();
equal(editor.getContent(), '<p class="class1">abcd</p>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap single root text node in P but not table sibling', function() {
editor.getBody().innerHTML = 'abcd<table><tr><td>x</td></tr></table>';
setSelection('body', 2);
pressArrowKey();
equal(cleanHtml(editor.getBody().innerHTML), '<p>abcd</p><table><tbody><tr><td>x</td></tr></tbody></table>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap root em in P but not table sibling', function() {
editor.getBody().innerHTML = '<em>abcd</em><table><tr><td>x</td></tr></table>';
setSelection('em', 2);
pressArrowKey();
equal(cleanHtml(editor.getBody().innerHTML), '<p><em>abcd</em></p><table><tbody><tr><td>x</td></tr></tbody></table>');
equal(editor.selection.getNode().nodeName, 'EM');
});
test('Wrap single root text node in DIV', function() {
editor.settings.forced_root_block = 'div';
editor.getBody().innerHTML = 'abcd';
setSelection('body', 2);
pressArrowKey();
equal(cleanHtml(editor.getBody().innerHTML), '<div>abcd</div>');
equal(editor.selection.getNode().nodeName, 'DIV');
});
test('Remove empty root text nodes', function() {
var body = editor.getBody();
editor.settings.forced_root_block = 'div';
editor.getBody().innerHTML = 'abcd<div>abcd</div>';
setSelection('body', 2);
body.insertBefore(editor.getDoc().createTextNode(''), body.firstChild);
body.appendChild(editor.getDoc().createTextNode(''));
pressArrowKey();
equal(cleanHtml(body.innerHTML), '<div>abcd</div><div>abcd</div>');
equal(editor.selection.getNode().nodeName, 'DIV');
equal(body.childNodes.length, 2);
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
indent : false,
schema: 'html5',
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for tinymce.ForceBlocks</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
</body>
</html>

82
tests/qunit/editor/tinymce/ForceBlocks.js Normal file
View File

@@ -0,0 +1,82 @@
module("tinymce.ForceBlocks", {
autostart: false,
setupModule: function() {
QUnit.stop();
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
indent: false,
skin: false,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
},
teardown: function() {
editor.settings.forced_root_block = 'p';
editor.settings.forced_root_block_attrs = null;
}
});
test('Wrap single root text node in P', function() {
editor.getBody().innerHTML = 'abcd';
Utils.setSelection('body', 2);
Utils.pressArrowKey();
equal(Utils.cleanHtml(editor.getBody().innerHTML), '<p>abcd</p>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap single root text node in P with attrs', function() {
editor.settings.forced_root_block_attrs = {"class": "class1"};
editor.getBody().innerHTML = 'abcd';
Utils.setSelection('body', 2);
Utils.pressArrowKey();
equal(editor.getContent(), '<p class="class1">abcd</p>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap single root text node in P but not table sibling', function() {
editor.getBody().innerHTML = 'abcd<table><tr><td>x</td></tr></table>';
Utils.setSelection('body', 2);
Utils.pressArrowKey();
equal(Utils.cleanHtml(editor.getBody().innerHTML), '<p>abcd</p><table><tbody><tr><td>x</td></tr></tbody></table>');
equal(editor.selection.getNode().nodeName, 'P');
});
test('Wrap root em in P but not table sibling', function() {
editor.getBody().innerHTML = '<em>abcd</em><table><tr><td>x</td></tr></table>';
Utils.setSelection('em', 2);
Utils.pressArrowKey();
equal(Utils.cleanHtml(editor.getBody().innerHTML), '<p><em>abcd</em></p><table><tbody><tr><td>x</td></tr></tbody></table>');
equal(editor.selection.getNode().nodeName, 'EM');
});
test('Wrap single root text node in DIV', function() {
editor.settings.forced_root_block = 'div';
editor.getBody().innerHTML = 'abcd';
Utils.setSelection('body', 2);
Utils.pressArrowKey();
equal(Utils.cleanHtml(editor.getBody().innerHTML), '<div>abcd</div>');
equal(editor.selection.getNode().nodeName, 'DIV');
});
test('Remove empty root text nodes', function() {
var body = editor.getBody();
editor.settings.forced_root_block = 'div';
editor.getBody().innerHTML = 'abcd<div>abcd</div>';
Utils.setSelection('body', 2);
body.insertBefore(editor.getDoc().createTextNode(''), body.firstChild);
body.appendChild(editor.getDoc().createTextNode(''));
Utils.pressArrowKey();
equal(Utils.cleanHtml(body.innerHTML), '<div>abcd</div><div>abcd</div>');
equal(editor.selection.getNode().nodeName, 'DIV');
equal(body.childNodes.length, 2);
});

1013
tests/qunit/editor/tinymce/Formatter_apply.html → tests/qunit/editor/tinymce/Formatter_apply.js
View File

File diff suppressed because it is too large Load Diff

190
tests/qunit/editor/tinymce/Formatter_check.html → tests/qunit/editor/tinymce/Formatter_check.js
View File

@@ -1,30 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for check formatting</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="../js/utils.js"></script>
<script>
var editor, inlineEditor, rng, format;
module("tinymce.Formatter - Check", {
setupModule: function() {
document.getElementById('view').innerHTML = '<textarea id="elm1"></textarea><div id="elm2"></div>';
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Check formatting", {
autostart: false
tinymce.init({
selector: "#elm1",
add_unload_trigger: false,
extended_valid_elements: 'b,i,span[style|contenteditable]',
skin: false,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback: function(ed) {
window.editor = ed;
if (window.inlineEditor) {
QUnit.start();
}
}
});
tinymce.init({
selector: "#elm2",
inline: true,
add_unload_trigger: false,
indent: false,
skin: false,
convert_fonts_to_spans: false,
disable_nodechange: true,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback: function(ed) {
window.inlineEditor = ed;
if (window.editor) {
QUnit.start();
}
}
});
}
});
function getContent() {
return editor.getContent().toLowerCase().replace(/[\r\n]+/g, '');
};
test('Selected style element text', function() {
editor.formatter.register('bold', {inline : 'b'});
editor.formatter.register('bold', {inline: 'b'});
editor.getBody().innerHTML = '<p><b>1234</b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 0);
rng.setEnd(editor.dom.select('b')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -32,9 +55,9 @@ test('Selected style element text', function() {
});
test('Selected style element with css styles', function() {
editor.formatter.register('color', {inline : 'span', styles : {color : '#ff0000'}});
editor.formatter.register('color', {inline: 'span', styles: {color: '#ff0000'}});
editor.getBody().innerHTML = '<p><span style="color:#ff0000">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 0);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -42,9 +65,9 @@ test('Selected style element with css styles', function() {
});
test('Selected style element with attributes', function() {
editor.formatter.register('fontsize', {inline : 'font', attributes : {size : '7'}});
editor.formatter.register('fontsize', {inline: 'font', attributes: {size: '7'}});
editor.getBody().innerHTML = '<p><font size="7">1234</font></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('font')[0].firstChild, 0);
rng.setEnd(editor.dom.select('font')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -53,11 +76,11 @@ test('Selected style element with attributes', function() {
test('Selected style element text multiple formats', function() {
editor.formatter.register('multiple', [
{inline : 'b'},
{inline : 'strong'}
{inline: 'b'},
{inline: 'strong'}
]);
editor.getBody().innerHTML = '<p><strong>1234</strong></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('strong')[0].firstChild, 0);
rng.setEnd(editor.dom.select('strong')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -65,9 +88,9 @@ test('Selected style element text multiple formats', function() {
});
test('Selected complex style element', function() {
editor.formatter.register('complex', {inline : 'span', styles : {fontWeight : 'bold'}});
editor.formatter.register('complex', {inline: 'span', styles: {fontWeight: 'bold'}});
editor.getBody().innerHTML = '<p><span style="color:#ff0000; font-weight:bold">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 0);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -75,9 +98,9 @@ test('Selected complex style element', function() {
});
test('Selected non style element text', function() {
editor.formatter.register('bold', {inline : 'b'});
editor.formatter.register('bold', {inline: 'b'});
editor.getBody().innerHTML = '<p>1234</p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -85,9 +108,9 @@ test('Selected non style element text', function() {
});
test('Selected partial style element (start)', function() {
editor.formatter.register('bold', {inline : 'b'});
editor.formatter.register('bold', {inline: 'b'});
editor.getBody().innerHTML = '<p><b>1234</b>5678</p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].lastChild, 4);
editor.selection.setRng(rng);
@@ -95,9 +118,9 @@ test('Selected partial style element (start)', function() {
});
test('Selected partial style element (end)', function() {
editor.formatter.register('bold', {inline : 'b'});
editor.formatter.register('bold', {inline: 'b'});
editor.getBody().innerHTML = '<p>1234<b>5678</b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('b')[0].lastChild, 4);
editor.selection.setRng(rng);
@@ -105,9 +128,9 @@ test('Selected partial style element (end)', function() {
});
test('Selected element text with parent inline element', function() {
editor.formatter.register('bold', {inline : 'b'});
editor.formatter.register('bold', {inline: 'b'});
editor.getBody().innerHTML = '<p><b><em><span>1234</span></em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 0);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -115,31 +138,31 @@ test('Selected element text with parent inline element', function() {
});
test('Selected element match with variable', function() {
editor.formatter.register('complex', {inline : 'span', styles : {color : '%color'}});
editor.formatter.register('complex', {inline: 'span', styles: {color: '%color'}});
editor.getBody().innerHTML = '<p><span style="color:#ff0000">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 0);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
ok(editor.formatter.match('complex', {color : '#ff0000'}), 'Selected element match with variable');
ok(editor.formatter.match('complex', {color: '#ff0000'}), 'Selected element match with variable');
});
test('Selected element match with variable and function', function() {
editor.formatter.register('complex', {
inline : 'span',
styles : {
color : function(vars) {
inline: 'span',
styles: {
color: function(vars) {
return vars.color + '00';
}
}
});
editor.getBody().innerHTML = '<p><span style="color:#ff0000">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 0);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
ok(editor.formatter.match('complex', {color : '#ff00'}), 'Selected element match with variable and function');
ok(editor.formatter.match('complex', {color: '#ff00'}), 'Selected element match with variable and function');
});
test('formatChanged simple format', function() {
@@ -151,7 +174,7 @@ test('formatChanged simple format', function() {
});
editor.getBody().innerHTML = '<p>text</p>';
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
// Check apply
editor.formatter.apply('bold');
@@ -173,7 +196,7 @@ test('formatChanged simple format', function() {
test('formatChanged complex format', function() {
var newState, newArgs;
editor.formatter.register('complex', {inline : 'span', styles : {color : '%color'}});
editor.formatter.register('complex', {inline: 'span', styles: {color: '%color'}});
editor.formatter.formatChanged('complex', function(state, args) {
newState = state;
@@ -181,7 +204,7 @@ test('formatChanged complex format', function() {
}, true);
editor.getBody().innerHTML = '<p>text</p>';
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
// Check apply
editor.formatter.apply('complex', {color: '#FF0000'});
@@ -205,70 +228,3 @@ test('Match format on div block in inline mode', function() {
inlineEditor.execCommand('SelectAll');
ok(!inlineEditor.formatter.match('div'), 'Formatter.match on div says true');
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
theme_advanced_styles : 'test1=test1;test2=test2',
valid_elements : '@[id|class|style|title|dir<ltr?rtl|lang|xml::lang|onclick|ondblclick|onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|onkeydown|onkeyup],a[rel|rev|charset|hreflang|tabindex|accesskey|type|name|href|target|title|class|onfocus|onblur],strong,b,em,i,strike,u,#p,-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup,-blockquote[cite],-table[border|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],object[classid|width|height|codebase|*],param[name|value],embed[type|width|height|src|*],script[src|type],map[name],area[shape|coords|href|alt|target],bdo,button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method],input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value|tabindex|accesskey],kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value],q[cite],samp,select[disabled|multiple|name|size],small,textarea[cols|rows|disabled|name|readonly],tt,var,big',
fix_list_elements : 0,
fix_table_elements : 0,
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback : function(ed) {
editor = ed;
if (inlineEditor) {
QUnit.start();
}
}
});
// WP
var url = document.location.href.substring( 0, document.location.href.lastIndexOf('tinymce/') );
tinymce.init({
selector: "#elm2",
inline: true,
// WP
external_plugins: {
noneditable: url + 'external-plugins/noneditable/plugin.js'
},
// WP end
add_unload_trigger: false,
indent: false,
theme_advanced_styles: 'test1=test1;test2=test2',
forced_root_block: '',
convert_fonts_to_spans: false,
disable_nodechange: true,
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
init_instance_callback: function(ed) {
inlineEditor = ed;
if (editor) {
QUnit.start();
}
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for text formatting</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
<div id="elm2"></div>
</body>
</html>

157
tests/qunit/editor/tinymce/Formatter_remove.html → tests/qunit/editor/tinymce/Formatter_remove.js
View File

@@ -1,30 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for remove formatting</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor, rng, format;
module("tinymce.Formatter - Remove", {
setupModule: function() {
document.getElementById('view').innerHTML = '<textarea id="elm1"></textarea><div id="elm2"></div>';
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Remove formatting", {
autostart: false
tinymce.init({
selector: "textarea",
external_plugins: {
noneditable: '../../../../tests/qunit/editor/external-plugins/noneditable/plugin.min.js'
},
indent: false,
add_unload_trigger: false,
skin: false,
extended_valid_elements: 'b,i,span[style|contenteditable]',
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
disable_nodechange: true,
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
function getContent() {
return editor.getContent().toLowerCase().replace(/[\r]+/g, '');
};
}
test('Inline element on selected text', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b>1234</b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 0);
rng.setEnd(editor.dom.select('b')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -35,7 +43,7 @@ test('Inline element on selected text', function() {
test('Inline element on selected text with remove=all', function() {
editor.formatter.register('format', {selector : 'b', remove : 'all'});
editor.getBody().innerHTML = '<p><b title="text">1234</b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 0);
rng.setEnd(editor.dom.select('b')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -46,7 +54,7 @@ test('Inline element on selected text with remove=all', function() {
test('Inline element on selected text with remove=none', function() {
editor.formatter.register('format', {selector : 'span', styles : {fontWeight : 'bold'}, remove : 'none'});
editor.getBody().innerHTML = '<p><span style="font-weight:bold">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('p')[0], 1);
editor.selection.setRng(rng);
@@ -57,7 +65,7 @@ test('Inline element on selected text with remove=none', function() {
test('Inline element style where element is format root', function() {
editor.formatter.register('format', {inline : 'span', styles : {fontWeight : 'bold'}});
editor.getBody().innerHTML = '<p><span style="font-weight:bold; color:#FF0000"><em>1234</em></span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('em')[0].firstChild, 1);
rng.setEnd(editor.dom.select('em')[0].firstChild, 3);
editor.selection.setRng(rng);
@@ -73,7 +81,7 @@ test('Inline element style where element is format root', function() {
test('Partially selected inline element text', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b>1234</b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 2);
rng.setEnd(editor.dom.select('b')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -84,7 +92,7 @@ test('Partially selected inline element text', function() {
test('Partially selected inline element text with children', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b><em><span>1234</span></em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[0].firstChild, 2);
rng.setEnd(editor.dom.select('span')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -95,7 +103,7 @@ test('Partially selected inline element text with children', function() {
test('Partially selected inline element text with complex children', function() {
editor.formatter.register('format', {inline : 'span', styles : {fontWeight : 'bold'}});
editor.getBody().innerHTML = '<p><span style="font-weight:bold"><em><span style="color:#ff0000;font-weight:bold">1234</span></em></span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('span')[1].firstChild, 2);
rng.setEnd(editor.dom.select('span')[1].firstChild, 4);
editor.selection.setRng(rng);
@@ -106,7 +114,7 @@ test('Partially selected inline element text with complex children', function()
test('Inline elements with exact flag', function() {
editor.formatter.register('format', {inline : 'span', styles : {color : '#ff0000'}, exact : true});
editor.getBody().innerHTML = '<p><span style="font-size:10px;color:#ff0000">1234</span><span style="font-size:10px;color:#00ff00">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('p')[0], 2);
editor.selection.setRng(rng);
@@ -117,7 +125,7 @@ test('Inline elements with exact flag', function() {
test('Inline elements with variables', function() {
editor.formatter.register('format', {inline : 'span', styles : {color : '%color'}, exact : true});
editor.getBody().innerHTML = '<p><span style="font-size:10px;color:#ff0000">1234</span><span style="font-size:10px;color:#00ff00">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('p')[0], 2);
editor.selection.setRng(rng);
@@ -137,7 +145,7 @@ test('Inline elements with functions and variables', function() {
});
editor.getBody().innerHTML = '<p><span style="font-size:10px;color:#ff0000">1234</span><span style="font-size:10px;color:#00ff00">1234</span></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('p')[0], 2);
editor.selection.setRng(rng);
@@ -150,7 +158,7 @@ test('Inline elements with functions and variables', function() {
test('End within start element', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b>1234<b>5678</b></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('b')[0], 2);
editor.selection.setRng(rng);
@@ -161,7 +169,7 @@ test('End within start element', function() {
test('Start and end within similar format 1', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b><em><b>1234<b>5678</b></b></em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('em')[0], 0);
rng.setEnd(editor.dom.select('b')[1], 2);
editor.selection.setRng(rng);
@@ -172,7 +180,7 @@ test('Start and end within similar format 1', function() {
test('Start and end within similar format 2', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b><em><b>1234</b><b>5678</b></em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('em')[0], 0);
rng.setEnd(editor.dom.select('em')[0], 1);
editor.selection.setRng(rng);
@@ -183,7 +191,7 @@ test('Start and end within similar format 2', function() {
test('Start and end within similar format 3', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b><em><b>1234</b></em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('em')[0], 0);
rng.setEnd(editor.dom.select('em')[0], 1);
editor.selection.setRng(rng);
@@ -194,7 +202,7 @@ test('Start and end within similar format 3', function() {
test('End within start', function() {
editor.formatter.register('format', {inline : 'b'});
editor.getBody().innerHTML = '<p><b><em>x<b>abc</b>y</em></b></p>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0], 0);
rng.setEnd(editor.dom.select('b')[1].firstChild, 3);
editor.selection.setRng(rng);
@@ -205,7 +213,7 @@ test('End within start', function() {
test('Remove block format', function() {
editor.formatter.register('format', {block : 'h1'});
editor.getBody().innerHTML = '<h1>text</h1>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('h1')[0].firstChild, 0);
rng.setEnd(editor.dom.select('h1')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -216,7 +224,7 @@ test('Remove block format', function() {
test('Remove wrapper block format', function() {
editor.formatter.register('format', {block : 'blockquote', wrapper : true});
editor.getBody().innerHTML = '<blockquote><p>text</p></blockquote>';
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].firstChild, 4);
editor.selection.setRng(rng);
@@ -226,7 +234,7 @@ test('Remove wrapper block format', function() {
test('Remove span format within block with style', function() {
editor.formatter.register('format', {selector : 'span', attributes : ['style', 'class'], remove : 'empty', split : true, expand : false, deep : true});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
editor.getBody().innerHTML = '<p style="color:#ff0000"><span style="color:#00ff00">text</span></p>';
rng.setStart(editor.dom.select('span')[0].firstChild, 1);
rng.setEnd(editor.dom.select('span')[0].firstChild, 3);
@@ -237,7 +245,7 @@ test('Remove span format within block with style', function() {
test('Remove and verify start element', function() {
editor.formatter.register('format', {inline : 'b'});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
editor.getBody().innerHTML = '<p><b>text</b></p>';
rng.setStart(editor.dom.select('b')[0].firstChild, 1);
rng.setEnd(editor.dom.select('b')[0].firstChild, 3);
@@ -251,7 +259,7 @@ test('Remove with selection collapsed ensure correct caret position', function()
var content = '<p>test</p><p>testing</p>';
editor.formatter.register('format', {block : 'p'});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
editor.getBody().innerHTML = content;
rng.setStart(editor.dom.select('p')[0].firstChild, 4);
rng.setEnd(editor.dom.select('p')[0].firstChild, 4);
@@ -264,7 +272,7 @@ test('Remove with selection collapsed ensure correct caret position', function()
test('Caret format at middle of text', function() {
editor.setContent('<p><b>abc</b></p>');
editor.formatter.register('format', {inline: 'b'});
setSelection('b', 1, 'b', 1);
Utils.setSelection('b', 1, 'b', 1);
editor.formatter.remove('format');
equal(editor.getContent(), '<p>abc</p>');
});
@@ -272,53 +280,51 @@ test('Caret format at middle of text', function() {
test('Caret format at end of text', function() {
editor.setContent('<p><b>abc</b></p>');
editor.formatter.register('format', {inline: 'b'});
setSelection('b', 3, 'b', 3);
Utils.setSelection('b', 3, 'b', 3);
editor.formatter.remove('format');
type('d');
Utils.type('d');
equal(editor.getContent(), '<p><b>abc</b>d</p>');
});
test('Caret format at end of text inside other format', function() {
editor.setContent('<p><em><b>abc</b></em></p>');
editor.formatter.register('format', {inline: 'b'});
setSelection('b', 3, 'b', 3);
Utils.setSelection('b', 3, 'b', 3);
editor.formatter.remove('format');
type('d');
Utils.type('d');
equal(editor.getContent(), '<p><em><b>abc</b>d</em></p>');
});
test('Caret format at end of text inside other format with text after 1', function() {
editor.setContent('<p><em><b>abc</b></em>e</p>');
editor.formatter.register('format', {inline: 'b'});
setSelection('b', 3, 'b', 3);
Utils.setSelection('b', 3, 'b', 3);
editor.formatter.remove('format');
type('d');
Utils.type('d');
equal(editor.getContent(), '<p><em><b>abc</b>d</em>e</p>');
});
test('Caret format at end of text inside other format with text after 2', function() {
editor.setContent('<p><em><b>abc</b></em>e</p>');
editor.formatter.register('format', {inline: 'em'});
setSelection('b', 3, 'b', 3);
Utils.setSelection('b', 3, 'b', 3);
editor.formatter.remove('format');
type('d');
Utils.type('d');
equal(editor.getContent(), '<p><em><b>abc</b></em><b>d</b>e</p>');
});
test('Caret format on second word in table cell', function() {
editor.setContent('<table><tbody><tr><td>one <b>two</b></td></tr></tbody></table>');
editor.formatter.register('format', {inline: 'b'});
setSelection('b', 2, 'b', 2);
Utils.setSelection('b', 2, 'b', 2);
editor.formatter.remove('format');
equal(editor.getContent(), '<table><tbody><tr><td>one two</td></tr></tbody></table>');
});
test('contentEditable: false on start and contentEditable: true on end', function() {
var rng;
editor.formatter.register('format', {inline: 'b'});
editor.setContent('<p>abc</p><p contenteditable="false"><b>def</b></p><p><b>ghj</b></p>');
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.dom.select('b')[0].firstChild, 0);
rng.setEnd(editor.dom.select('b')[1].firstChild, 3);
editor.selection.setRng(rng);
@@ -329,7 +335,7 @@ test('contentEditable: false on start and contentEditable: true on end', functio
test('contentEditable: true on start and contentEditable: false on end', function() {
editor.formatter.register('format', {inline: 'b'});
editor.setContent('<p>abc</p><p><b>def</b></p><p contenteditable="false"><b>ghj</b></p>');
setSelection('p:nth-child(2) b', 0, 'p:last b', 3);
Utils.setSelection('p:nth-child(2) b', 0, 'p:last b', 3);
editor.formatter.remove('format');
equal(editor.getContent(), '<p>abc</p><p>def</p><p><b>ghj</b></p>', 'Text in first paragraph is not bold');
});
@@ -337,7 +343,7 @@ test('contentEditable: true on start and contentEditable: false on end', functio
test('contentEditable: true inside contentEditable: false', function() {
editor.formatter.register('format', {inline: 'b'});
editor.setContent('<p>abc</p><p contenteditable="false"><span contenteditable="true"><b>def</b></span></p>');
setSelection('b', 0, 'b', 3);
Utils.setSelection('b', 0, 'b', 3);
editor.formatter.remove('format');
equal(editor.getContent(), '<p>abc</p><p><span>def</span></p>', 'Text is not bold');
});
@@ -345,7 +351,7 @@ test('contentEditable: true inside contentEditable: false', function() {
test('remove format block on contentEditable: false block', function() {
editor.formatter.register('format', {block: 'h1'});
editor.setContent('<p>abc</p><h1 contenteditable="false">def</h1>');
setSelection('h1:nth-child(2)', 0, 'h1:nth-child(2)', 3);
Utils.setSelection('h1:nth-child(2)', 0, 'h1:nth-child(2)', 3);
editor.formatter.remove('format');
equal(editor.getContent(), '<p>abc</p><h1>def</h1>', 'H1 is still not h1');
});
@@ -354,51 +360,8 @@ test('remove format block on contentEditable: false block', function() {
test('Remove format bug 1', function() {
editor.setContent('<p><b>ab<em>cde</em>fgh</b></p>');
editor.formatter.register('format', {inline: 'b'});
setSelection('em', 0, 'em', 2);
Utils.setSelection('em', 0, 'em', 2);
editor.formatter.remove('format');
equal(editor.getContent(), '<p><b>ab</b><em>cd</em><b><em>e</em>fgh</b></p>');
});
*/
// WP
var url = document.location.href.substring( 0, document.location.href.lastIndexOf('tinymce/') );
tinymce.init({
mode : "exact",
elements : "elm1",
// WP
external_plugins: {
noneditable: url + 'external-plugins/noneditable/plugin.js'
},
// WP end
indent : false,
add_unload_trigger : false,
theme_advanced_styles : 'test1=test1;test2=test2',
valid_elements : '@[contenteditable|id|class|style|title|dir<ltr?rtl|lang|xml::lang|onclick|ondblclick|onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|onkeydown|onkeyup],a[rel|rev|charset|hreflang|tabindex|accesskey|type|name|href|target|title|class|onfocus|onblur],strong,b,em,i,strike,u,#p,-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup,-blockquote[cite],-table[border|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],object[classid|width|height|codebase|*],param[name|value],embed[type|width|height|src|*],script[src|type],map[name],area[shape|coords|href|alt|target],bdo,button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method],input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value|tabindex|accesskey],kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value],q[cite],samp,select[disabled|multiple|name|size],small,textarea[cols|rows|disabled|name|readonly],tt,var,big',
fix_list_elements : 0,
fix_table_elements : 0,
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
disable_nodechange: true,
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for text formatting</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

94
tests/qunit/editor/tinymce/Formatter_robot.html
View File

@@ -1,94 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Basic editor functionality tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="../js/jsrobot/robot.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module('Formatting - Robot Tests', {
autostart: false
});
function checkExpectedAfterNewParagraph(expected) {
robot.type('\n', false, function() {
robot.type('g', false, function() {
var actual = editor.getContent();
var cleaned = actual.replace("<br />","");
equal(cleaned, expected);
start();
}, editor.getBody())
}, editor.getBody());
}
asyncTest('Should not be bold after turning off bold and going to a new paragraph', function() {
editor.setContent('<p><strong>text</strong></p>');
// in order for the robot to work well, we need to focus the editor before performing selection on it.
editor.focus();
setSelection("strong",4);
editor.execCommand("Bold");
var expected = '<p><strong>text</strong></p>\n<p>g</p>';
checkExpectedAfterNewParagraph(expected);
});
asyncTest('Format with nested formatting turned off handled correctly', function(){
editor.setContent('<p><strong>bold<em>italic<span style="text-decoration: underline;">under</span></em></strong></p>');
editor.focus();
setSelection("span",5);
editor.execCommand("Italic");
var expected ='<p><strong>bold<em>italic<span style="text-decoration: underline;">under</span></em></strong></p>\n<p><strong><span style="text-decoration: underline;">g</span></strong></p>';
checkExpectedAfterNewParagraph(expected);
});
asyncTest('Format selection over two lines', function(){
editor.setContent("<div id='a'>one</div><div id='b'>two</div>");
editor.focus();
setSelection('#a', 0, '#b', 0);
editor.execCommand('formatBlock', false, 'h1');
equal(editor.dom.select('#a')[0].tagName, 'H1');
equal(editor.dom.select('#b')[0].tagName, 'DIV');
start();
});
var initTinyFunction = function(){
tinymce.init({
mode : "exact",
elements : "elm1",
cleanup: true,
add_unload_trigger : false,
plugins: "table",
init_instance_callback : function(ed) {
editor = ed;
}
});
};
</script>
</head>
<body>
<h1 id="qunit-header">Plugin Dependency Functional tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</div>
<script>
initWhenTinyAndRobotAreReady(initTinyFunction);
</script>
</body>
</html>

106
tests/qunit/editor/tinymce/UndoManager.html → tests/qunit/editor/tinymce/UndoManager.js
View File

@@ -1,21 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.UndoManager tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script>
var editor;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.UndoManager", {
autostart: false
setupModule: function() {
QUnit.stop();
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test('Initial states', function() {
@@ -23,7 +19,7 @@ test('Initial states', function() {
ok(!editor.undoManager.hasUndo());
ok(!editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('One undo level', function() {
@@ -38,7 +34,7 @@ test('One undo level', function() {
ok(editor.undoManager.hasUndo());
ok(!editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('Two undo levels', function() {
@@ -54,7 +50,7 @@ test('Two undo levels', function() {
ok(editor.undoManager.hasUndo());
ok(!editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('No undo levels and one redo', function() {
@@ -69,7 +65,7 @@ test('No undo levels and one redo', function() {
ok(!editor.undoManager.hasUndo());
ok(editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('One undo levels and one redo', function() {
@@ -86,7 +82,7 @@ test('One undo levels and one redo', function() {
ok(editor.undoManager.hasUndo());
ok(editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('Typing state', function() {
@@ -95,11 +91,11 @@ test('Typing state', function() {
expect(2);
editor.dom.fire(editor.getBody(), 'keydown', {keyCode : 65});
ok(editor.undoManager.typing)
editor.dom.fire(editor.getBody(), 'keydown', {keyCode: 65});
ok(editor.undoManager.typing);
editor.dom.fire(editor.getBody(), 'keyup', {keyCode : 13});
ok(!editor.undoManager.typing)
editor.dom.fire(editor.getBody(), 'keyup', {keyCode: 13});
ok(!editor.undoManager.typing);
});
test('Undo and add new level', function() {
@@ -116,7 +112,7 @@ test('Undo and add new level', function() {
ok(editor.undoManager.hasUndo());
ok(!editor.undoManager.hasRedo());
ok(!editor.undoManager.typing)
ok(!editor.undoManager.typing);
});
test('Events', function() {
@@ -153,42 +149,26 @@ test('Events', function() {
ok(redo.bookmark);
});
test('Undo added when typing and losing focus', function() {
editor.focus();
editor.undoManager.clear();
editor.setContent("<p>some text</p>");
setSelection('p', 4, 'p', 9);
type('\b');
asyncTest('Undo added when typing and losing focus', function() {
window.focus();
// Move focus to an input element
var input = document.createElement('input');
document.body.appendChild(input);
input.focus();
input.parentNode.removeChild(input);
window.setTimeout(function() {
start();
editor.execCommand('FormatBlock', false, 'h1');
editor.undoManager.undo();
equal(editor.getContent(), "<p>some</p>");
editor.focus();
editor.undoManager.clear();
editor.setContent("<p>some text</p>");
Utils.setSelection('p', 4, 'p', 9);
Utils.type('\b');
// Move focus to an input element
var input = document.createElement('input');
document.getElementById('view').appendChild(input);
input.focus();
input.parentNode.removeChild(input);
editor.execCommand('FormatBlock', false, 'h1');
editor.undoManager.undo();
equal(editor.getContent(), "<p>some</p>");
}, 0);
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
theme_advanced_styles : 'test1=test1;test2=test2',
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.UndoManager tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"><textarea id="elm1" name="elm1"></textarea></div>
</body>
</html>

115
tests/qunit/editor/tinymce/UndoManager_robot.html
View File

@@ -1,115 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Undo Tests</title>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../js/qunit/reporter.js"></script>
<script src="../js/utils.js"></script>
<script src="../js/tinymce_loader.js"></script>
<script src="../js/jsrobot/robot.js"></script>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
var BACKSPACE = 0x8;
module('Undo', {
autostart: false
});
function isUndoEnabled() {
return editor.undoManager.hasUndo();
}
// The following code never made it into the main codebase -- but it might be useful one day.
// If you're seeing this in August 2011 or later, please delete.
// in webkit the iframe window needs to be given focus before selection
// will behave correctly. This code assigns focus to the tinymce window, giving it back to the
// main window if it started with it.
// if (tinymce.isWebKit) {
// var hadFocus = document.hasFocus();
// t.getWin().focus();
// if (hadFocus) {
// window.focus();
// }
// }
function assertUndoEnabledWhenTyping(c, expectedContent) {
editor.setContent('<p>Content</p>');
editor.undoManager.clear();
editor.undoManager.add();
editor.execCommand('mceRepaint');
// Need to focus the editor before setting selection in order to get the editor typing working correctly.
// All evidence points to the normal APIs not needing an editor.focus() call
editor.focus();
setSelection('p', 4);
ok(!isUndoEnabled(), 'Undo starts disabled.');
robot.type(c, false, function() {
equal(editor.getContent(), expectedContent);
ok(isUndoEnabled(), 'Undo is enabled.');
QUnit.start();
}, editor.selection.getNode());
}
asyncTest('Undo added when typing character', function() {
assertUndoEnabledWhenTyping('b', '<p>Contbent</p>');
});
asyncTest('Undo added when typing enter', function() {
assertUndoEnabledWhenTyping('\n', '<p>Cont</p><p>ent</p>');
});
asyncTest('Forward delete triggers undo in IE', function() {
editor.setContent('<p>Test1 Test2</p>');
editor.undoManager.clear();
editor.execCommand('mceRepaint');
ok(!isUndoEnabled(), 'Undo is disabled.');
rng = editor.dom.createRng();
rng.setStart(editor.dom.select('p')[0].firstChild, 0);
rng.setEnd(editor.dom.select('p')[0].firstChild, 6);
editor.selection.setRng(rng);
robot.forwardDelete(function() {
equal(editor.getContent(), '<p>Test2</p>', 'First word has been deleted');
ok(isUndoEnabled(), 'Undo is enabled.');
editor.undoManager.undo();
equal(editor.getContent(), '<p>Test1 Test2</p>', 'First word has been restored');
QUnit.start();
}, editor.selection.getNode());
});
var initTinyFunction = function(){
tinymce.init({
mode : "exact",
elements : "elm1",
cleanup: true,
add_unload_trigger : false,
indent : 0,
init_instance_callback : function(ed) {
editor = ed;
}
});
}
</script>
</head>
<body>
<h1 id="qunit-header">Undo Tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1">Content
</textarea>
</div>
<script>
initWhenTinyAndRobotAreReady(initTinyFunction);
</script>
</body>
</html>

27
tests/qunit/editor/tinymce/dom/DOMUtils.html
View File

@@ -1,27 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.dom.DOMUtils</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
</head>
<body>
<script>
QUnit.config.reorder = false;
module("tinymce.dom.DOMUtils", {
});
</script>
<script src="DOMUtils.js"></script>
<h1 id="qunit-header">Unit tests for tinymce.dom.DOMUtils</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

36
tests/qunit/editor/tinymce/dom/DOMUtils.js
View File

@@ -1,4 +1,6 @@
(function() {
module("tinymce.dom.DOMUtils");
var DOM = new tinymce.dom.DOMUtils(document, {keep_values : true, schema : new tinymce.html.Schema()});
test('parseStyle', 11, function() {
@@ -6,7 +8,7 @@
DOM.add(document.body, 'div', {id : 'test'});
dom = new tinymce.dom.DOMUtils(document, {hex_colors : true, keep_values : true, url_converter : function(u, n, e) {
dom = new tinymce.dom.DOMUtils(document, {hex_colors : true, keep_values : true, url_converter : function(u) {
return 'X' + u + 'Y';
}});
@@ -218,10 +220,10 @@
equal(DOM.select('div', 'test').length, 4);
ok(DOM.select('div', 'test').reverse);
DOM.setHTML('test', '<div class="test1 test2 test3">test 1</div><div class="test2">test 2 <div>test 3</div></div><div>test 4</div>')
DOM.setHTML('test', '<div class="test1 test2 test3">test 1</div><div class="test2">test 2 <div>test 3</div></div><div>test 4</div>');
equal(DOM.select('div.test2', 'test').length, 2);
DOM.setHTML('test', '<div class="test1 test2 test3">test 1</div><div class="test2">test 2 <div>test 3</div></div><div>test 4</div>')
DOM.setHTML('test', '<div class="test1 test2 test3">test 1</div><div class="test2">test 2 <div>test 3</div></div><div>test 4</div>');
equal(DOM.select('div div', 'test').length, 1, null, tinymce.isWebKit); // Issue: http://bugs.webkit.org/show_bug.cgi?id=17461
//alert(DOM.select('div div', 'test').length +","+DOM.get('test').querySelectorAll('div div').length);
@@ -264,7 +266,7 @@
equal(DOM.getAttrib('test', 'class'), '123');
equal(DOM.getAttrib('test', 'title'), 'abc');
dom = new tinymce.dom.DOMUtils(document, {keep_values : true, url_converter : function(u, n, e) {
dom = new tinymce.dom.DOMUtils(document, {keep_values : true, url_converter : function(u, n) {
return '&<>"' + u + '&<>"' + n;
}});
@@ -286,20 +288,19 @@
});
test('getAttribs', 2, function() {
var dom;
function check(obj, val) {
var count = 0;
val = val.split(',');
tinymce.each(obj, function(o) {
if (tinymce.inArray(val, o.nodeName.toLowerCase()) != -1 && o.specified)
if (tinymce.inArray(val, o.nodeName.toLowerCase()) != -1 && o.specified) {
count++;
}
});
return count == obj.length;
};
}
DOM.add(document.body, 'div', {id : 'test'});
@@ -356,7 +357,7 @@
equal(DOM.getParent('test2', function(n) {return n.nodeName == 'SPAN';}).nodeName, 'SPAN');
equal(DOM.getParent('test2', function(n) {return n.nodeName == 'BODY';}).nodeName, 'BODY');
equal(DOM.getParent('test2', function(n) {return n.nodeName == 'BODY';}, document.body), null);
equal(DOM.getParent('test2', function(n) {return false;}), null);
equal(DOM.getParent('test2', function() {return false;}), null);
equal(DOM.getParent('test2', 'SPAN').nodeName, 'SPAN');
equal(DOM.getParent('test2', 'body', DOM.get('test')), null);
@@ -435,8 +436,6 @@
});
test('getNext', 5, function() {
var r;
DOM.add(document.body, 'div', {id : 'test'});
DOM.get('test').innerHTML = '<strong>A</strong><span>B</span><em>C</em>';
@@ -444,14 +443,12 @@
equal(DOM.getNext(DOM.get('test').firstChild, 'em').nodeName, 'EM');
equal(DOM.getNext(DOM.get('test').firstChild, 'div'), null);
equal(DOM.getNext(null, 'div'), null);
equal(DOM.getNext(DOM.get('test').firstChild, function(n) {return n.nodeName == 'EM'}).nodeName, 'EM');
equal(DOM.getNext(DOM.get('test').firstChild, function(n) {return n.nodeName == 'EM';}).nodeName, 'EM');
DOM.remove('test');
});
test('getPrev', 5, function() {
var r;
DOM.add(document.body, 'div', {id : 'test'});
DOM.get('test').innerHTML = '<strong>A</strong><span>B</span><em>C</em>';
@@ -459,7 +456,7 @@
equal(DOM.getPrev(DOM.get('test').lastChild, 'strong').nodeName, 'STRONG');
equal(DOM.getPrev(DOM.get('test').lastChild, 'div'), null);
equal(DOM.getPrev(null, 'div'), null);
equal(DOM.getPrev(DOM.get('test').lastChild, function(n) {return n.nodeName == 'STRONG'}).nodeName, 'STRONG');
equal(DOM.getPrev(DOM.get('test').lastChild, function(n) {return n.nodeName == 'STRONG';}).nodeName, 'STRONG');
DOM.remove('test');
});
@@ -467,11 +464,12 @@
test('loadCSS', 1, function() {
var c = 0;
DOM.loadCSS('css/test.css?a=1,css/test.css?a=2,css/test.css?a=3');
DOM.loadCSS('tinymce/dom/test.css?a=1,tinymce/dom/test.css?a=2,tinymce/dom/test.css?a=3');
tinymce.each(document.getElementsByTagName('link'), function(n) {
if (n.href.indexOf('test.css?a=') != -1)
if (n.href.indexOf('test.css?a=') != -1) {
c++;
}
});
equal(c, 3, null, tinymce.isOpera);
@@ -576,7 +574,7 @@
parent = DOM.select('li:nth-child(1)', DOM.get('test'))[0];
point = DOM.select('ul li:nth-child(2)', DOM.get('test'))[0];
DOM.split(parent, point);
equal(cleanHtml(DOM.get('test').innerHTML), '<ul><li>first line<br><ul><li><span>second</span> <span>line</span></li></ul></li><li>third line<br></li></ul>');
equal(Utils.cleanHtml(DOM.get('test').innerHTML), '<ul><li>first line<br><ul><li><span>second</span> <span>line</span></li></ul></li><li>third line<br></li></ul>');
DOM.remove('test');
});
@@ -630,7 +628,7 @@
DOM.setHTML('test', '<div><span><b></b></span><b></b><em><a name="x"></a></em></div>');
ok(!DOM.isEmpty(DOM.get('test')), 'Non empty complex HTML with achor name');
DOM.setHTML('test', '<img src="x">');
DOM.setHTML('test', '<img src="tinymce/ui/img/raster.gif">');
ok(!DOM.isEmpty(DOM.get('test')), 'Non empty html with img element');
DOM.setHTML('test', '<span data-mce-bookmark="1"></span>');

29
tests/qunit/editor/tinymce/dom/DOMUtils_jquery.html
View File

@@ -1,29 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.dom.DOMUtils</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../../js/tinymce/tinymce.jquery.min.js"></script>
</head>
<body>
<script>
QUnit.config.reorder = false;
module("tinymce.dom.DOMUtils (jQuery)", {
});
</script>
<script src="DOMUtils.js"></script>
<h1 id="qunit-header">Unit tests for tinymce.dom.DOMUtils</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

124
tests/qunit/editor/tinymce/dom/EventUtils.html → tests/qunit/editor/tinymce/dom/EventUtils.js
View File

@@ -1,40 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for the EventUtils class</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var eventUtils = tinymce.dom.Event;
QUnit.config.reorder = false;
module("tinymce.dom.Event", {
setupModule: function() {
document.getElementById('view').innerHTML = (
'<div id="content" tabindex="0">' +
'<div id="inner" tabindex="0"></div>' +
'</div>'
);
},
teardown: function() {
eventUtils.clean(window);
}
});
// Bind dummy ready so it gets the domLoaded ready state
eventUtils.bind(window, "ready", function() {});
test("unbind all", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click = true;
});
eventUtils.bind(window, 'keydown', function(e) {
eventUtils.bind(window, 'keydown', function() {
result.keydown1 = true;
});
eventUtils.bind(window, 'keydown', function(e) {
eventUtils.bind(window, 'keydown', function() {
result.keydown2 = true;
});
@@ -53,15 +44,15 @@ test("unbind all", function() {
test("unbind event", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click = true;
});
eventUtils.bind(window, 'keydown', function(e) {
eventUtils.bind(window, 'keydown', function() {
result.keydown1 = true;
});
eventUtils.bind(window, 'keydown', function(e) {
eventUtils.bind(window, 'keydown', function() {
result.keydown2 = true;
});
@@ -85,17 +76,17 @@ test("unbind event non existing", function() {
test("unbind callback", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click = true;
});
eventUtils.bind(window, 'keydown', function(e) {
eventUtils.bind(window, 'keydown', function() {
result.keydown1 = true;
});
function callback2(e) {
function callback2() {
result.keydown2 = true;
};
}
eventUtils.bind(window, 'keydown', callback2);
@@ -144,7 +135,7 @@ test("bind multiple", function() {
test("bind/fire bubbling", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.window = true;
});
@@ -188,7 +179,7 @@ test("bind/fire bubbling", function() {
test("bind/fire stopImmediatePropagation", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click1 = true;
});
@@ -197,7 +188,7 @@ test("bind/fire stopImmediatePropagation", function() {
e.stopImmediatePropagation();
});
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click3 = true;
});
@@ -209,11 +200,11 @@ test("bind/fire stopImmediatePropagation", function() {
test("bind/fire stopPropagation", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click1 = true;
});
eventUtils.bind(document.body, 'click', function(e) {
eventUtils.bind(document.body, 'click', function() {
result.click2 = true;
});
@@ -230,19 +221,19 @@ test("bind/fire stopPropagation", function() {
test("clean window", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click1 = true;
});
eventUtils.bind(document.body, 'click', function(e) {
eventUtils.bind(document.body, 'click', function() {
result.click2 = true;
});
eventUtils.bind(document.getElementById('content'), 'click', function(e) {
eventUtils.bind(document.getElementById('content'), 'click', function() {
result.click3 = true;
});
eventUtils.bind(document.getElementById('inner'), 'click', function(e) {
eventUtils.bind(document.getElementById('inner'), 'click', function() {
result.click4 = true;
});
@@ -259,23 +250,23 @@ test("clean window", function() {
test("clean document", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click1 = true;
});
eventUtils.bind(document, 'click', function(e) {
eventUtils.bind(document, 'click', function() {
result.click2 = true;
});
eventUtils.bind(document.body, 'click', function(e) {
eventUtils.bind(document.body, 'click', function() {
result.click3 = true;
});
eventUtils.bind(document.getElementById('content'), 'click', function(e) {
eventUtils.bind(document.getElementById('content'), 'click', function() {
result.click4 = true;
});
eventUtils.bind(document.getElementById('inner'), 'click', function(e) {
eventUtils.bind(document.getElementById('inner'), 'click', function() {
result.click5 = true;
});
@@ -292,19 +283,19 @@ test("clean document", function() {
test("clean element", function() {
var result;
eventUtils.bind(window, 'click', function(e) {
eventUtils.bind(window, 'click', function() {
result.click1 = true;
});
eventUtils.bind(document.body, 'click', function(e) {
eventUtils.bind(document.body, 'click', function() {
result.click2 = true;
});
eventUtils.bind(document.getElementById('content'), 'click', function(e) {
eventUtils.bind(document.getElementById('content'), 'click', function() {
result.click3 = true;
});
eventUtils.bind(document.getElementById('inner'), 'click', function(e) {
eventUtils.bind(document.getElementById('inner'), 'click', function() {
result.click4 = true;
});
@@ -337,22 +328,25 @@ test("mouseenter/mouseleave bind/unbind", function() {
deepEqual(result, {});
});
test("focusin/focusout bind/unbind", function() {
asyncTest("focusin/focusout bind/unbind", function() {
var result = {};
eventUtils.bind(document.body, 'focusin focusout', function(e) {
// IE will fire a focusout on the parent element if you focus an element within not a big deal so lets detect it in the test
if (e.type == "focusout" && e.target.contains(document.activeElement)) {
return;
}
window.setTimeout(function() {
eventUtils.bind(document.body, 'focusin focusout', function(e) {
// IE will fire a focusout on the parent element if you focus an element within not a big deal so lets detect it in the test
if (e.type == "focusout" && e.target.contains(document.activeElement)) {
return;
}
result[e.type] = result[e.type] ? ++result[e.type] : 1;
});
result[e.type] = result[e.type] ? ++result[e.type] : 1;
});
document.getElementById('inner').focus();
document.getElementById('content').focus();
start();
document.getElementById('content').focus();
document.getElementById('inner').focus();
deepEqual(result, {focusin: 2, focusout: 1});
deepEqual(result, {focusin: 2, focusout: 1});
}, 0);
});
test("bind unbind fire clean on null", function() {
@@ -421,7 +415,7 @@ test("unbind inside callback", function() {
test("ready/DOMContentLoaded (domLoaded = true)", function() {
var evt;
eventUtils.bind(window, "ready", function(e) {evt = e});
eventUtils.bind(window, "ready", function(e) {evt = e;});
equal(evt.type, "ready");
});
@@ -437,23 +431,11 @@ test("ready/DOMContentLoaded (document.readyState check)", function() {
eventUtils.domLoaded = false;
document.readyState = "loading";
eventUtils.bind(window, "ready", function(e) {evt = e});
eventUtils.bind(window, "ready", function(e) {evt = e;});
ok(typeof(evt) !== "undefined");
eventUtils.domLoaded = false;
document.readyState = "complete";
eventUtils.bind(window, "ready", function(e) {evt = e});
eventUtils.bind(window, "ready", function(e) {evt = e;});
equal(evt.type, "ready");
});
</script>
<h1 id="qunit-header">Unit tests for DOM Selection IE implementation</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content" tabindex="0">
<div id="inner" tabindex="0"></div>
</div>
</body>
</html>

606
tests/qunit/editor/tinymce/dom/Range.html
View File

@@ -1,606 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for DOM Range IE implementation</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/tinymce_loader.js"></script>
</head>
<body>
<script>
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Range", {
autostart: false
});
function createRng() {
return document.createRange ? document.createRange() : new tinymce.dom.Range(tinymce.DOM);
};
function getHTML(co) {
var div = document.createElement('div'), h;
if (!co)
return 'null';
div.appendChild(co.cloneNode(true));
h = div.innerHTML.toLowerCase();
h = h.replace(/[\r\n\t]/g, ''); // Remove line feeds and tabs
h = h.replace(/ (\w+)=([^\"][^\s>]*)/gi, ' $1="$2"'); // Restore attribs on IE
return h;
};
function setup() {
if (this.orgHTML)
document.getElementById('sample').innerHTML = this.orgHTML;
// Remove whitespace nodes to normalize IE and other browsers
function clean(n) {
var i;
if (n.nodeType == 3 && /^[\s]+$/.test(n.nodeValue))
return n.parentNode.removeChild(n);
for (i = n.childNodes.length - 1; i >= 0; i--)
clean(n.childNodes[i]);
};
clean(document.getElementById('sample'));
this.orgHTML = document.getElementById('sample').innerHTML;
};
test("Initial state", function() {
var r = createRng();
setup();
expect(5);
equal(r.startContainer, document)
equal(r.startOffset, 0)
equal(r.endContainer, document)
equal(r.endOffset, 0)
equal(r.commonAncestorContainer, document)
});
test("setStartSetEnd", function() {
var r = createRng();
setup();
expect(12);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('strong').firstChild, 3);
equal(r.startContainer.nodeValue, 'first')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeValue, 'strong')
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 3)
equal(r.commonAncestorContainer.nodeName, 'P')
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('strong'), 0);
equal(r.startContainer.nodeName, 'P')
equal(r.startOffset, 0)
equal(r.endContainer.nodeName, 'STRONG')
equal(r.endOffset, 0)
equal(r.commonAncestorContainer.nodeName, 'P')
});
test("setStartBeforeSetEndAfter", function() {
var r = createRng();
setup();
expect(5);
r.setStartBefore(document.getElementById('first'));
r.setEndAfter(document.getElementById('strong'));
equal(r.startContainer.nodeName, 'DIV')
equal(r.startOffset, 0)
equal(r.endContainer.nodeName, 'P')
equal(r.endOffset, 5)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_setStartAfterSetEndBefore", function() {
var r = createRng();
setup();
expect(5);
r.setStartAfter(document.getElementById('strong'));
r.setEndBefore(document.getElementById('em1'));
equal(r.startContainer.nodeName, 'P')
equal(r.startOffset, 5)
equal(r.endContainer.nodeName, 'P')
equal(r.endOffset, 6)
equal(r.commonAncestorContainer.nodeName, 'P')
});
test("test_collapse", function() {
var r = createRng();
setup();
expect(10);
r.setStart(document.getElementById('strong').firstChild, 0);
r.setEnd(document.getElementById('strong').firstChild, 6);
r.collapse(true);
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 0)
equal(r.commonAncestorContainer.nodeType, 3)
r.setStart(document.getElementById('strong').firstChild, 0);
r.setEnd(document.getElementById('strong').firstChild, 6);
r.collapse(false);
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 6)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 6)
equal(r.commonAncestorContainer.nodeType, 3)
});
test("test_selectNode", function() {
var r = createRng();
setup();
expect(4);
r.selectNode(document.getElementById('strong').firstChild);
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 1)
});
test("test_selectNodeContents", function() {
var r = createRng();
setup();
expect(8);
r.selectNodeContents(document.getElementById('strong').firstChild);
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 6)
r.selectNodeContents(document.getElementById('first'));
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 8)
});
test("test_insertNode", function() {
var r = createRng();
setup();
expect(4);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 2);
r.insertNode(document.createTextNode('ABC'));
equal(document.getElementById('first').childNodes[0].nodeValue, 'f')
equal(document.getElementById('first').childNodes[1].nodeValue, 'ABC')
equal(document.getElementById('first').childNodes[2].nodeValue, 'irst')
r.selectNode(document.getElementById('strong'));
r.insertNode(document.createElement('span'));
equal(document.getElementById('strong').previousSibling.nodeName, 'SPAN')
});
test("test_cloneRange", function() {
var r = createRng();
setup();
expect(6);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('strong').firstChild, 2);
var r2 = r.cloneRange();
equal(r2.startContainer.nodeType, 3)
equal(r2.startOffset, 1)
equal(r2.endContainer.nodeType, 3)
equal(r2.endOffset, 2)
equal(r2.collapsed, false)
equal(r2.commonAncestorContainer.nodeName, 'P')
});
if (tinymce.isGecko) {
test('test_cloneContents (SKIPPED)', function() {
ok(true, 'Before Firefox 3.6 this test fails because of a corner case bug but since the point is to test the IE Range implementation we skip it.');
});
} else {
test("test_cloneContents", function() {
var r = createRng();
setup();
expect(77);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('two').firstChild, 2);
equal(getHTML(r.cloneContents()), '<p id="first">irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">ab</td></tr></tbody></table>')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 2)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeName, 'DIV')
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
equal(getHTML(r.cloneContents()), '<table id="table"><tbody><tr><td id="two">bc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">te</p>')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 2)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeName, 'DIV')
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').lastChild, 4);
equal(getHTML(r.cloneContents()), 'irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> str')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 4)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeName, 'P')
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 4);
equal(getHTML(r.cloneContents()), 'irs')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 4)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 3)
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('last'), 0);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id=\"last\"></p>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 0)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('first'), 1);
r.setEnd(document.getElementById('last'), 1);
equal(getHTML(r.cloneContents()), '<p id="first"><!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc</p>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 1)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('sample'), document.getElementById('sample').childNodes.length - 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, document.getElementById('sample').childNodes.length - 1)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('last').firstChild, 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">t</p>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 1)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('last'), 0);
equal(getHTML(r.cloneContents()), '<p id="first">irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id=\"last\"></p>')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 0)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em></p>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 2)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b></p>')
equal(r.startContainer.nodeType, 1)
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 1)
equal(r.collapsed, false)
equal(r.commonAncestorContainer.nodeType, 1)
});
}
test("test_extractContents1", function() {
var r = createRng();
setup();
expect(10);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 4);
equal(getHTML(r.extractContents()), 'irs')
equal(r.startContainer.nodeType, 3)
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 3)
equal(r.endOffset, 1)
equal(r.collapsed, true)
equal(r.startContainer == r.endContainer, true)
equal(r.startOffset == r.endOffset, true)
equal(r.commonAncestorContainer.nodeType, 3)
equal(getHTML(document.getElementById('first')), '<p id="first">ft<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p>')
});
test("test_extractContents2", function() {
var r = createRng();
setup();
expect(9);
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
equal(getHTML(r.extractContents()), '<table id="table"><tbody><tr><td id="two">bc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">te</p>')
equal(r.startContainer.nodeType, 1)
equal(getHTML(r.startContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>')
equal(r.startOffset, 4)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 4)
equal(getHTML(r.endContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_extractContents3", function() {
var r = createRng();
setup();
expect(9);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
equal(getHTML(r.extractContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em></p>')
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 0)
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_deleteContents1", function() {
var r = createRng();
setup();
expect(8);
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>')
equal(r.startOffset, 4)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 4)
equal(getHTML(r.endContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>')
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_deleteContents2", function() {
var r = createRng();
setup();
expect(8);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').lastChild, 4);
r.deleteContents();
equal(getHTML(r.startContainer), '<p id="first">fong.</p>')
equal(r.startOffset, 1)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 1)
equal(getHTML(r.endContainer), '<p id="first">fong.</p>')
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="first">fong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'P')
});
test("test_deleteContents3", function() {
var r = createRng();
setup();
expect(8);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('sample'), 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 0)
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_deleteContents4", function() {
var r = createRng();
setup();
expect(8);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.startOffset, 0)
equal(r.endContainer.nodeType, 1)
equal(r.endOffset, 0)
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>')
equal(r.collapsed, true)
equal(r.commonAncestorContainer.nodeName, 'DIV')
});
test("test_compareBoundaryPoints", function() {
var r1 = createRng(), r2 = createRng(), START_TO_START = 0, START_TO_END = 1, END_TO_END = 2, END_TO_START = 3;
setup();
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStartBefore(document.getElementById('strong'));
r2.setEndAfter(document.getElementById('strong'));
equal(r1.compareBoundaryPoints(START_TO_START, r2), 0, 'Start to start for same ranges');
equal(r1.compareBoundaryPoints(END_TO_END, r2), 0, 'End to end for same ranges');
equal(r1.compareBoundaryPoints(START_TO_END, r1), 1, 'Start to end for same ranges');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for same ranges');
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStartBefore(document.getElementById('em1'));
r2.setEndAfter(document.getElementById('em1'));
equal(r1.compareBoundaryPoints(START_TO_START, r2), -1, 'Start to start for range before');
equal(r1.compareBoundaryPoints(END_TO_END, r2), -1, 'End to end for range before');
equal(r1.compareBoundaryPoints(START_TO_END, r2), -1, 'Start to end for range before');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for range before');
equal(r2.compareBoundaryPoints(START_TO_START, r1), 1, 'Start to start for range after');
equal(r2.compareBoundaryPoints(END_TO_END, r1), 1, 'End to end for range after');
equal(r2.compareBoundaryPoints(START_TO_END, r1), 1, 'Start to end for range after');
equal(r2.compareBoundaryPoints(END_TO_START, r1), 1, 'End to start for range after');
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStart(document.getElementById('strong').firstChild, 2);
r2.setEnd(document.getElementById('strong').firstChild, 3);
equal(r1.compareBoundaryPoints(START_TO_START, r2), -1, 'Start to start for range inside');
equal(r1.compareBoundaryPoints(END_TO_END, r2), 1, 'End to end for range inside');
equal(r1.compareBoundaryPoints(START_TO_END, r2), 1, 'Start to end for range inside');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for range inside');
});
test("toString in part of same text node", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 1);
rng.setEnd(document.getElementById('strong').firstChild, 3);
equal(rng.toString(), "tr");
});
test("toString in start/end of same text node", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 0);
rng.setEnd(document.getElementById('strong').firstChild, 6);
equal(rng.toString(), "strong");
});
test("toString in start in one text node end in another", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 1);
rng.setEnd(document.getElementById('em1').firstChild, 1);
equal(rng.toString(), "trong second e");
});
// Run on IE only
if (tinymce.isIE) {
test("toString in start in one text node end in another", function() {
var rng = createRng();
rng.setStartBefore(document.getElementById('strong'));
rng.setEndAfter(document.getElementById('em2'));
equal(rng.toString().replace(/\r\n/g, ''), "strong second em strong.barsome text");
});
}
tinymce.DOM.bind(window, 'load', function() {
QUnit.start();
});
</script>
<h1 id="qunit-header">Unit tests for DOM Range IE implementation</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="sample">
<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p>
<p id="second">bar</p>
<p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p>
<table id="table">
<tr>
<td>1</td>
<td id="two">abc</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
<p id="last">textabc<span>span</span></p>
</div>
</body>
</html>

548
tests/qunit/editor/tinymce/dom/Range.js Normal file
View File

@@ -0,0 +1,548 @@
(function() {
module("tinymce.dom.Range", {
setup: function() {
document.getElementById('view').innerHTML = (
'<div id="sample">' +
'<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p>' +
'<p id="second">bar</p>' +
'<p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p>' +
'<table id="table">' +
'<tr>' +
'<td>1</td>' +
'<td id="two">abc</td>' +
'</tr>' +
'<tr>' +
'<td>3</td>' +
'<td>4</td>' +
'</tr>' +
'</table>' +
'<p id="last">textabc<span>span</span></p>' +
'</div>'
);
}
});
function createRng() {
return document.createRange ? document.createRange() : new tinymce.dom.Range(tinymce.DOM);
}
function getHTML(co) {
var div = document.createElement('div'), h;
if (!co) {
return 'null';
}
div.appendChild(co.cloneNode(true));
h = div.innerHTML.toLowerCase();
h = h.replace(/[\r\n\t]/g, ''); // Remove line feeds and tabs
h = h.replace(/ (\w+)=([^\"][^\s>]*)/gi, ' $1="$2"'); // Restore attribs on IE
return h;
}
test("Initial state", function() {
var r = createRng();
expect(5);
equal(r.startContainer, document);
equal(r.startOffset, 0);
equal(r.endContainer, document);
equal(r.endOffset, 0);
equal(r.commonAncestorContainer, document);
});
test("setStartSetEnd", function() {
var r = createRng();
expect(12);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('strong').firstChild, 3);
equal(r.startContainer.nodeValue, 'first');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeValue, 'strong');
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 3);
equal(r.commonAncestorContainer.nodeName, 'P');
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('strong'), 0);
equal(r.startContainer.nodeName, 'P');
equal(r.startOffset, 0);
equal(r.endContainer.nodeName, 'STRONG');
equal(r.endOffset, 0);
equal(r.commonAncestorContainer.nodeName, 'P');
});
test("setStartBeforeSetEndAfter", function() {
var r = createRng();
expect(5);
r.setStartBefore(document.getElementById('first'));
r.setEndAfter(document.getElementById('strong'));
equal(r.startContainer.nodeName, 'DIV');
equal(r.startOffset, 0);
equal(r.endContainer.nodeName, 'P');
equal(r.endOffset, 5);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_setStartAfterSetEndBefore", function() {
var r = createRng();
expect(5);
r.setStartAfter(document.getElementById('strong'));
r.setEndBefore(document.getElementById('em1'));
equal(r.startContainer.nodeName, 'P');
equal(r.startOffset, 5);
equal(r.endContainer.nodeName, 'P');
equal(r.endOffset, 6);
equal(r.commonAncestorContainer.nodeName, 'P');
});
test("test_collapse", function() {
var r = createRng();
expect(10);
r.setStart(document.getElementById('strong').firstChild, 0);
r.setEnd(document.getElementById('strong').firstChild, 6);
r.collapse(true);
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 0);
equal(r.commonAncestorContainer.nodeType, 3);
r.setStart(document.getElementById('strong').firstChild, 0);
r.setEnd(document.getElementById('strong').firstChild, 6);
r.collapse(false);
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 6);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 6);
equal(r.commonAncestorContainer.nodeType, 3);
});
test("test_selectNode", function() {
var r = createRng();
expect(4);
r.selectNode(document.getElementById('strong').firstChild);
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 1);
});
test("test_selectNodeContents", function() {
var r = createRng();
expect(8);
r.selectNodeContents(document.getElementById('strong').firstChild);
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 6);
r.selectNodeContents(document.getElementById('first'));
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 8);
});
test("test_insertNode", function() {
var r = createRng();
expect(4);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 2);
r.insertNode(document.createTextNode('ABC'));
equal(document.getElementById('first').childNodes[0].nodeValue, 'f');
equal(document.getElementById('first').childNodes[1].nodeValue, 'ABC');
equal(document.getElementById('first').childNodes[2].nodeValue, 'irst');
r.selectNode(document.getElementById('strong'));
r.insertNode(document.createElement('span'));
equal(document.getElementById('strong').previousSibling.nodeName, 'SPAN');
});
test("test_cloneRange", function() {
var r = createRng();
expect(6);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('strong').firstChild, 2);
var r2 = r.cloneRange();
equal(r2.startContainer.nodeType, 3);
equal(r2.startOffset, 1);
equal(r2.endContainer.nodeType, 3);
equal(r2.endOffset, 2);
equal(r2.collapsed, false);
equal(r2.commonAncestorContainer.nodeName, 'P');
});
if (tinymce.isGecko) {
test('test_cloneContents (SKIPPED)', function() {
ok(true, 'Before Firefox 3.6 this test fails because of a corner case bug but since the point is to test the IE Range implementation we skip it.');
});
} else {
test("test_cloneContents", function() {
var r = createRng();
expect(77);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('two').firstChild, 2);
equal(getHTML(r.cloneContents()), '<p id="first">irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">ab</td></tr></tbody></table>');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 2);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeName, 'DIV');
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
equal(getHTML(r.cloneContents()), '<table id="table"><tbody><tr><td id="two">bc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">te</p>');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 2);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeName, 'DIV');
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').lastChild, 4);
equal(getHTML(r.cloneContents()), 'irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> str');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 4);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeName, 'P');
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 4);
equal(getHTML(r.cloneContents()), 'irs');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 4);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 3);
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('last'), 0);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id=\"last\"></p>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 0);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('first'), 1);
r.setEnd(document.getElementById('last'), 1);
equal(getHTML(r.cloneContents()), '<p id="first"><!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc</p>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 1);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('sample'), document.getElementById('sample').childNodes.length - 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, document.getElementById('sample').childNodes.length - 1);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('first'), 0);
r.setEnd(document.getElementById('last').firstChild, 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">t</p>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 1);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('last'), 0);
equal(getHTML(r.cloneContents()), '<p id="first">irst<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id=\"last\"></p>');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 0);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em></p>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 2);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 1);
equal(getHTML(r.cloneContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b></p>');
equal(r.startContainer.nodeType, 1);
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 1);
equal(r.collapsed, false);
equal(r.commonAncestorContainer.nodeType, 1);
});
}
test("test_extractContents1", function() {
var r = createRng();
expect(10);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').firstChild, 4);
equal(getHTML(r.extractContents()), 'irs');
equal(r.startContainer.nodeType, 3);
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 3);
equal(r.endOffset, 1);
equal(r.collapsed, true);
equal(r.startContainer == r.endContainer, true);
equal(r.startOffset == r.endOffset, true);
equal(r.commonAncestorContainer.nodeType, 3);
equal(getHTML(document.getElementById('first')), '<p id="first">ft<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p>');
});
test("test_extractContents2", function() {
var r = createRng();
expect(9);
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
equal(getHTML(r.extractContents()), '<table id="table"><tbody><tr><td id="two">bc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">te</p>');
equal(r.startContainer.nodeType, 1);
equal(getHTML(r.startContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>');
equal(r.startOffset, 4);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 4);
equal(getHTML(r.endContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_extractContents3", function() {
var r = createRng();
expect(9);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
equal(getHTML(r.extractContents()), '<p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em></p>');
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 0);
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_deleteContents1", function() {
var r = createRng();
expect(8);
r.setStart(document.getElementById('two').firstChild, 1);
r.setEnd(document.getElementById('last').firstChild, 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>');
equal(r.startOffset, 4);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 4);
equal(getHTML(r.endContainer), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>');
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="first">first<!--not--> strong <!-- --><strong id="strong">strong</strong> second <em id="em1">em</em> strong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">a</td></tr></tbody></table><p id="last">xtabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_deleteContents2", function() {
var r = createRng();
expect(8);
r.setStart(document.getElementById('first').firstChild, 1);
r.setEnd(document.getElementById('first').lastChild, 4);
r.deleteContents();
equal(getHTML(r.startContainer), '<p id="first">fong.</p>');
equal(r.startOffset, 1);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 1);
equal(getHTML(r.endContainer), '<p id="first">fong.</p>');
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="first">fong.</p><p id="second">bar</p><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'P');
});
test("test_deleteContents3", function() {
var r = createRng();
expect(8);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('sample'), 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 0);
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse"><b><em id="em2">some text</em></b><em>em text</em>more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_deleteContents4", function() {
var r = createRng();
expect(8);
r.setStart(document.getElementById('sample'), 0);
r.setEnd(document.getElementById('traverse'), 2);
r.deleteContents();
equal(getHTML(r.startContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.startOffset, 0);
equal(r.endContainer.nodeType, 1);
equal(r.endOffset, 0);
equal(getHTML(r.endContainer), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(getHTML(document.getElementById('sample')), '<div id="sample"><p id="traverse">more text</p><table id="table"><tbody><tr><td>1</td><td id="two">abc</td></tr><tr><td>3</td><td>4</td></tr></tbody></table><p id="last">textabc<span>span</span></p></div>');
equal(r.collapsed, true);
equal(r.commonAncestorContainer.nodeName, 'DIV');
});
test("test_compareBoundaryPoints", function() {
var r1 = createRng(), r2 = createRng(), START_TO_START = 0, START_TO_END = 1, END_TO_END = 2, END_TO_START = 3;
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStartBefore(document.getElementById('strong'));
r2.setEndAfter(document.getElementById('strong'));
equal(r1.compareBoundaryPoints(START_TO_START, r2), 0, 'Start to start for same ranges');
equal(r1.compareBoundaryPoints(END_TO_END, r2), 0, 'End to end for same ranges');
equal(r1.compareBoundaryPoints(START_TO_END, r1), 1, 'Start to end for same ranges');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for same ranges');
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStartBefore(document.getElementById('em1'));
r2.setEndAfter(document.getElementById('em1'));
equal(r1.compareBoundaryPoints(START_TO_START, r2), -1, 'Start to start for range before');
equal(r1.compareBoundaryPoints(END_TO_END, r2), -1, 'End to end for range before');
equal(r1.compareBoundaryPoints(START_TO_END, r2), -1, 'Start to end for range before');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for range before');
equal(r2.compareBoundaryPoints(START_TO_START, r1), 1, 'Start to start for range after');
equal(r2.compareBoundaryPoints(END_TO_END, r1), 1, 'End to end for range after');
equal(r2.compareBoundaryPoints(START_TO_END, r1), 1, 'Start to end for range after');
equal(r2.compareBoundaryPoints(END_TO_START, r1), 1, 'End to start for range after');
r1.setStartBefore(document.getElementById('strong'));
r1.setEndAfter(document.getElementById('strong'));
r2.setStart(document.getElementById('strong').firstChild, 2);
r2.setEnd(document.getElementById('strong').firstChild, 3);
equal(r1.compareBoundaryPoints(START_TO_START, r2), -1, 'Start to start for range inside');
equal(r1.compareBoundaryPoints(END_TO_END, r2), 1, 'End to end for range inside');
equal(r1.compareBoundaryPoints(START_TO_END, r2), 1, 'Start to end for range inside');
equal(r1.compareBoundaryPoints(END_TO_START, r2), -1, 'End to start for range inside');
});
test("toString in part of same text node", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 1);
rng.setEnd(document.getElementById('strong').firstChild, 3);
equal(rng.toString(), "tr");
});
test("toString in start/end of same text node", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 0);
rng.setEnd(document.getElementById('strong').firstChild, 6);
equal(rng.toString(), "strong");
});
test("toString in start in one text node end in another", function() {
var rng = createRng();
rng.setStart(document.getElementById('strong').firstChild, 1);
rng.setEnd(document.getElementById('em1').firstChild, 1);
equal(rng.toString(), "trong second e");
});
// Run on IE only
if (tinymce.isIE) {
test("toString in start in one text node end in another", function() {
var rng = createRng();
rng.setStartBefore(document.getElementById('strong'));
rng.setEndAfter(document.getElementById('em2'));
equal(rng.toString().replace(/\r\n/g, ''), "strong second em strong.barsome text");
});
}
})();

89
tests/qunit/editor/tinymce/dom/Selection.html → tests/qunit/editor/tinymce/dom/Selection.js
View File

@@ -1,20 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.dom.Selection</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
var editor;
module("tinymce.dom.Selection", {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("Selection", {
autostart: false
tinymce.init({
selector: "textarea",
add_unload_trigger: false,
skin: false,
forced_root_block: '',
entities: 'raw',
valid_styles: {
'*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
custom_elements: 'custom1,~custom2',
extended_valid_elements: 'custom1,custom2',
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
test('getContent', function() {
@@ -41,7 +45,7 @@ test('getContent', function() {
function handler(event) {
eventObj = event;
};
}
editor.on('GetContent', handler);
editor.setContent('<p>text</p>');
@@ -125,7 +129,7 @@ test('setContent', function() {
function handler(event) {
eventObj = event;
};
}
editor.on('SetContent', handler);
editor.setContent('<p>text</p>');
@@ -452,7 +456,7 @@ test('getBookmark/setBookmark (nonintrusive) - Get bookmark inside complex html'
editor.setContent('<p>abc</p>123<p>123</p><p>123<b>123</b><table><tr><td>abc</td></tr></table></p>');
editor.execCommand('SelectAll');
setSelection('td', 1, 'td', 2);
Utils.setSelection('td', 1, 'td', 2);
bookmark = editor.selection.getBookmark(2, true);
editor.getBody().innerHTML = editor.getBody().innerHTML;
editor.selection.moveToBookmark(bookmark);
@@ -661,7 +665,7 @@ if (!tinymce.isIE) {
var rng;
editor.getBody().innerHTML = '<p><b>a</b><i>b</i></p>';
setSelection('i', 0);
Utils.setSelection('i', 0);
editor.selection.normalize();
rng = editor.selection.getRng(true);
@@ -677,7 +681,7 @@ if (!tinymce.isIE) {
var rng;
editor.getBody().innerHTML = '<p><b>a</b><i>b</i></p>';
setSelection('b', 1, 'i', 1);
Utils.setSelection('b', 1, 'i', 1);
editor.selection.normalize();
rng = editor.selection.getRng(true);
@@ -693,7 +697,7 @@ if (!tinymce.isIE) {
var rng;
editor.getBody().innerHTML = '<p>a<br><b>b</b></p>';
setSelection('b', 0);
Utils.setSelection('b', 0);
editor.selection.normalize();
rng = editor.selection.getRng(true);
@@ -705,7 +709,7 @@ if (!tinymce.isIE) {
var rng;
editor.getBody().innerHTML = '<p>a<img><b>b</b></p>';
setSelection('b', 0);
Utils.setSelection('b', 0);
editor.selection.normalize();
rng = editor.selection.getRng(true);
@@ -717,7 +721,7 @@ if (!tinymce.isIE) {
var rng;
editor.getBody().innerHTML = '<p>a</p><p><b>b</b></p>';
setSelection('b', 0);
Utils.setSelection('b', 0);
editor.selection.normalize();
rng = editor.selection.getRng(true);
@@ -897,7 +901,7 @@ test('selectorChanged', function() {
});
editor.getBody().innerHTML = '<p><a href="#">text</a></p>';
setSelection('a', 0, 'a', 4);
Utils.setSelection('a', 0, 'a', 4);
editor.nodeChanged();
ok(newState);
@@ -906,43 +910,10 @@ test('selectorChanged', function() {
equal(newArgs.parents.length, 2);
editor.getBody().innerHTML = '<p>text</p>';
setSelection('p', 0, 'p', 4);
Utils.setSelection('p', 0, 'p', 4);
editor.nodeChanged();
equal(newArgs.selector, 'a[href]');
equal(newArgs.node, editor.getBody().firstChild);
equal(newArgs.parents.length, 1);
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
fix_list_elements : 0,
fix_table_elements : 0,
forced_root_block : '',
entities : 'raw',
valid_styles : {
'*' : 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,margin,margin-top,margin-right,margin-bottom,margin-left,display'
},
custom_elements : 'custom1,~custom2',
extended_valid_elements : 'custom1,custom2',
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Unit tests for tinymce.dom.Selection</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

53
tests/qunit/editor/tinymce/dom/Serializer.html → tests/qunit/editor/tinymce/dom/Serializer.js
View File

@@ -1,20 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for tinymce.dom.Serializer</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var DOM = tinymce.DOM;
QUnit.config.reorder = false;
module("tinymce.dom.Serializer", {
setupModule: function() {
document.getElementById('view').innerHTML = '<div id="content"><div id="test"></div></div>';
}
});
test('Schema rules', function() {
@@ -23,39 +12,39 @@ test('Schema rules', function() {
expect(8);
ser.setRules('@[id|title|class|style],div,img[src|alt|-style|border],span,hr');
DOM.setHTML('test', '<img title="test" src="file.gif" data-mce-src="file.gif" alt="test" border="0" style="border: 1px solid red" class="test" /><span id="test2">test</span><hr />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img title="test" class="test" src="file.gif" alt="test" border="0" /><span id="test2">test</span><hr /></div>', 'Global rule');
DOM.setHTML('test', '<img title="test" src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" alt="test" border="0" style="border: 1px solid red" class="test" /><span id="test2">test</span><hr />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img title="test" class="test" src="tinymce/ui/img/raster.gif" alt="test" border="0" /><span id="test2">test</span><hr /></div>', 'Global rule');
ser.setRules('*a[*],em/i[*],strong/b[*i*]');
DOM.setHTML('test', '<a href="test" data-mce-href="test">test</a><strong title="test" class="test">test2</strong><em title="test">test3</em>');
equal(ser.serialize(DOM.get('test')), '<a href="test">test</a><strong title="test">test2</strong><em title="test">test3</em>', 'Wildcard rules');
ser.setRules('br,hr,input[type|name|value],div[id],span[id],strong/b,a,em/i,a[!href|!name],img[src|border=0|title={$uid}]');
DOM.setHTML('test', '<br /><hr /><input type="text" name="test" value="val" class="no" /><span id="test2" class="no"><b class="no">abc</b><em class="no">123</em></span>123<a href="file.html" data-mce-href="file.html">link</a><a name="anchor"></a><a>no</a><img src="file.gif" data-mce-src="file.gif" />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><br /><hr /><input type="text" name="test" value="val" /><span id="test2"><strong>abc</strong><em>123</em></span>123<a href="file.html">link</a><a name="anchor"></a>no<img src="file.gif" border="0" title="mce_0" /></div>', 'Output name and attribute rules');
DOM.setHTML('test', '<br /><hr /><input type="text" name="test" value="val" class="no" /><span id="test2" class="no"><b class="no">abc</b><em class="no">123</em></span>123<a href="file.html" data-mce-href="file.html">link</a><a name="anchor"></a><a>no</a><img src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><br /><hr /><input type="text" name="test" value="val" /><span id="test2"><strong>abc</strong><em>123</em></span>123<a href="file.html">link</a><a name="anchor"></a>no<img src="tinymce/ui/img/raster.gif" border="0" title="mce_0" /></div>', 'Output name and attribute rules');
ser.setRules('a[href|target<_blank?_top|title:forced value]');
DOM.setHTML('test', '<a href="file.htm" data-mce-href="file.htm" target="_blank" title="title">link</a><a href="#" data-mce-href="#" target="test">test2</a>');
equal(ser.serialize(DOM.get('test')), '<a href="file.htm" target="_blank" title="forced value">link</a><a href="#" title="forced value">test2</a>');
ser.setRules('img[src|border=0|alt=]');
DOM.setHTML('test', '<img src="file.gif" data-mce-src="file.gif" border="0" alt="" />');
equal(ser.serialize(DOM.get('test')), '<img src="file.gif" border="0" alt="" />', 'Default attribute with empty value');
DOM.setHTML('test', '<img src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" border="0" alt="" />');
equal(ser.serialize(DOM.get('test')), '<img src="tinymce/ui/img/raster.gif" border="0" alt="" />', 'Default attribute with empty value');
ser.setRules('img[src|border=0|alt=],*[*]');
DOM.setHTML('test', '<img src="file.gif" data-mce-src="file.gif" /><hr />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="file.gif" border="0" alt="" /><hr /></div>');
DOM.setHTML('test', '<img src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" /><hr />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="tinymce/ui/img/raster.gif" border="0" alt="" /><hr /></div>');
ser = new tinymce.dom.Serializer({
valid_elements : 'img[src|border=0|alt=]',
extended_valid_elements : 'div[id],img[src|alt=]'
});
DOM.setHTML('test', '<img src="file.gif" data-mce-src="file.gif" alt="" />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="file.gif" alt="" /></div>');
DOM.setHTML('test', '<img src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" alt="" />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="tinymce/ui/img/raster.gif" alt="" /></div>');
ser = new tinymce.dom.Serializer({invalid_elements : 'hr,br'});
DOM.setHTML('test', '<img src="file.gif" data-mce-src="file.gif" /><hr /><br />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="file.gif" alt="" /></div>');
DOM.setHTML('test', '<img src="tinymce/ui/img/raster.gif" data-mce-src="tinymce/ui/img/raster.gif" /><hr /><br />');
equal(ser.serialize(DOM.get('test')), '<div id="test"><img src="tinymce/ui/img/raster.gif" alt="" /></div>');
});
test('Entity encoding', function() {
@@ -501,15 +490,3 @@ test('Remove internal classes', function() {
DOM.setHTML('test', '<span class="b mce-item-X"></span>');
equal(ser.serialize(DOM.get('test')), '<span class="b"></span>');
});
</script>
<h1 id="qunit-header">Unit tests for tinymce.dom.Serializer</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<div id="test"></div>
</div>
</body>
</html>

111
tests/qunit/editor/tinymce/dom/TridentSelection.html → tests/qunit/editor/tinymce/dom/TridentSelection.js
View File

@@ -1,25 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<title>Unit tests for DOM Selection IE implementation</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
</head>
<body>
<script>
var editor, rng;
module("tinymce.dom.TridentSelection", {
setupModule: function() {
if (window.getSelection) {
return;
}
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("IE Selection", {
autostart: false
QUnit.stop();
document.getElementById('view').innerHTML = '<textarea></textarea>';
tinymce.init({
selector: "textarea",
elements: "elm1",
add_unload_trigger: false,
disable_nodechange: true,
skin: false,
init_instance_callback: function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
if (tinymce.isIE && !window.getSelection) {
if (!window.getSelection) {
test("Selection of element containing text", function(){
expect(5);
@@ -27,7 +29,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody(), 0);
rng.setEnd(editor.getBody(), 1);
editor.selection.setRng(rng);
@@ -47,7 +49,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartBefore(editor.dom.select('img')[0]);
rng.setEndAfter(editor.dom.select('img')[0]);
editor.selection.setRng(rng);
@@ -57,7 +59,7 @@ if (tinymce.isIE && !window.getSelection) {
equal(rng.endContainer.nodeName, 'P', 'Check endContainer');
equal(rng.startOffset, 0, 'Check startOffset');
equal(rng.endOffset, 1, 'Check endOffset');
equal(cleanHtml(editor.dom.getOuterHTML(rng.cloneContents()).toLowerCase()), '<img src="about:blank">', 'Check contents');
equal(Utils.cleanHtml(editor.dom.getOuterHTML(rng.cloneContents()).toLowerCase()), '<img src="about:blank">', 'Check contents');
ok(editor.selection.getRng().item, 'Check if it\'s a control selection');
});
@@ -68,7 +70,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartBefore(editor.dom.select('img')[0]);
rng.setEndAfter(editor.dom.select('img')[1]);
editor.selection.setRng(rng);
@@ -89,7 +91,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.firstChild, 1);
rng.setEnd(editor.getBody().firstChild.firstChild, 3);
editor.selection.setRng(rng);
@@ -109,7 +111,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.firstChild, 1);
rng.setEnd(editor.getBody().childNodes[1].firstChild, 3);
editor.selection.setRng(rng);
@@ -124,17 +126,6 @@ if (tinymce.isIE && !window.getSelection) {
editor.setContent('<p>1</p><p>1234</p><p>abcd</p><p>2</p>', {
format: 'raw'
});
/*
rng = editor.dom.createRng();
rng.setStartBefore(editor.dom.select('p')[1]);
rng.setEndAfter(editor.dom.select('p')[2]);
editor.selection.setRng(rng);
rng = editor.selection.getRng(1);
equal(rng.startContainer.nodeName, 'BODY', "startContainer type check");
equal(rng.startOffset, 1, "startOffset doesn't match");
equal(rng.endContainer.nodeName, 'BODY', "endContainer type check");
equal(rng.endOffset, 3, "endOffset doesn't match");
equal(editor.dom.getOuterHTML(rng.cloneContents()).replace(/[\r\n]/g, '').toLowerCase(), '<p>1234</p><p>abcd</p>');*/
});
test("Mixed selection start at element end at text", function(){
@@ -144,7 +135,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartBefore(editor.dom.select('img')[0]);
rng.setEnd(editor.getBody().firstChild.lastChild, 3);
editor.selection.setRng(rng);
@@ -164,7 +155,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild.firstChild, 1);
rng.setEndAfter(editor.getBody().firstChild.lastChild);
editor.selection.setRng(rng);
@@ -187,7 +178,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartBefore(editor.dom.select('img')[0]);
rng.setEndBefore(editor.dom.select('img')[0]);
editor.selection.setRng(rng);
@@ -206,7 +197,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartAfter(editor.dom.select('img')[0]);
rng.setEndAfter(editor.dom.select('img')[0]);
editor.selection.setRng(rng);
@@ -225,7 +216,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStartAfter(editor.dom.select('img')[1]);
rng.setEndAfter(editor.dom.select('img')[1]);
editor.selection.setRng(rng);
@@ -244,7 +235,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody(), 0);
rng.setEnd(editor.getBody(), 1);
editor.selection.setRng(rng);
@@ -265,7 +256,7 @@ if (tinymce.isIE && !window.getSelection) {
format: 'raw'
});
rng = editor.dom.createRng();
var rng = editor.dom.createRng();
rng.setStart(editor.getBody().firstChild, 0);
rng.setEnd(editor.getBody().firstChild, 0);
editor.selection.setRng(rng);
@@ -550,37 +541,3 @@ if (tinymce.isIE && !window.getSelection) {
});
}
function getCaretInfo() {
editor.focus();
var rng = editor.selection.getRng(1);
alert(rng.startContainer + " - " + rng.startOffset);
alert(rng.endContainer + " - " + rng.endOffset);
editor.focus();
}
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
<h1 id="qunit-header">Unit tests for DOM Selection IE implementation</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content">
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
<a href="javascript:getCaretInfo();">[getCaretInfo]</a>
</div>
</div>
</body>
</html>

12
tests/qunit/editor/tinymce/dom/tests.js
View File

@@ -1,12 +0,0 @@
{
"title": "tinymce.dom",
"tests": [
{"title": "DOMUtils", "url": "DOMUtils.html"},
{"title": "DOMUtils (jQuery)", "url": "DOMUtils_jquery.html"},
{"title": "EventUtils", "url": "EventUtils.html"},
{"title": "Range (IE/Native)", "url": "Range.html"},
{"title": "Selection", "url": "Selection.html"},
{"title": "Serializer", "url": "Serializer.html"},
{"title": "TridentSelection (IE)", "url": "TridentSelection.html"}
]
}

506
tests/qunit/editor/tinymce/html/DomParser.html
View File

@@ -1,506 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.DomParser tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.DomParser");
QUnit.config.reorder = false;
var schema = new tinymce.html.Schema({valid_elements: '*[class|title]'});
var serializer = new tinymce.html.Serializer({}, schema);
var parser, root;
function countNodes(node, counter) {
var sibling;
if (!counter)
counter = {};
if (node.name in counter) {
counter[node.name]++;
} else
counter[node.name] = 1;
for (sibling = node.firstChild; sibling; sibling = sibling.next) {
countNodes(sibling, counter);
}
return counter;
}
schema.addValidChildren('+body[style]');
test('Parse element', function() {
var parser, root;
expect(7);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<B title="title" class="class">test</B>');
equal(serializer.serialize(root), '<b class="class" title="title">test</b>', 'Inline element');
equal(root.firstChild.type, 1, 'Element type');
equal(root.firstChild.name, 'b', 'Element name');
deepEqual(root.firstChild.attributes, [{name: 'title', value: 'title'}, {name: 'class', value: 'class'}], 'Element attributes');
deepEqual(countNodes(root), {body:1, b:1, '#text':1}, 'Element attributes (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <SCRIPT> \t\r\n a < b > \t\r\n </S' + 'CRIPT> \t\r\n ');
equal(serializer.serialize(root), '<script> \t\r\n a < b > \t\r\n </s' + 'cript>', 'Retain code inside SCRIPT');
deepEqual(countNodes(root), {body:1, script:1, '#text':1}, 'Retain code inside SCRIPT (count)');
});
test('Whitespace', function() {
expect(12);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <B> \t\r\n test \t\r\n </B> \t\r\n ');
equal(serializer.serialize(root), ' <b> test </b> ', 'Redundant whitespace (inline element)');
deepEqual(countNodes(root), {body:1, b:1, '#text':3}, 'Redundant whitespace (inline element) (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <P> \t\r\n test \t\r\n </P> \t\r\n ');
equal(serializer.serialize(root), '<p>test</p>', 'Redundant whitespace (block element)');
deepEqual(countNodes(root), {body:1, p:1, '#text':1}, 'Redundant whitespace (block element) (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <SCRIPT> \t\r\n test \t\r\n </S' + 'CRIPT> \t\r\n ');
equal(serializer.serialize(root), '<script> \t\r\n test \t\r\n </s' + 'cript>', 'Whitespace around and inside SCRIPT');
deepEqual(countNodes(root), {body:1, script:1, '#text':1}, 'Whitespace around and inside SCRIPT (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <STYLE> \t\r\n test \t\r\n </STYLE> \t\r\n ');
equal(serializer.serialize(root), '<style> \t\r\n test \t\r\n </style>', 'Whitespace around and inside STYLE');
deepEqual(countNodes(root), {body:1, style:1, '#text':1}, 'Whitespace around and inside STYLE (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul>\n<li>Item 1\n<ul>\n<li>\n \t Indented \t \n</li>\n</ul>\n</li>\n</ul>\n');
equal(serializer.serialize(root), '<ul><li>Item 1<ul><li>Indented</li></ul></li></ul>', 'Whitespace around and inside blocks (ul/li)');
deepEqual(countNodes(root), {body:1, li:2, ul:2, '#text':2}, 'Whitespace around and inside blocks (ul/li) (count)');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'hr,br'}));
root = parser.parse('\n<hr />\n<br />\n<div>\n<hr />\n<br />\n<img src="file.gif" data-mce-src="file.gif" />\n<hr />\n<br />\n</div>\n<hr />\n<br />\n');
equal(serializer.serialize(root), '<div><img src="file.gif" data-mce-src="file.gif" alt="" /></div>', 'Whitespace where SaxParser will produce multiple whitespace nodes');
deepEqual(countNodes(root), {body:1, div:1, img:1}, 'Whitespace where SaxParser will produce multiple whitespace nodes (count)');
});
test('Whitespace before/after invalid element with text in block', function() {
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'em'}));
root = parser.parse('<p>a <em>b</em> c</p>');
equal(serializer.serialize(root), '<p>a b c</p>');
});
test('Whitespace before/after invalid element whitespace element in block', function() {
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'span'}));
root = parser.parse('<p> <span></span> </p>');
equal(serializer.serialize(root), '<p>\u00a0</p>');
});
test('Whitespace preserved in PRE', function() {
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <PRE> \t\r\n test \t\r\n </PRE> \t\r\n ');
equal(serializer.serialize(root), '<pre> \t\r\n test \t\r\n </pre>', 'Whitespace around and inside PRE');
deepEqual(countNodes(root), {body:1, pre:1, '#text':1}, 'Whitespace around and inside PRE (count)');
});
test('Whitespace preserved in SPAN inside PRE', function() {
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <PRE> \t\r\n <span> test </span> \t\r\n </PRE> \t\r\n ');
equal(serializer.serialize(root), '<pre> \t\r\n <span> test </span> \t\r\n </pre>', 'Whitespace around and inside PRE');
deepEqual(countNodes(root), {body:1, pre:1, span:1, '#text':3}, 'Whitespace around and inside PRE (count)');
});
test('Parse invalid contents', function() {
var parser, root;
expect(20);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">123</p></p>');
equal(serializer.serialize(root), '<p class="b">123</p>', 'P in P, no nodes before/after');
deepEqual(countNodes(root), {body:1, p:1, '#text':1}, 'P in P, no nodes before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<p class="b">b</p><p class="c">c</p>d</p>');
equal(serializer.serialize(root), '<p class="a">a</p><p class="b">b</p><p class="c">c</p><p class="a">d</p>', 'Two P in P, no nodes before/after');
deepEqual(countNodes(root), {body: 1, p:4, '#text': 4}, 'Two P in P, no nodes before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">abc<p class="b">def</p></p>');
equal(serializer.serialize(root), '<p class="a">abc</p><p class="b">def</p>', 'P in P with nodes before');
deepEqual(countNodes(root), {body: 1, p:2, '#text': 2}, 'P in P with nodes before (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">abc</p>def</p>');
equal(serializer.serialize(root), '<p class="b">abc</p><p class="a">def</p>', 'P in P with nodes after');
deepEqual(countNodes(root), {body: 1, p:2, '#text': 2}, 'P in P with nodes after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">abc</p><br></p>');
equal(serializer.serialize(root), '<p class="b">abc</p>', 'P in P with BR after');
deepEqual(countNodes(root), {body: 1, p:1, '#text': 1}, 'P in P with BR after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<strong>b<span>c<em>d<p class="b">e</p>f</em>g</span>h</strong>i</p>');
equal(serializer.serialize(root), '<p class="a">a<strong>b<span>c<em>d</em></span></strong></p><p class="b">e</p><p class="a"><strong><span><em>f</em>g</span>h</strong>i</p>', 'P in P wrapped in inline elements');
deepEqual(countNodes(root), {"body":1, "p":3, "#text":9, "strong":2, "span":2, "em": 2}, 'P in P wrapped in inline elements (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<p class="b">b<p class="c">c</p>d</p>e</p>');
equal(serializer.serialize(root), '<p class="a">a</p><p class="b">b</p><p class="c">c</p><p class="b">d</p><p class="a">e</p>', 'P in P in P with text before/after');
deepEqual(countNodes(root), {body: 1, p:5, '#text': 5}, 'P in P in P with text before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p>a<ul><li>b</li><li>c</li></ul>d</p>');
equal(serializer.serialize(root), '<p>a</p><ul><li>b</li><li>c</li></ul><p>d</p>', 'UL inside P');
deepEqual(countNodes(root), {body: 1, p:2, ul:1, li:2, '#text': 4}, 'UL inside P (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<table><tr><td><tr>a</tr></td></tr></table>');
equal(serializer.serialize(root), '<table><tr><td>a</td></tr></table>', 'TR inside TD');
deepEqual(countNodes(root), {body: 1, table:1, tr:1, td:1, '#text': 1}, 'TR inside TD (count)');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'p,section,div'}));
root = parser.parse('<div><section><p>a</p></section></div>');
equal(serializer.serialize(root), '<div><section><p>a</p></section></div>', 'P inside SECTION');
deepEqual(countNodes(root), {"body":1, "div":1, "section":1, "p":1, "#text":1}, 'P inside SECTION (count)');
});
test('addNodeFilter', function() {
var parser, result;
expect(7);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('text<!--text1-->text<!--text2-->');
deepEqual(result.args, {}, 'Parser args');
equal(result.name, '#comment', 'Parser filter result name');
equal(result.nodes.length, 2, 'Parser filter result node');
equal(result.nodes[0].name, '#comment', 'Parser filter result node(0) name');
equal(result.nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(result.nodes[1].name, '#comment', 'Parser filter result node(1) name');
equal(result.nodes[1].value, 'text2', 'Parser filter result node(1) value');
});
test('addNodeFilter multiple names', function() {
var parser, results = {};
expect(14);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment,#text', function(nodes, name, args) {
results[name] = {nodes : nodes, name : name, args : args};
});
parser.parse('text1<!--text1-->text2<!--text2-->');
deepEqual(results['#comment'].args, {}, 'Parser args');
equal(results['#comment'].name, '#comment', 'Parser filter result name');
equal(results['#comment'].nodes.length, 2, 'Parser filter result node');
equal(results['#comment'].nodes[0].name, '#comment', 'Parser filter result node(0) name');
equal(results['#comment'].nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(results['#comment'].nodes[1].name, '#comment', 'Parser filter result node(1) name');
equal(results['#comment'].nodes[1].value, 'text2', 'Parser filter result node(1) value');
deepEqual(results['#text'].args, {}, 'Parser args');
equal(results['#text'].name, '#text', 'Parser filter result name');
equal(results['#text'].nodes.length, 2, 'Parser filter result node');
equal(results['#text'].nodes[0].name, '#text', 'Parser filter result node(0) name');
equal(results['#text'].nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(results['#text'].nodes[1].name, '#text', 'Parser filter result node(1) name');
equal(results['#text'].nodes[1].value, 'text2', 'Parser filter result node(1) value');
});
test('addNodeFilter with parser args', function() {
var parser, result;
expect(1);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('text<!--text1-->text<!--text2-->', {value: 1});
deepEqual(result.args, {value: 1}, 'Parser args');
});
test('addAttributeFilter', function() {
var parser, result;
expect(7);
parser = new tinymce.html.DomParser({});
parser.addAttributeFilter('src', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('<b>a<img src="1.gif" />b<img src="1.gif" />c</b>');
deepEqual(result.args, {}, 'Parser args');
equal(result.name, 'src', 'Parser filter result name');
equal(result.nodes.length, 2, 'Parser filter result node');
equal(result.nodes[0].name, 'img', 'Parser filter result node(0) name');
equal(result.nodes[0].attr('src'), '1.gif', 'Parser filter result node(0) attr');
equal(result.nodes[1].name, 'img', 'Parser filter result node(1) name');
equal(result.nodes[1].attr('src'), '1.gif', 'Parser filter result node(1) attr');
});
test('addAttributeFilter multiple', function() {
var parser, results = {};
expect(14);
parser = new tinymce.html.DomParser({});
parser.addAttributeFilter('src,href', function(nodes, name, args) {
results[name] = {nodes : nodes, name : name, args : args};
});
parser.parse('<b><a href="1.gif">a</a><img src="1.gif" />b<img src="1.gif" /><a href="2.gif">c</a></b>');
deepEqual(results['src'].args, {}, 'Parser args');
equal(results['src'].name, 'src', 'Parser filter result name');
equal(results['src'].nodes.length, 2, 'Parser filter result node');
equal(results['src'].nodes[0].name, 'img', 'Parser filter result node(0) name');
equal(results['src'].nodes[0].attr('src'), '1.gif', 'Parser filter result node(0) attr');
equal(results['src'].nodes[1].name, 'img', 'Parser filter result node(1) name');
equal(results['src'].nodes[1].attr('src'), '1.gif', 'Parser filter result node(1) attr');
deepEqual(results['href'].args, {}, 'Parser args');
equal(results['href'].name, 'href', 'Parser filter result name');
equal(results['href'].nodes.length, 2, 'Parser filter result node');
equal(results['href'].nodes[0].name, 'a', 'Parser filter result node(0) name');
equal(results['href'].nodes[0].attr('href'), '1.gif', 'Parser filter result node(0) attr');
equal(results['href'].nodes[1].name, 'a', 'Parser filter result node(1) name');
equal(results['href'].nodes[1].attr('href'), '2.gif', 'Parser filter result node(1) attr');
});
test('Fix orphan LI elements', function() {
var parser, result;
expect(3);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>a</li></ul><li>b</li>');
equal(serializer.serialize(root), '<ul><li>a</li><li>b</li></ul>', 'LI moved to previous sibling UL');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<li>a</li><ul><li>b</li></ul>');
equal(serializer.serialize(root), '<ul><li>a</li><li>b</li></ul>', 'LI moved to next sibling UL');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<li>a</li>');
equal(serializer.serialize(root), '<ul><li>a</li></ul>', 'LI wrapped in new UL');
});
test('Remove empty elements', function() {
var parser, result, schema = new tinymce.html.Schema({valid_elements: 'span,-a,img'});
expect(3);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<span></span><a href="#"></a>');
equal(serializer.serialize(root), '<span></span>', 'Remove empty a element');
/* parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<span></span><a href="#"><!-'+'- x -'+'-></a>');
equal(serializer.serialize(root), '<span></span>', 'Remove empty a element containing comment');*/
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'span,a[name],img'}));
root = parser.parse('<span></span><a name="anchor"></a>');
equal(serializer.serialize(root), '<span></span><a name="anchor"></a>', 'Leave a with name attribute');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'span,a[href],img[src]'}));
root = parser.parse('<span></span><a href="#"><img src="about:blank" /></a>');
equal(serializer.serialize(root), '<span></span><a href="#"><img src="about:blank" /></a>', 'Leave elements with img in it');
});
test('Self closing list elements', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>1<li><b>2</b><li><em><b>3</b></em></ul>');
equal(serializer.serialize(root), '<ul><li>1</li><li><strong>2</strong></li><li><em><strong>3</strong></em></li></ul>', 'Split out LI elements in LI elements.');
});
test('Remove redundant br elements', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse(
'<p>a<br></p>' +
'<p>a<br>b<br></p>' +
'<p>a<br><br></p><p>a<br><span data-mce-type="bookmark"></span><br></p>' +
'<p>a<span data-mce-type="bookmark"></span><br></p>'
);
equal(serializer.serialize(root), '<p>a</p><p>a<br />b</p><p>a<br /><br /></p><p>a<br /><br /></p><p>a</p>', 'Remove traling br elements.');
});
test('Replace br with nbsp when wrapped in two inline elements and one block', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<p><strong><em><br /></em></strong></p>');
equal(serializer.serialize(root), '<p><strong><em>\u00a0</em></strong></p>');
});
test('Replace br with nbsp when wrapped in an inline element and placed in the root', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /></strong>');
equal(serializer.serialize(root), '<strong>\u00a0</strong>');
});
test('Don\'t replace br inside root element when there is multiple brs', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /><br /></strong>');
equal(serializer.serialize(root), '<strong><br /><br /></strong>');
});
test('Don\'t replace br inside root element when there is siblings', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /></strong><em>x</em>');
equal(serializer.serialize(root), '<strong><br /></strong><em>x</em>');
});
test('Remove br in invalid parent bug', function() {
var parser, root, schema = new tinymce.html.Schema({valid_elements: 'br'});
expect(1);
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<br>');
equal(serializer.serialize(root), '', 'Remove traling br elements.');
});
test('Forced root blocks', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({forced_root_block : 'p'}, schema);
root = parser.parse(
'<!-- a -->' +
'b' +
'<b>c</b>' +
'<p>d</p>' +
'<p>e</p>' +
'f' +
'<b>g</b>' +
'h'
);
equal(serializer.serialize(root), '<!-- a --><p>b<strong>c</strong></p><p>d</p><p>e</p><p>f<strong>g</strong>h</p>', 'Mixed text nodes, inline elements and blocks.');
});
test('Forced root blocks attrs', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({forced_root_block: 'p', forced_root_block_attrs: {"class": "class1"}}, schema);
root = parser.parse(
'<!-- a -->' +
'b' +
'<b>c</b>' +
'<p>d</p>' +
'<p>e</p>' +
'f' +
'<b>g</b>' +
'h'
);
equal(serializer.serialize(root), '<!-- a -->' +
'<p class="class1">b<strong>c</strong></p>' +
'<p>d</p>' +
'<p>e</p>' +
'<p class="class1">f<strong>g</strong>h</p>',
'Mixed text nodes, inline elements and blocks.');
});
test('Parse contents with html4 anchors and allow_html_in_named_anchor: false', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : false}, schema);
root = parser.parse('<a name="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a name="x"></a>a<a href="x">x</a>');
});
test('Parse contents with html5 anchors and allow_html_in_named_anchor: false', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : false}, schema);
root = parser.parse('<a id="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a id="x"></a>a<a href="x">x</a>');
});
test('Parse contents with html4 anchors and allow_html_in_named_anchor: true', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : true}, schema);
root = parser.parse('<a name="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a name="x">a</a><a href="x">x</a>');
});
test('Parse contents with html5 anchors and allow_html_in_named_anchor: true', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : true}, schema);
root = parser.parse('<a id="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a id="x">a</a><a href="x">x</a>');
});
test('Parse contents with html5 self closing datalist options', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<datalist><option label="a1" value="b1"><option label="a2" value="b2"><option label="a3" value="b3"></datalist>');
equal(serializer.serialize(root), '<datalist><option label="a1" value="b1"></option><option label="a2" value="b2"></option><option label="a3" value="b3"></option></datalist>');
});
test('Parse inline contents before block bug #5424', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<b>1</b> 2<p>3</p>');
equal(serializer.serialize(root), '<b>1</b> 2<p>3</p>');
});
test('Invalid text blocks within a li', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5", valid_children: '-li[p]'});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>1<p>2</p></li><li>a<p>b</p><p>c</p></li></ul>');
equal(serializer.serialize(root), '<ul><li>12</li><li>ab</li><li>c</li></ul>');
});
test('Invalid inline element with space before', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p><span>1</span> <strong>2</strong></p>');
equal(serializer.serialize(root), '<p>1 <strong>2</strong></p>');
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.DomParser tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

483
tests/qunit/editor/tinymce/html/DomParser.js Normal file
View File

@@ -0,0 +1,483 @@
(function() {
module("tinymce.html.DomParser");
var schema = new tinymce.html.Schema({valid_elements: '*[class|title]'});
var serializer = new tinymce.html.Serializer({}, schema);
var parser, root;
function countNodes(node, counter) {
var sibling;
if (!counter) {
counter = {};
}
if (node.name in counter) {
counter[node.name]++;
} else {
counter[node.name] = 1;
}
for (sibling = node.firstChild; sibling; sibling = sibling.next) {
countNodes(sibling, counter);
}
return counter;
}
schema.addValidChildren('+body[style]');
test('Parse element', function() {
var parser, root;
expect(7);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<B title="title" class="class">test</B>');
equal(serializer.serialize(root), '<b class="class" title="title">test</b>', 'Inline element');
equal(root.firstChild.type, 1, 'Element type');
equal(root.firstChild.name, 'b', 'Element name');
deepEqual(root.firstChild.attributes, [{name: 'title', value: 'title'}, {name: 'class', value: 'class'}], 'Element attributes');
deepEqual(countNodes(root), {body:1, b:1, '#text':1}, 'Element attributes (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <SCRIPT> \t\r\n a < b > \t\r\n </S' + 'CRIPT> \t\r\n ');
equal(serializer.serialize(root), '<script> \t\r\n a < b > \t\r\n </s' + 'cript>', 'Retain code inside SCRIPT');
deepEqual(countNodes(root), {body:1, script:1, '#text':1}, 'Retain code inside SCRIPT (count)');
});
test('Whitespace', function() {
expect(12);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <B> \t\r\n test \t\r\n </B> \t\r\n ');
equal(serializer.serialize(root), ' <b> test </b> ', 'Redundant whitespace (inline element)');
deepEqual(countNodes(root), {body:1, b:1, '#text':3}, 'Redundant whitespace (inline element) (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <P> \t\r\n test \t\r\n </P> \t\r\n ');
equal(serializer.serialize(root), '<p>test</p>', 'Redundant whitespace (block element)');
deepEqual(countNodes(root), {body:1, p:1, '#text':1}, 'Redundant whitespace (block element) (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <SCRIPT> \t\r\n test \t\r\n </S' + 'CRIPT> \t\r\n ');
equal(serializer.serialize(root), '<script> \t\r\n test \t\r\n </s' + 'cript>', 'Whitespace around and inside SCRIPT');
deepEqual(countNodes(root), {body:1, script:1, '#text':1}, 'Whitespace around and inside SCRIPT (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <STYLE> \t\r\n test \t\r\n </STYLE> \t\r\n ');
equal(serializer.serialize(root), '<style> \t\r\n test \t\r\n </style>', 'Whitespace around and inside STYLE');
deepEqual(countNodes(root), {body:1, style:1, '#text':1}, 'Whitespace around and inside STYLE (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul>\n<li>Item 1\n<ul>\n<li>\n \t Indented \t \n</li>\n</ul>\n</li>\n</ul>\n');
equal(serializer.serialize(root), '<ul><li>Item 1<ul><li>Indented</li></ul></li></ul>', 'Whitespace around and inside blocks (ul/li)');
deepEqual(countNodes(root), {body:1, li:2, ul:2, '#text':2}, 'Whitespace around and inside blocks (ul/li) (count)');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'hr,br'}));
root = parser.parse('\n<hr />\n<br />\n<div>\n<hr />\n<br />\n<img src="file.gif" data-mce-src="file.gif" />\n<hr />\n<br />\n</div>\n<hr />\n<br />\n');
equal(serializer.serialize(root), '<div><img src="file.gif" data-mce-src="file.gif" alt="" /></div>', 'Whitespace where SaxParser will produce multiple whitespace nodes');
deepEqual(countNodes(root), {body:1, div:1, img:1}, 'Whitespace where SaxParser will produce multiple whitespace nodes (count)');
});
test('Whitespace before/after invalid element with text in block', function() {
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'em'}));
root = parser.parse('<p>a <em>b</em> c</p>');
equal(serializer.serialize(root), '<p>a b c</p>');
});
test('Whitespace before/after invalid element whitespace element in block', function() {
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({invalid_elements : 'span'}));
root = parser.parse('<p> <span></span> </p>');
equal(serializer.serialize(root), '<p>\u00a0</p>');
});
test('Whitespace preserved in PRE', function() {
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <PRE> \t\r\n test \t\r\n </PRE> \t\r\n ');
equal(serializer.serialize(root), '<pre> \t\r\n test \t\r\n </pre>', 'Whitespace around and inside PRE');
deepEqual(countNodes(root), {body:1, pre:1, '#text':1}, 'Whitespace around and inside PRE (count)');
});
test('Whitespace preserved in SPAN inside PRE', function() {
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse(' \t\r\n <PRE> \t\r\n <span> test </span> \t\r\n </PRE> \t\r\n ');
equal(serializer.serialize(root), '<pre> \t\r\n <span> test </span> \t\r\n </pre>', 'Whitespace around and inside PRE');
deepEqual(countNodes(root), {body:1, pre:1, span:1, '#text':3}, 'Whitespace around and inside PRE (count)');
});
test('Parse invalid contents', function() {
var parser, root;
expect(20);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">123</p></p>');
equal(serializer.serialize(root), '<p class="b">123</p>', 'P in P, no nodes before/after');
deepEqual(countNodes(root), {body:1, p:1, '#text':1}, 'P in P, no nodes before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<p class="b">b</p><p class="c">c</p>d</p>');
equal(serializer.serialize(root), '<p class="a">a</p><p class="b">b</p><p class="c">c</p><p class="a">d</p>', 'Two P in P, no nodes before/after');
deepEqual(countNodes(root), {body: 1, p:4, '#text': 4}, 'Two P in P, no nodes before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">abc<p class="b">def</p></p>');
equal(serializer.serialize(root), '<p class="a">abc</p><p class="b">def</p>', 'P in P with nodes before');
deepEqual(countNodes(root), {body: 1, p:2, '#text': 2}, 'P in P with nodes before (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">abc</p>def</p>');
equal(serializer.serialize(root), '<p class="b">abc</p><p class="a">def</p>', 'P in P with nodes after');
deepEqual(countNodes(root), {body: 1, p:2, '#text': 2}, 'P in P with nodes after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a"><p class="b">abc</p><br></p>');
equal(serializer.serialize(root), '<p class="b">abc</p>', 'P in P with BR after');
deepEqual(countNodes(root), {body: 1, p:1, '#text': 1}, 'P in P with BR after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<strong>b<span>c<em>d<p class="b">e</p>f</em>g</span>h</strong>i</p>');
equal(serializer.serialize(root), '<p class="a">a<strong>b<span>c<em>d</em></span></strong></p><p class="b">e</p><p class="a"><strong><span><em>f</em>g</span>h</strong>i</p>', 'P in P wrapped in inline elements');
deepEqual(countNodes(root), {"body":1, "p":3, "#text":9, "strong":2, "span":2, "em": 2}, 'P in P wrapped in inline elements (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p class="a">a<p class="b">b<p class="c">c</p>d</p>e</p>');
equal(serializer.serialize(root), '<p class="a">a</p><p class="b">b</p><p class="c">c</p><p class="b">d</p><p class="a">e</p>', 'P in P in P with text before/after');
deepEqual(countNodes(root), {body: 1, p:5, '#text': 5}, 'P in P in P with text before/after (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p>a<ul><li>b</li><li>c</li></ul>d</p>');
equal(serializer.serialize(root), '<p>a</p><ul><li>b</li><li>c</li></ul><p>d</p>', 'UL inside P');
deepEqual(countNodes(root), {body: 1, p:2, ul:1, li:2, '#text': 4}, 'UL inside P (count)');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<table><tr><td><tr>a</tr></td></tr></table>');
equal(serializer.serialize(root), '<table><tr><td>a</td></tr></table>', 'TR inside TD');
deepEqual(countNodes(root), {body: 1, table:1, tr:1, td:1, '#text': 1}, 'TR inside TD (count)');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'p,section,div'}));
root = parser.parse('<div><section><p>a</p></section></div>');
equal(serializer.serialize(root), '<div><section><p>a</p></section></div>', 'P inside SECTION');
deepEqual(countNodes(root), {"body":1, "div":1, "section":1, "p":1, "#text":1}, 'P inside SECTION (count)');
});
test('addNodeFilter', function() {
var parser, result;
expect(7);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('text<!--text1-->text<!--text2-->');
deepEqual(result.args, {}, 'Parser args');
equal(result.name, '#comment', 'Parser filter result name');
equal(result.nodes.length, 2, 'Parser filter result node');
equal(result.nodes[0].name, '#comment', 'Parser filter result node(0) name');
equal(result.nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(result.nodes[1].name, '#comment', 'Parser filter result node(1) name');
equal(result.nodes[1].value, 'text2', 'Parser filter result node(1) value');
});
test('addNodeFilter multiple names', function() {
var parser, results = {};
expect(14);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment,#text', function(nodes, name, args) {
results[name] = {nodes : nodes, name : name, args : args};
});
parser.parse('text1<!--text1-->text2<!--text2-->');
deepEqual(results['#comment'].args, {}, 'Parser args');
equal(results['#comment'].name, '#comment', 'Parser filter result name');
equal(results['#comment'].nodes.length, 2, 'Parser filter result node');
equal(results['#comment'].nodes[0].name, '#comment', 'Parser filter result node(0) name');
equal(results['#comment'].nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(results['#comment'].nodes[1].name, '#comment', 'Parser filter result node(1) name');
equal(results['#comment'].nodes[1].value, 'text2', 'Parser filter result node(1) value');
deepEqual(results['#text'].args, {}, 'Parser args');
equal(results['#text'].name, '#text', 'Parser filter result name');
equal(results['#text'].nodes.length, 2, 'Parser filter result node');
equal(results['#text'].nodes[0].name, '#text', 'Parser filter result node(0) name');
equal(results['#text'].nodes[0].value, 'text1', 'Parser filter result node(0) value');
equal(results['#text'].nodes[1].name, '#text', 'Parser filter result node(1) name');
equal(results['#text'].nodes[1].value, 'text2', 'Parser filter result node(1) value');
});
test('addNodeFilter with parser args', function() {
var parser, result;
expect(1);
parser = new tinymce.html.DomParser({}, schema);
parser.addNodeFilter('#comment', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('text<!--text1-->text<!--text2-->', {value: 1});
deepEqual(result.args, {value: 1}, 'Parser args');
});
test('addAttributeFilter', function() {
var parser, result;
expect(7);
parser = new tinymce.html.DomParser({});
parser.addAttributeFilter('src', function(nodes, name, args) {
result = {nodes : nodes, name : name, args : args};
});
parser.parse('<b>a<img src="1.gif" />b<img src="1.gif" />c</b>');
deepEqual(result.args, {}, 'Parser args');
equal(result.name, 'src', 'Parser filter result name');
equal(result.nodes.length, 2, 'Parser filter result node');
equal(result.nodes[0].name, 'img', 'Parser filter result node(0) name');
equal(result.nodes[0].attr('src'), '1.gif', 'Parser filter result node(0) attr');
equal(result.nodes[1].name, 'img', 'Parser filter result node(1) name');
equal(result.nodes[1].attr('src'), '1.gif', 'Parser filter result node(1) attr');
});
test('addAttributeFilter multiple', function() {
var parser, results = {};
expect(14);
parser = new tinymce.html.DomParser({});
parser.addAttributeFilter('src,href', function(nodes, name, args) {
results[name] = {nodes : nodes, name : name, args : args};
});
parser.parse('<b><a href="1.gif">a</a><img src="1.gif" />b<img src="1.gif" /><a href="2.gif">c</a></b>');
deepEqual(results.src.args, {}, 'Parser args');
equal(results.src.name, 'src', 'Parser filter result name');
equal(results.src.nodes.length, 2, 'Parser filter result node');
equal(results.src.nodes[0].name, 'img', 'Parser filter result node(0) name');
equal(results.src.nodes[0].attr('src'), '1.gif', 'Parser filter result node(0) attr');
equal(results.src.nodes[1].name, 'img', 'Parser filter result node(1) name');
equal(results.src.nodes[1].attr('src'), '1.gif', 'Parser filter result node(1) attr');
deepEqual(results.href.args, {}, 'Parser args');
equal(results.href.name, 'href', 'Parser filter result name');
equal(results.href.nodes.length, 2, 'Parser filter result node');
equal(results.href.nodes[0].name, 'a', 'Parser filter result node(0) name');
equal(results.href.nodes[0].attr('href'), '1.gif', 'Parser filter result node(0) attr');
equal(results.href.nodes[1].name, 'a', 'Parser filter result node(1) name');
equal(results.href.nodes[1].attr('href'), '2.gif', 'Parser filter result node(1) attr');
});
test('Fix orphan LI elements', function() {
var parser;
expect(3);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>a</li></ul><li>b</li>');
equal(serializer.serialize(root), '<ul><li>a</li><li>b</li></ul>', 'LI moved to previous sibling UL');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<li>a</li><ul><li>b</li></ul>');
equal(serializer.serialize(root), '<ul><li>a</li><li>b</li></ul>', 'LI moved to next sibling UL');
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<li>a</li>');
equal(serializer.serialize(root), '<ul><li>a</li></ul>', 'LI wrapped in new UL');
});
test('Remove empty elements', function() {
var parser, schema = new tinymce.html.Schema({valid_elements: 'span,-a,img'});
expect(3);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<span></span><a href="#"></a>');
equal(serializer.serialize(root), '<span></span>', 'Remove empty a element');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'span,a[name],img'}));
root = parser.parse('<span></span><a name="anchor"></a>');
equal(serializer.serialize(root), '<span></span><a name="anchor"></a>', 'Leave a with name attribute');
parser = new tinymce.html.DomParser({}, new tinymce.html.Schema({valid_elements: 'span,a[href],img[src]'}));
root = parser.parse('<span></span><a href="#"><img src="about:blank" /></a>');
equal(serializer.serialize(root), '<span></span><a href="#"><img src="about:blank" /></a>', 'Leave elements with img in it');
});
test('Self closing list elements', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>1<li><b>2</b><li><em><b>3</b></em></ul>');
equal(serializer.serialize(root), '<ul><li>1</li><li><strong>2</strong></li><li><em><strong>3</strong></em></li></ul>', 'Split out LI elements in LI elements.');
});
test('Remove redundant br elements', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse(
'<p>a<br></p>' +
'<p>a<br>b<br></p>' +
'<p>a<br><br></p><p>a<br><span data-mce-type="bookmark"></span><br></p>' +
'<p>a<span data-mce-type="bookmark"></span><br></p>'
);
equal(serializer.serialize(root), '<p>a</p><p>a<br />b</p><p>a<br /><br /></p><p>a<br /><br /></p><p>a</p>', 'Remove traling br elements.');
});
test('Replace br with nbsp when wrapped in two inline elements and one block', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<p><strong><em><br /></em></strong></p>');
equal(serializer.serialize(root), '<p><strong><em>\u00a0</em></strong></p>');
});
test('Replace br with nbsp when wrapped in an inline element and placed in the root', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /></strong>');
equal(serializer.serialize(root), '<strong>\u00a0</strong>');
});
test('Don\'t replace br inside root element when there is multiple brs', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /><br /></strong>');
equal(serializer.serialize(root), '<strong><br /><br /></strong>');
});
test('Don\'t replace br inside root element when there is siblings', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<strong><br /></strong><em>x</em>');
equal(serializer.serialize(root), '<strong><br /></strong><em>x</em>');
});
test('Remove br in invalid parent bug', function() {
var parser, root, schema = new tinymce.html.Schema({valid_elements: 'br'});
expect(1);
parser = new tinymce.html.DomParser({remove_trailing_brs : true}, schema);
root = parser.parse('<br>');
equal(serializer.serialize(root), '', 'Remove traling br elements.');
});
test('Forced root blocks', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({forced_root_block : 'p'}, schema);
root = parser.parse(
'<!-- a -->' +
'b' +
'<b>c</b>' +
'<p>d</p>' +
'<p>e</p>' +
'f' +
'<b>g</b>' +
'h'
);
equal(serializer.serialize(root), '<!-- a --><p>b<strong>c</strong></p><p>d</p><p>e</p><p>f<strong>g</strong>h</p>', 'Mixed text nodes, inline elements and blocks.');
});
test('Forced root blocks attrs', function() {
var parser, root, schema = new tinymce.html.Schema();
expect(1);
parser = new tinymce.html.DomParser({forced_root_block: 'p', forced_root_block_attrs: {"class": "class1"}}, schema);
root = parser.parse(
'<!-- a -->' +
'b' +
'<b>c</b>' +
'<p>d</p>' +
'<p>e</p>' +
'f' +
'<b>g</b>' +
'h'
);
equal(serializer.serialize(root), '<!-- a -->' +
'<p class="class1">b<strong>c</strong></p>' +
'<p>d</p>' +
'<p>e</p>' +
'<p class="class1">f<strong>g</strong>h</p>',
'Mixed text nodes, inline elements and blocks.');
});
test('Parse contents with html4 anchors and allow_html_in_named_anchor: false', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : false}, schema);
root = parser.parse('<a name="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a name="x"></a>a<a href="x">x</a>');
});
test('Parse contents with html5 anchors and allow_html_in_named_anchor: false', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : false}, schema);
root = parser.parse('<a id="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a id="x"></a>a<a href="x">x</a>');
});
test('Parse contents with html4 anchors and allow_html_in_named_anchor: true', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : true}, schema);
root = parser.parse('<a name="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a name="x">a</a><a href="x">x</a>');
});
test('Parse contents with html5 anchors and allow_html_in_named_anchor: true', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({allow_html_in_named_anchor : true}, schema);
root = parser.parse('<a id="x">a</a><a href="x">x</a>');
equal(serializer.serialize(root), '<a id="x">a</a><a href="x">x</a>');
});
test('Parse contents with html5 self closing datalist options', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<datalist><option label="a1" value="b1"><option label="a2" value="b2"><option label="a3" value="b3"></datalist>');
equal(serializer.serialize(root), '<datalist><option label="a1" value="b1"></option><option label="a2" value="b2"></option><option label="a3" value="b3"></option></datalist>');
});
test('Parse inline contents before block bug #5424', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5"});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<b>1</b> 2<p>3</p>');
equal(serializer.serialize(root), '<b>1</b> 2<p>3</p>');
});
test('Invalid text blocks within a li', function() {
var parser, root, schema = new tinymce.html.Schema({schema: "html5", valid_children: '-li[p]'});
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<ul><li>1<p>2</p></li><li>a<p>b</p><p>c</p></li></ul>');
equal(serializer.serialize(root), '<ul><li>12</li><li>ab</li><li>c</li></ul>');
});
test('Invalid inline element with space before', function() {
var parser, root, schema = new tinymce.html.Schema();
parser = new tinymce.html.DomParser({}, schema);
root = parser.parse('<p><span>1</span> <strong>2</strong></p>');
equal(serializer.serialize(root), '<p>1 <strong>2</strong></p>');
});
})();

25
tests/qunit/editor/tinymce/html/Entities.html → tests/qunit/editor/tinymce/html/Entities.js
View File

@@ -1,18 +1,5 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Entities tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Entities");
QUnit.config.reorder = false;
test('encodeRaw', function() {
expect(2);
@@ -84,15 +71,3 @@ test('decode', function() {
equal(tinymce.html.Entities.encodeNumeric(tinymce.html.Entities.decode('&#194564;')), '&#194564;', "High byte non western character.");
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Entities tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

32
tests/qunit/editor/tinymce/html/Node.html → tests/qunit/editor/tinymce/html/Node.js
View File

@@ -1,18 +1,5 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Node tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Node");
QUnit.config.reorder = false;
test('construction', function() {
var node;
@@ -49,7 +36,7 @@ test('construction', function() {
});
test('append inside empty node', function() {
var root, node, node2;
var root, node;
expect(10);
@@ -120,7 +107,7 @@ test('remove unattached node', function() {
});
test('remove single child', function() {
var root, node, node2, node3;
var root, node;
expect(6);
@@ -192,7 +179,7 @@ test('insert before first', function() {
});
test('insert before second', function() {
var fragment, root, node, node2;
var fragment, root, node, node2, node3;
expect(5);
@@ -209,7 +196,7 @@ test('insert before second', function() {
});
test('insert after and between two nodes', function() {
var root, node, node2, node3;
var root, node, node2, node3, fragment;
expect(7);
@@ -453,14 +440,3 @@ test('isEmpty', function() {
node1 = root.append(new tinymce.html.Node('a', 1)).attr('name', 'x');
ok(!root.isEmpty({img: 1}), 'Contains anchor with name attribute.');
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Node tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

128
tests/qunit/editor/tinymce/html/obsolete.html → tests/qunit/editor/tinymce/html/Obsolete.js
View File

@@ -1,26 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>Support for obsolete tags and attributes in the default HTML 5.0 schema</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
var editor;
module( 'tinymce.html.Obsolete', {
setupModule: function() {
QUnit.stop();
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("tinymce.html.Schema", {
autostart: false
tinymce.init({
selector: 'textarea',
add_unload_trigger : false,
skin: false,
indent : false,
entities : 'raw',
plugins: 'media',
convert_urls : false,
init_instance_callback : function(ed) {
window.editor = ed;
QUnit.start();
}
});
}
});
function getContent() {
return editor.getContent().replace(/[\r\n]+/g, '');
};
/**
* Test whether attribute exists in a HTML string
*
@@ -94,30 +91,30 @@ test('HTML elements non-conforming to HTML 5.0', function() {
text = 'acronym';
testString = '<p><acronym title="www">WWW</acronym></p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'strike, converted to span';
editor.setContent( '<strike>test</strike>' );
equal( getContent(), '<p><span style="text-decoration: line-through;">test</span></p>', text );
equal( editor.getContent(), '<p><span style="text-decoration: line-through;">test</span></p>', text );
text = 'big';
testString = '<p><big>test</big></p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'center';
testString = '<center>test</center>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'font, converted to span';
editor.setContent( '<p><font size="4">test</font></p>' );
equal( getContent(), '<p><span style="font-size: large;">test</span></p>', text );
equal( editor.getContent(), '<p><span style="font-size: large;">test</span></p>', text );
text = 'tt';
testString = '<p><tt>test</tt></p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
});
test('Obsolete (but still conforming) HTML attributes', function() {
@@ -128,17 +125,17 @@ test('Obsolete (but still conforming) HTML attributes', function() {
text = 'border on <img>';
testString = '<p><img src="../../test.gif" alt="" border="5" /></p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'Old style anchors';
testString = '<p><a name="test"></a></p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'maxlength, size on input type="number"';
testString = '<p><input maxlength="5" size="10" type="number" value="" /></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { input: 'maxlength size' } ), text );
ok( hasAttr( editor.getContent(), { input: 'maxlength size' } ), text );
});
test('Obsolete attributes in HTML 5.0', function() {
@@ -149,37 +146,37 @@ test('Obsolete attributes in HTML 5.0', function() {
text = 'charset, rev, shape, coords on <a> elements';
testString = '<p><a href="javascript;:" charset="en" rev="made" shape="rect" coords="5,5">test</a></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { a: 'charset rev shape coords' } ), text );
ok( hasAttr( editor.getContent(), { a: 'charset rev shape coords' } ), text );
text = 'name, align, hspace, vspace on img elements';
testString = '<p><img src="../../test.gif" alt="" name="test" align="left" hspace="5" vspace="5" /></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { img: 'name align hspace vspace' } ), text );
ok( hasAttr( editor.getContent(), { img: 'name align hspace vspace' } ), text );
text = 'name, align, hspace, vspace, on embed elements';
testString = '<p><embed width="100" height="100" src="test.swf" vspace="5" hspace="5" align="left" name="test"></embed></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { embed: 'name align hspace vspace' } ), text );
ok( hasAttr( editor.getContent(), { embed: 'name align hspace vspace' } ), text );
text = 'archive, classid, code, codebase, codetype, declare, standby on object elements';
testString = '<p><object width="100" height="100" classid="clsid" codebase="clsid" standby="standby" codetype="1" code="1" archive="1" declare="declare"></object></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { object: 'archive classid code codebase codetype declare standby' } ), text );
ok( hasAttr( editor.getContent(), { object: 'archive classid code codebase codetype declare standby' } ), text );
text = 'type, valuetype on param elements';
testString = '<p><object width="100" height="100"><param type="" valuetype="" /></object></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { param: 'type valuetype' } ), text );
ok( hasAttr( editor.getContent(), { param: 'type valuetype' } ), text );
text = 'align, bgcolor, border, cellpadding, cellspacing, frame, rules, summary, width on table elements';
testString = '<table border="1" summary="" width="100" frame="" rules="" cellspacing="5" cellpadding="5" align="left" bgcolor="blue"><tbody><tr><td>test</td></tr></tbody></table>';
editor.setContent( testString );
ok( hasAttr( getContent(), { table: 'align bgcolor border cellpadding cellspacing frame rules summary width' } ), text );
ok( hasAttr( editor.getContent(), { table: 'align bgcolor border cellpadding cellspacing frame rules summary width' } ), text );
text = 'align, char, charoff, valign on tbody, thead, and tfoot elements';
testString = '<table><thead align="left" char="" charoff="" valign="top"></thead><tfoot align="left" char="" charoff="" valign="top"></tfoot><tbody align="left" char="" charoff="" valign="top"><tr><th>test</th><td>test</td></tr></tbody></table>';
editor.setContent( testString );
ok( hasAttr( getContent(), {
ok( hasAttr( editor.getContent(), {
thead: 'align char charoff valign',
tfoot: 'align char charoff valign',
tbody: 'align char charoff valign'
@@ -188,7 +185,7 @@ test('Obsolete attributes in HTML 5.0', function() {
text = 'axis, align, bgcolor, char, charoff, height, nowrap, valign, width on td and th elements, scope on td elements';
testString = '<table><tbody><tr><th axis="" align="left" char="" charoff="" valign="top" nowrap="nowrap" bgcolor="blue" width="100" height="10">test</th><td axis="" align="left" char="" charoff="" valign="top" nowrap="nowrap" bgcolor="blue" width="100" height="10" scope="">test</td></tr></tbody></table>';
editor.setContent( testString );
ok( hasAttr( getContent(), {
ok( hasAttr( editor.getContent(), {
th: 'axis align bgcolor char charoff height nowrap valign width',
td: 'axis align bgcolor char charoff height nowrap valign width scope'
} ), text );
@@ -196,99 +193,70 @@ test('Obsolete attributes in HTML 5.0', function() {
text = 'align, bgcolor, char, charoff, valign on tr elements';
testString = '<table><tbody><tr align="left" char="" charoff="" valign="top" bgcolor="blue"><td>test</td></tr></tbody></table>';
editor.setContent( testString );
ok( hasAttr( getContent(), { tr: 'align bgcolor char charoff valign' } ), text );
ok( hasAttr( editor.getContent(), { tr: 'align bgcolor char charoff valign' } ), text );
text = 'clear on br elements';
testString = '<p>test<br clear="all" />test</p>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'align on caption elements';
testString = '<table><caption align="left">test</caption><tbody><tr><td>test</td></tr></tbody></table>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'align, char, charoff, valign, width on col elements';
testString = '<table><colgroup><col width="100" align="left" char="a" charoff="1" valign="top" /><col /></colgroup><tbody><tr><td>test</td><td>test</td></tr></tbody></table>';
editor.setContent( testString );
ok( hasAttr( getContent(), { col: 'align char charoff valign width' } ), text );
ok( hasAttr( editor.getContent(), { col: 'align char charoff valign width' } ), text );
text = 'align on div, h1—h6, input, legend, p elements';
testString = '<div align="left">1</div><h3 align="left">1</h3><p align="left">1</p><form><fieldset><legend align="left">test</legend><input type="text" align="left" /></fieldset></form>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'compact on dl elements';
testString = '<dl compact="compact"><dd>1</dd></dl>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'align, hspace, vspace on embed elements';
testString = '<p><embed width="100" height="100" vspace="5" hspace="5" align="left"></embed></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { embed: 'align hspace vspace' } ), text );
ok( hasAttr( editor.getContent(), { embed: 'align hspace vspace' } ), text );
text = 'align, noshade, size, width on hr elements';
testString = '<hr align="left" noshade="noshade" size="1" width="100" />';
editor.setContent( testString );
ok( hasAttr( getContent(), { hr: 'align noshade size width' } ), text );
ok( hasAttr( editor.getContent(), { hr: 'align noshade size width' } ), text );
text = 'align, frameborder, marginheight, marginwidth, scrolling on iframe elements';
testString = '<p><iframe width="100" height="100" frameborder="1" marginwidth="5" marginheight="5" scrolling="" align="left"></iframe></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { iframe: 'align frameborder marginheight marginwidth scrolling' } ), text );
ok( hasAttr( editor.getContent(), { iframe: 'align frameborder marginheight marginwidth scrolling' } ), text );
text = 'type on li elements';
testString = '<ul><li type="disc">test</li></ul>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'align, border, hspace, vspace on object elements';
testString = '<p><object width="100" height="100" border="1" vspace="5" hspace="5" align="left"></object></p>';
editor.setContent( testString );
ok( hasAttr( getContent(), { object: 'align border hspace vspace' } ), text );
ok( hasAttr( editor.getContent(), { object: 'align border hspace vspace' } ), text );
text = 'compact on ol elements';
testString = '<ol compact="compact"><li>test</li></ol>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
text = 'compact, type on ul elements';
testString = '<ul type="disc" compact="compact"><li>test</li></ul>';
editor.setContent( testString );
ok( hasAttr( getContent(), { ul: 'compact type' } ), text );
ok( hasAttr( editor.getContent(), { ul: 'compact type' } ), text );
text = 'width on pre elements';
testString = '<pre width="100">1</pre>';
editor.setContent( testString );
equal( getContent(), testString, text );
equal( editor.getContent(), testString, text );
});
tinymce.init({
mode : "exact",
elements : "elm1",
add_unload_trigger : false,
indent : false,
entities : 'raw',
plugins: 'media',
convert_urls : false,
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Support for obsolete tags and attributes in the default HTML 5.0 schema</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<textarea id="elm1" name="elm1"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
</div>
</body>
</html>

616
tests/qunit/editor/tinymce/html/SaxParser.html
View File

@@ -1,616 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.SaxParser tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.SaxParser");
QUnit.config.reorder = false;
var writer = new tinymce.html.Writer(), schema = new tinymce.html.Schema();
function createCounter(writer) {
var counts = {};
return {
counts : counts,
comment: function(text) {
if ("comment" in counts)
counts.comment++;
else
counts.comment = 1;
writer.comment(text);
},
cdata: function(text) {
if ("cdata" in counts)
counts.cdata++;
else
counts.cdata = 1;
writer.cdata(text);
},
text: function(text, raw) {
if ("text" in counts)
counts.text++;
else
counts.text = 1;
writer.text(text, raw);
},
start: function(name, attrs, empty) {
if ("start" in counts)
counts.start++;
else
counts.start = 1;
writer.start(name, attrs, empty);
},
end: function(name) {
if ("end" in counts)
counts.end++;
else
counts.end = 1;
writer.end(name);
},
pi: function(name, text) {
if ("pi" in counts)
counts.pi++;
else
counts.pi = 1;
writer.pi(name, text);
},
doctype: function(text) {
if ("doctype:" in counts)
counts.doctype++;
else
counts.doctype = 1;
writer.doctype(text);
}
};
}
test('Parse elements', function() {
expect(46);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id=id1 title="title value" class=\'class1 class2\' data-value="value1" MYATTR="val1" myns:myattr="val2" disabled empty=""></span>');
equal(writer.getContent(), '<span id="id1" title="title value" class="class1 class2" data-value="value1" myattr="val1" myns:myattr="val2" disabled="disabled" empty=""></span>', 'Parse attribute formats.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse attribute formats counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b href=\'"&amp;<>\'></b>');
equal(writer.getContent(), '<b href="&quot;&amp;&lt;&gt;"></b>', 'Parse attributes with <> in them.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse attributes with <> in them (count).');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title=" "class=" "></span>');
equal(writer.getContent(), '<span title=" " class=" "></span>', 'Parse compressed attributes.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse compressed attributes (count).');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title></span>');
equal(writer.getContent(), '<span title=""></span>', 'Single empty attribute.');
deepEqual(counter.counts, {start:1, end:1}, 'Single empty attributes (count).');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span class="class" title></span>');
equal(writer.getContent(), '<span class="class" title=""></span>', 'Empty attribute at end.');
deepEqual(counter.counts, {start:1, end:1}, 'Empty attribute at end (count).');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title class="class"></span>');
equal(writer.getContent(), '<span title="" class="class"></span>', 'Empty attribute at start.');
deepEqual(counter.counts, {start:1, end:1}, 'Empty attribute at start (count).');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img src="test">');
equal(writer.getContent(), '<img src="test" />', 'Parse empty element.');
deepEqual(counter.counts, {start:1}, 'Parse empty element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img\nsrc="test"\ntitle="row1\nrow2">');
equal(writer.getContent(), '<img src="test" title="row1\nrow2" />', 'Parse attributes with linebreak.');
deepEqual(counter.counts, {start: 1}, 'Parse attributes with linebreak counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img \t \t src="test" \t \t title="\t row1\t row2">');
equal(writer.getContent(), '<img src="test" title="\t row1\t row2" />', 'Parse attributes with whitespace.');
deepEqual(counter.counts, {start: 1}, 'Parse attributes with whitespace counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<myns:mytag>text</myns:mytag>');
equal(writer.getContent(), '<myns:mytag>text</myns:mytag>', 'Parse element with namespace.');
deepEqual(counter.counts, {start:1, text:1, end: 1}, 'Parse element with namespace counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<myns-mytag>text</myns-mytag>');
equal(writer.getContent(), '<myns-mytag>text</myns-mytag>', 'Parse element with dash name.');
deepEqual(counter.counts, {start:1, text:1, end:1}, 'Parse element with dash name counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<p>text2<b>text3</p>text4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>text4text5', 'Parse tag soup 1.');
deepEqual(counter.counts, {text:5, start: 2, end: 2}, 'Parse tag soup 1 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<P>text2<B>text3</p>text4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>text4text5', 'Parse tag soup 2.');
deepEqual(counter.counts, {text: 5, start: 2, end: 2}, 'Parse tag soup 2 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<P>text2<B>tex<t3</p>te>xt4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>tex&lt;t3</b></p>te&gt;xt4text5', 'Parse tag soup 3.');
deepEqual(counter.counts, {text: 5, start: 2, end: 2}, 'Parse tag soup 3 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<p>text2<b>text3');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>', 'Parse tag soup 4.');
deepEqual(counter.counts, {text: 3, start: 2, end: 2}, 'Parse tag soup 4 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<script>text2');
equal(writer.getContent(), 'text1<script>text2</s' + 'cript>', 'Parse tag soup 5.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse tag soup 5 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<style>text2');
equal(writer.getContent(), 'text1<style>text2</st' + 'yle>', 'Parse tag soup 6.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse tag soup 6 counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<span title="<test" data-test="test>"></span>');
equal(writer.getContent(), 'text1<span title="&lt;test" data-test="test&gt;"></span>', 'Parse element with </> in attributes.');
deepEqual(counter.counts, {text: 1, start: 1, end: 1}, 'Parse element with </> in attributes counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse("text\n<SC"+"RIPT type=mce-text/javascript>// <![CDATA[\nalert('HELLO WORLD!');\n// ]]></SC"+"RIPT>");
equal(writer.getContent(), "text\n<sc"+"ript type=\"mce-text/javascript\">// <![CDATA[\nalert('HELLO WORLD!');\n// ]]></sc"+"ript>", 'Parse cdata script.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse cdata script counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<noscript>te<br>xt2</noscript>text3');
equal(writer.getContent(), 'text1<noscript>te<br>xt2</noscript>text3', 'Parse noscript elements.');
deepEqual(counter.counts, {text: 3, start: 1, end: 1}, 'Parse noscript elements counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p>a</p><p /><p>b</p>');
equal(writer.getContent(), '<p>a</p><p></p><p>b</p>', 'Parse invalid closed element.');
deepEqual(counter.counts, {text: 2, start: 3, end: 3}, 'Parse invalid closed element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<br><br /><br/>');
equal(writer.getContent(), '<br /><br /><br />', 'Parse short ended elements.');
deepEqual(counter.counts, {start: 3}, 'Parse short ended elements counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p ></p>');
equal(writer.getContent(), '<p></p>', 'Parse start elements with whitespace only attribs part.');
deepEqual(counter.counts, {start: 1, end: 1}, 'Parse start elements with whitespace only attribs part (counts).');
});
test('Parse style elements', function() {
expect(8);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style>// <b>tag</b></st' + 'yle>text2</em>');
equal(writer.getContent(), 'text1<em><style>// <b>tag</b></st' + 'yle>text2</em>', 'Parse style element.');
deepEqual(counter.counts, {start: 2, end: 2, text: 3}, 'Parse style element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style id="id">// <b>tag</b></st' + 'yle>text2</em>');
equal(writer.getContent(), 'text1<em><style id="id">// <b>tag</b></st' + 'yle>text2</em>', 'Parse style element with attributes.');
deepEqual(counter.counts, {text:3, start:2, end:2}, 'Parse style element with attributes counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style></st' + 'yle>text2</span>');
equal(writer.getContent(), 'text1<em><style></st' + 'yle>text2</em>', 'Parse empty style element.');
deepEqual(counter.counts, {text:2, start:2, end:2}, 'Parse empty style element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(tinymce.extend({validate : true}, counter), new tinymce.html.Schema({invalid_elements: 'style'}));
writer.reset();
parser.parse('text1<em><style>text2</st' + 'yle>text3</em>');
equal(writer.getContent(), 'text1<em>text3</em>', 'Parse invalid style element.');
deepEqual(counter.counts, {text:2, start:1, end:1}, 'Parse invalid style element (count).');
});
test('Parse script elements', function() {
expect(8);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script>// <b>tag</b></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script>// <b>tag</b></s' + 'cript>text2</em>', 'Parse script element.');
deepEqual(counter.counts, {start:2, end:2, text:3}, 'Parse script element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script id="id">// <b>tag</b></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script id="id">// <b>tag</b></s' + 'cript>text2</em>', 'Parse script element with attributes.');
deepEqual(counter.counts, {start:2, end:2, text:3}, 'Parse script element with attributes counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script></s' + 'cript>text2</em>', 'Parse empty script element.');
deepEqual(counter.counts, {text: 2, start:2, end: 2}, 'Parse empty script element counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(tinymce.extend({validate : true}, counter), new tinymce.html.Schema({invalid_elements: 'script'}));
writer.reset();
parser.parse('text1<em><s' + 'cript>text2</s' + 'cript>text3</em>');
equal(writer.getContent(), 'text1<em>text3</em>', 'Parse invalid script element.');
deepEqual(counter.counts, {text:2, start:1, end:1}, 'Parse invalid script element (count).');
});
test('Parse text', function() {
expect(10);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('');
equal(writer.getContent(), '', 'Parse empty.');
deepEqual(counter.counts, {}, 'Parse empty counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text');
equal(writer.getContent(), 'text', 'Parse single text node.');
deepEqual(counter.counts, {text: 1}, 'Parse single text node counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>text</b>');
equal(writer.getContent(), '<b>text</b>', 'Parse wrapped text.');
deepEqual(counter.counts, {start:1, text:1, end:1}, 'Parse wrapped text counts');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<b>text2</b>');
equal(writer.getContent(), 'text1<b>text2</b>', 'Parse text at start.');
deepEqual(counter.counts, {start:1, text:2, end:1}, 'Parse text at start counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>text1</b>text2');
equal(writer.getContent(), '<b>text1</b>text2', 'Parse text at end.');
deepEqual(counter.counts, {start:1, end:1, text:2}, 'Parse text at end counts.');
});
test('Parsing comments', function() {
expect(8);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!-- comment value -->');
equal(writer.getContent(), '<!-- comment value -->', 'Parse comment with value.');
deepEqual(counter.counts, {comment:1}, 'Parse comment with value count.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!---->');
equal(writer.getContent(), '', 'Parse comment without value.');
deepEqual(counter.counts, {}, 'Parse comment without value count.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--<b></b>-->');
equal(writer.getContent(), '<!--<b></b>-->', 'Parse comment with tag inside.');
deepEqual(counter.counts, {comment:1}, 'Parse comment with tag inside counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>a<!-- value -->b</b>');
equal(writer.getContent(), '<b>a<!-- value -->b</b>', 'Parse comment with tags around it.');
deepEqual(counter.counts, {comment:1, text:2, start:1, end:1}, 'Parse comment with tags around it counts.');
});
test('Parsing cdata', function() {
expect(8);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[test text]]>');
equal(writer.getContent(), '<![CDATA[test text]]>', 'Parse cdata with value.');
deepEqual(counter.counts, {cdata:1}, 'Parse cdata with value counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[]]>');
equal(writer.getContent(), '', 'Parse cdata without value.');
deepEqual(counter.counts, {}, 'Parse cdata without value counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[<b>a</b>]]>');
equal(writer.getContent(), '<![CDATA[<b>a</b>]]>', 'Parse cdata with tag inside.');
deepEqual(counter.counts, {cdata:1}, 'Parse cdata with tag inside counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>a<![CDATA[value]]>b</b>');
equal(writer.getContent(), '<b>a<![CDATA[value]]>b</b>', 'Parse cdata with tags around it.');
deepEqual(counter.counts, {cdata:1, start:1, end:1, text:2}, 'Parse cdata with tags around it counts.');
});
test('Parse PI', function() {
expect(6);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml version="1.0" encoding="UTF-8" ?>text1');
equal(writer.getContent(), '<?xml version="1.0" encoding="UTF-8" ?>text1', 'Parse PI with attributes.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with attributes counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml?>text1');
equal(writer.getContent(), '<?xml?>text1', 'Parse PI with no data.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with data counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml somevalue/>text1');
equal(writer.getContent(), '<?xml somevalue?>text1', 'Parse PI with IE style ending.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with IE style ending counts.');
});
test('Parse doctype', function() {
expect(4);
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">text1');
equal(writer.getContent(), '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">text1', 'Parse DOCTYPE.');
deepEqual(counter.counts, {doctype:1, text:1}, 'Parse HTML5 DOCTYPE counts.');
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!DOCTYPE html>text1');
equal(writer.getContent(), '<!DOCTYPE html>text1', 'Parse HTML5 DOCTYPE.');
deepEqual(counter.counts, {doctype:1, text:1}, 'Parse HTML5 DOCTYPE counts.');
});
test('Parse (validate)', function() {
expect(2);
var counter = createCounter(writer);
counter.validate = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<invalid1>123<invalid2 />456<span title="title" invalid3="value">789</span>012</invalid1>');
equal(writer.getContent(), '123456<span title="title">789</span>012', 'Parse invalid elements and attributes.');
deepEqual(counter.counts, {start:1, end:1, text:4}, 'Parse invalid elements and attributes counts.');
});
test('Self closing', function() {
expect(1);
var counter = createCounter(writer);
counter.validate = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<ul><li>1<li><b>2</b><li><em><b>3</b></em></ul>');
equal(writer.getContent(), '<ul><li>1</li><li><b>2</b></li><li><em><b>3</b></em></li></ul>', 'Parse list with self closing items.');
});
test('Preserve internal elements', function() {
expect(2);
var schema = new tinymce.html.Schema({valid_elements : 'b'});
var counter = createCounter(writer);
counter.validate = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<b>text</b><span id="id" data-mce-type="something"></span>', 'Preserve internal span element without any span schema rule.');
var schema = new tinymce.html.Schema({valid_elements : 'b,span[class]'});
var counter = createCounter(writer);
counter.validate = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id" class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<span class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>', 'Preserve internal span element with a span schema rule.');
});
test('Remove internal elements', function() {
expect(2);
var schema = new tinymce.html.Schema({valid_elements : 'b'});
var counter = createCounter(writer);
counter.validate = true;
counter.remove_internals = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<b>text</b>', 'Remove internal span element without any span schema rule.');
var schema = new tinymce.html.Schema({valid_elements : 'b,span[class]'});
var counter = createCounter(writer);
counter.validate = true;
counter.remove_internals = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id" class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<span class="class"><b>text</b></span>', 'Remove internal span element with a span schema rule.');
// Reset
counter.remove_internals = false;
});
test('Parse attr with backslash #5436', function() {
var counter = createCounter(writer);
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<a title="\\" href="h">x</a>');
equal(writer.getContent(), '<a title="\\" href="h">x</a>');
});
test('Parse no attributes span before strong', function() {
var counter = createCounter(writer);
counter.validate = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p><span>A</span> <strong>B</strong></p>');
equal(writer.getContent(), '<p>A <strong>B</strong></p>');
});
test('Conditional comments (allowed)', function() {
var counter = createCounter(writer);
counter.validate = false;
counter.allow_conditional_comments = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--[if gte IE 4]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!--[if gte IE 4]>alert(1)<![endif]-->');
});
test('Conditional comments (denied)', function() {
var counter = createCounter(writer);
counter.validate = false;
counter.allow_conditional_comments = false;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--[if gte IE 4]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!-- [if gte IE 4]>alert(1)<![endif]-->');
writer.reset();
parser.parse('<!--[if !IE]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!-- [if !IE]>alert(1)<![endif]-->');
});
test('Parse script urls (allowed)', function() {
var counter = createCounter(writer);
counter.validate = false;
counter.allow_script_urls = true;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse(
'<a href="javascript:alert(1)">1</a>' +
'<a href=" 2 ">2</a>'
);
equal(writer.getContent(), '<a href="javascript:alert(1)">1</a><a href=" 2 ">2</a>');
});
test('Parse script urls (denied)', function() {
var counter = createCounter(writer);
counter.validate = false;
var parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse(
'<a href="jAvaScript:alert(1)">1</a>' +
'<a href="vbscript:alert(2)">2</a>' +
'<a href="java\u0000script:alert(3)">3</a>' +
'<a href="\njavascript:alert(4)">4</a>' +
'<a href="java\nscript:alert(5)">5</a>' +
'<a href="java\tscript:alert(6)">6</a>' +
'<a href="%6aavascript:alert(7)">7</a>' +
'<a href="%E3%82%AA%E3%83%BC%E3%83">Invalid url</a>'
);
equal(writer.getContent(), '<a>1</a><a>2</a><a>3</a><a>4</a><a>5</a><a>6</a><a>7</a><a href="%E3%82%AA%E3%83%BC%E3%83">Invalid url</a>');
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.SaxParser tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

637
tests/qunit/editor/tinymce/html/SaxParser.js Normal file
View File

@@ -0,0 +1,637 @@
(function() {
module("tinymce.html.SaxParser");
var writer = new tinymce.html.Writer(), schema = new tinymce.html.Schema();
function createCounter(writer) {
var counts = {};
return {
counts : counts,
comment: function(text) {
if ("comment" in counts) {
counts.comment++;
} else {
counts.comment = 1;
}
writer.comment(text);
},
cdata: function(text) {
if ("cdata" in counts) {
counts.cdata++;
} else {
counts.cdata = 1;
}
writer.cdata(text);
},
text: function(text, raw) {
if ("text" in counts) {
counts.text++;
} else {
counts.text = 1;
}
writer.text(text, raw);
},
start: function(name, attrs, empty) {
if ("start" in counts) {
counts.start++;
} else {
counts.start = 1;
}
writer.start(name, attrs, empty);
},
end: function(name) {
if ("end" in counts) {
counts.end++;
} else {
counts.end = 1;
}
writer.end(name);
},
pi: function(name, text) {
if ("pi" in counts) {
counts.pi++;
} else {
counts.pi = 1;
}
writer.pi(name, text);
},
doctype: function(text) {
if ("doctype:" in counts) {
counts.doctype++;
} else {
counts.doctype = 1;
}
writer.doctype(text);
}
};
}
test('Parse elements', function() {
var counter, parser;
expect(46);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id=id1 title="title value" class=\'class1 class2\' data-value="value1" MYATTR="val1" myns:myattr="val2" disabled empty=""></span>');
equal(writer.getContent(), '<span id="id1" title="title value" class="class1 class2" data-value="value1" myattr="val1" myns:myattr="val2" disabled="disabled" empty=""></span>', 'Parse attribute formats.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse attribute formats counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b href=\'"&amp;<>\'></b>');
equal(writer.getContent(), '<b href="&quot;&amp;&lt;&gt;"></b>', 'Parse attributes with <> in them.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse attributes with <> in them (count).');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title=" "class=" "></span>');
equal(writer.getContent(), '<span title=" " class=" "></span>', 'Parse compressed attributes.');
deepEqual(counter.counts, {start:1, end:1}, 'Parse compressed attributes (count).');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title></span>');
equal(writer.getContent(), '<span title=""></span>', 'Single empty attribute.');
deepEqual(counter.counts, {start:1, end:1}, 'Single empty attributes (count).');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span class="class" title></span>');
equal(writer.getContent(), '<span class="class" title=""></span>', 'Empty attribute at end.');
deepEqual(counter.counts, {start:1, end:1}, 'Empty attribute at end (count).');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span title class="class"></span>');
equal(writer.getContent(), '<span title="" class="class"></span>', 'Empty attribute at start.');
deepEqual(counter.counts, {start:1, end:1}, 'Empty attribute at start (count).');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img src="test">');
equal(writer.getContent(), '<img src="test" />', 'Parse empty element.');
deepEqual(counter.counts, {start:1}, 'Parse empty element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img\nsrc="test"\ntitle="row1\nrow2">');
equal(writer.getContent(), '<img src="test" title="row1\nrow2" />', 'Parse attributes with linebreak.');
deepEqual(counter.counts, {start: 1}, 'Parse attributes with linebreak counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<img \t \t src="test" \t \t title="\t row1\t row2">');
equal(writer.getContent(), '<img src="test" title="\t row1\t row2" />', 'Parse attributes with whitespace.');
deepEqual(counter.counts, {start: 1}, 'Parse attributes with whitespace counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<myns:mytag>text</myns:mytag>');
equal(writer.getContent(), '<myns:mytag>text</myns:mytag>', 'Parse element with namespace.');
deepEqual(counter.counts, {start:1, text:1, end: 1}, 'Parse element with namespace counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<myns-mytag>text</myns-mytag>');
equal(writer.getContent(), '<myns-mytag>text</myns-mytag>', 'Parse element with dash name.');
deepEqual(counter.counts, {start:1, text:1, end:1}, 'Parse element with dash name counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<p>text2<b>text3</p>text4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>text4text5', 'Parse tag soup 1.');
deepEqual(counter.counts, {text:5, start: 2, end: 2}, 'Parse tag soup 1 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<P>text2<B>text3</p>text4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>text4text5', 'Parse tag soup 2.');
deepEqual(counter.counts, {text: 5, start: 2, end: 2}, 'Parse tag soup 2 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<P>text2<B>tex<t3</p>te>xt4</b>text5');
equal(writer.getContent(), 'text1<p>text2<b>tex&lt;t3</b></p>te&gt;xt4text5', 'Parse tag soup 3.');
deepEqual(counter.counts, {text: 5, start: 2, end: 2}, 'Parse tag soup 3 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<p>text2<b>text3');
equal(writer.getContent(), 'text1<p>text2<b>text3</b></p>', 'Parse tag soup 4.');
deepEqual(counter.counts, {text: 3, start: 2, end: 2}, 'Parse tag soup 4 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<script>text2');
equal(writer.getContent(), 'text1<script>text2</s' + 'cript>', 'Parse tag soup 5.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse tag soup 5 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<style>text2');
equal(writer.getContent(), 'text1<style>text2</st' + 'yle>', 'Parse tag soup 6.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse tag soup 6 counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<span title="<test" data-test="test>"></span>');
equal(writer.getContent(), 'text1<span title="&lt;test" data-test="test&gt;"></span>', 'Parse element with </> in attributes.');
deepEqual(counter.counts, {text: 1, start: 1, end: 1}, 'Parse element with </> in attributes counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse("text\n<SC"+"RIPT type=mce-text/javascript>// <![CDATA[\nalert('HELLO WORLD!');\n// ]]></SC"+"RIPT>");
equal(writer.getContent(), "text\n<sc"+"ript type=\"mce-text/javascript\">// <![CDATA[\nalert('HELLO WORLD!');\n// ]]></sc"+"ript>", 'Parse cdata script.');
deepEqual(counter.counts, {text: 2, start: 1, end: 1}, 'Parse cdata script counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<noscript>te<br>xt2</noscript>text3');
equal(writer.getContent(), 'text1<noscript>te<br>xt2</noscript>text3', 'Parse noscript elements.');
deepEqual(counter.counts, {text: 3, start: 1, end: 1}, 'Parse noscript elements counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p>a</p><p /><p>b</p>');
equal(writer.getContent(), '<p>a</p><p></p><p>b</p>', 'Parse invalid closed element.');
deepEqual(counter.counts, {text: 2, start: 3, end: 3}, 'Parse invalid closed element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<br><br /><br/>');
equal(writer.getContent(), '<br /><br /><br />', 'Parse short ended elements.');
deepEqual(counter.counts, {start: 3}, 'Parse short ended elements counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p ></p>');
equal(writer.getContent(), '<p></p>', 'Parse start elements with whitespace only attribs part.');
deepEqual(counter.counts, {start: 1, end: 1}, 'Parse start elements with whitespace only attribs part (counts).');
});
test('Parse style elements', function() {
var counter, parser;
expect(8);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style>// <b>tag</b></st' + 'yle>text2</em>');
equal(writer.getContent(), 'text1<em><style>// <b>tag</b></st' + 'yle>text2</em>', 'Parse style element.');
deepEqual(counter.counts, {start: 2, end: 2, text: 3}, 'Parse style element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style id="id">// <b>tag</b></st' + 'yle>text2</em>');
equal(writer.getContent(), 'text1<em><style id="id">// <b>tag</b></st' + 'yle>text2</em>', 'Parse style element with attributes.');
deepEqual(counter.counts, {text:3, start:2, end:2}, 'Parse style element with attributes counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><style></st' + 'yle>text2</span>');
equal(writer.getContent(), 'text1<em><style></st' + 'yle>text2</em>', 'Parse empty style element.');
deepEqual(counter.counts, {text:2, start:2, end:2}, 'Parse empty style element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(tinymce.extend({validate : true}, counter), new tinymce.html.Schema({invalid_elements: 'style'}));
writer.reset();
parser.parse('text1<em><style>text2</st' + 'yle>text3</em>');
equal(writer.getContent(), 'text1<em>text3</em>', 'Parse invalid style element.');
deepEqual(counter.counts, {text:2, start:1, end:1}, 'Parse invalid style element (count).');
});
test('Parse script elements', function() {
var counter, parser;
expect(8);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script>// <b>tag</b></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script>// <b>tag</b></s' + 'cript>text2</em>', 'Parse script element.');
deepEqual(counter.counts, {start:2, end:2, text:3}, 'Parse script element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script id="id">// <b>tag</b></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script id="id">// <b>tag</b></s' + 'cript>text2</em>', 'Parse script element with attributes.');
deepEqual(counter.counts, {start:2, end:2, text:3}, 'Parse script element with attributes counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<em><script></s' + 'cript>text2</em>');
equal(writer.getContent(), 'text1<em><script></s' + 'cript>text2</em>', 'Parse empty script element.');
deepEqual(counter.counts, {text: 2, start:2, end: 2}, 'Parse empty script element counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(tinymce.extend({validate : true}, counter), new tinymce.html.Schema({invalid_elements: 'script'}));
writer.reset();
parser.parse('text1<em><s' + 'cript>text2</s' + 'cript>text3</em>');
equal(writer.getContent(), 'text1<em>text3</em>', 'Parse invalid script element.');
deepEqual(counter.counts, {text:2, start:1, end:1}, 'Parse invalid script element (count).');
});
test('Parse text', function() {
var counter, parser;
expect(10);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('');
equal(writer.getContent(), '', 'Parse empty.');
deepEqual(counter.counts, {}, 'Parse empty counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text');
equal(writer.getContent(), 'text', 'Parse single text node.');
deepEqual(counter.counts, {text: 1}, 'Parse single text node counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>text</b>');
equal(writer.getContent(), '<b>text</b>', 'Parse wrapped text.');
deepEqual(counter.counts, {start:1, text:1, end:1}, 'Parse wrapped text counts');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('text1<b>text2</b>');
equal(writer.getContent(), 'text1<b>text2</b>', 'Parse text at start.');
deepEqual(counter.counts, {start:1, text:2, end:1}, 'Parse text at start counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>text1</b>text2');
equal(writer.getContent(), '<b>text1</b>text2', 'Parse text at end.');
deepEqual(counter.counts, {start:1, end:1, text:2}, 'Parse text at end counts.');
});
test('Parsing comments', function() {
var counter, parser;
expect(8);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!-- comment value -->');
equal(writer.getContent(), '<!-- comment value -->', 'Parse comment with value.');
deepEqual(counter.counts, {comment:1}, 'Parse comment with value count.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!---->');
equal(writer.getContent(), '', 'Parse comment without value.');
deepEqual(counter.counts, {}, 'Parse comment without value count.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--<b></b>-->');
equal(writer.getContent(), '<!--<b></b>-->', 'Parse comment with tag inside.');
deepEqual(counter.counts, {comment:1}, 'Parse comment with tag inside counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>a<!-- value -->b</b>');
equal(writer.getContent(), '<b>a<!-- value -->b</b>', 'Parse comment with tags around it.');
deepEqual(counter.counts, {comment:1, text:2, start:1, end:1}, 'Parse comment with tags around it counts.');
});
test('Parsing cdata', function() {
var counter, parser;
expect(8);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[test text]]>');
equal(writer.getContent(), '<![CDATA[test text]]>', 'Parse cdata with value.');
deepEqual(counter.counts, {cdata:1}, 'Parse cdata with value counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[]]>');
equal(writer.getContent(), '', 'Parse cdata without value.');
deepEqual(counter.counts, {}, 'Parse cdata without value counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<![CDATA[<b>a</b>]]>');
equal(writer.getContent(), '<![CDATA[<b>a</b>]]>', 'Parse cdata with tag inside.');
deepEqual(counter.counts, {cdata:1}, 'Parse cdata with tag inside counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<b>a<![CDATA[value]]>b</b>');
equal(writer.getContent(), '<b>a<![CDATA[value]]>b</b>', 'Parse cdata with tags around it.');
deepEqual(counter.counts, {cdata:1, start:1, end:1, text:2}, 'Parse cdata with tags around it counts.');
});
test('Parse PI', function() {
var counter, parser;
expect(6);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml version="1.0" encoding="UTF-8" ?>text1');
equal(writer.getContent(), '<?xml version="1.0" encoding="UTF-8" ?>text1', 'Parse PI with attributes.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with attributes counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml?>text1');
equal(writer.getContent(), '<?xml?>text1', 'Parse PI with no data.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with data counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<?xml somevalue/>text1');
equal(writer.getContent(), '<?xml somevalue?>text1', 'Parse PI with IE style ending.');
deepEqual(counter.counts, {pi:1, text:1}, 'Parse PI with IE style ending counts.');
});
test('Parse doctype', function() {
var counter, parser;
expect(4);
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">text1');
equal(writer.getContent(), '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">text1', 'Parse DOCTYPE.');
deepEqual(counter.counts, {doctype:1, text:1}, 'Parse HTML5 DOCTYPE counts.');
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!DOCTYPE html>text1');
equal(writer.getContent(), '<!DOCTYPE html>text1', 'Parse HTML5 DOCTYPE.');
deepEqual(counter.counts, {doctype:1, text:1}, 'Parse HTML5 DOCTYPE counts.');
});
test('Parse (validate)', function() {
var counter, parser;
expect(2);
counter = createCounter(writer);
counter.validate = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<invalid1>123<invalid2 />456<span title="title" invalid3="value">789</span>012</invalid1>');
equal(writer.getContent(), '123456<span title="title">789</span>012', 'Parse invalid elements and attributes.');
deepEqual(counter.counts, {start:1, end:1, text:4}, 'Parse invalid elements and attributes counts.');
});
test('Self closing', function() {
var counter, parser;
expect(1);
counter = createCounter(writer);
counter.validate = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<ul><li>1<li><b>2</b><li><em><b>3</b></em></ul>');
equal(writer.getContent(), '<ul><li>1</li><li><b>2</b></li><li><em><b>3</b></em></li></ul>', 'Parse list with self closing items.');
});
test('Preserve internal elements', function() {
var counter, parser, schema;
expect(2);
schema = new tinymce.html.Schema({valid_elements : 'b'});
counter = createCounter(writer);
counter.validate = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<b>text</b><span id="id" data-mce-type="something"></span>', 'Preserve internal span element without any span schema rule.');
schema = new tinymce.html.Schema({valid_elements : 'b,span[class]'});
counter = createCounter(writer);
counter.validate = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id" class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<span class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>', 'Preserve internal span element with a span schema rule.');
});
test('Remove internal elements', function() {
var counter, parser, schema;
expect(2);
schema = new tinymce.html.Schema({valid_elements : 'b'});
counter = createCounter(writer);
counter.validate = true;
counter.remove_internals = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<b>text</b>', 'Remove internal span element without any span schema rule.');
schema = new tinymce.html.Schema({valid_elements : 'b,span[class]'});
counter = createCounter(writer);
counter.validate = true;
counter.remove_internals = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<span id="id" class="class"><b>text</b></span><span id="id" data-mce-type="something"></span>');
equal(writer.getContent(), '<span class="class"><b>text</b></span>', 'Remove internal span element with a span schema rule.');
// Reset
counter.remove_internals = false;
});
test('Parse attr with backslash #5436', function() {
var counter, parser;
counter = createCounter(writer);
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<a title="\\" href="h">x</a>');
equal(writer.getContent(), '<a title="\\" href="h">x</a>');
});
test('Parse no attributes span before strong', function() {
var counter, parser;
counter = createCounter(writer);
counter.validate = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<p><span>A</span> <strong>B</strong></p>');
equal(writer.getContent(), '<p>A <strong>B</strong></p>');
});
test('Conditional comments (allowed)', function() {
var counter, parser;
counter = createCounter(writer);
counter.validate = false;
counter.allow_conditional_comments = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--[if gte IE 4]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!--[if gte IE 4]>alert(1)<![endif]-->');
});
test('Conditional comments (denied)', function() {
var counter, parser;
counter = createCounter(writer);
counter.validate = false;
counter.allow_conditional_comments = false;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse('<!--[if gte IE 4]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!-- [if gte IE 4]>alert(1)<![endif]-->');
writer.reset();
parser.parse('<!--[if !IE]>alert(1)<![endif]-->');
equal(writer.getContent(), '<!-- [if !IE]>alert(1)<![endif]-->');
});
test('Parse script urls (allowed)', function() {
var counter, parser;
counter = createCounter(writer);
counter.validate = false;
counter.allow_script_urls = true;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse(
'<a href="javascript:alert(1)">1</a>' +
'<a href=" 2 ">2</a>'
);
equal(writer.getContent(), '<a href="javascript:alert(1)">1</a><a href=" 2 ">2</a>');
});
test('Parse script urls (denied)', function() {
var counter, parser;
counter = createCounter(writer);
counter.validate = false;
parser = new tinymce.html.SaxParser(counter, schema);
writer.reset();
parser.parse(
'<a href="jAvaScript:alert(1)">1</a>' +
'<a href="vbscript:alert(2)">2</a>' +
'<a href="java\u0000script:alert(3)">3</a>' +
'<a href="\njavascript:alert(4)">4</a>' +
'<a href="java\nscript:alert(5)">5</a>' +
'<a href="java\tscript:alert(6)">6</a>' +
'<a href="%6aavascript:alert(7)">7</a>' +
'<a href="%E3%82%AA%E3%83%BC%E3%83">Invalid url</a>'
);
equal(writer.getContent(), '<a>1</a><a>2</a><a>3</a><a>4</a><a>5</a><a>6</a><a>7</a><a href="%E3%82%AA%E3%83%BC%E3%83">Invalid url</a>');
});
})();

203
tests/qunit/editor/tinymce/html/Schema.html → tests/qunit/editor/tinymce/html/Schema.js
View File

@@ -1,18 +1,5 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Schema tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Schema");
QUnit.config.reorder = false;
test('Valid elements global rule', function() {
expect(1);
@@ -21,27 +8,29 @@ test('Valid elements global rule', function() {
});
test('Whildcard element rule', function() {
var schema;
expect(17);
var schema = new tinymce.html.Schema({valid_elements: '*[id|class]'});
schema = new tinymce.html.Schema({valid_elements: '*[id|class]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
var schema = new tinymce.html.Schema({valid_elements: 'b*[id|class]'});
schema = new tinymce.html.Schema({valid_elements: 'b*[id|class]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
deepEqual(schema.getElementRule('body').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('body').attributesOrder, ["id", "class"]);
equal(schema.getElementRule('img'), undefined);
var schema = new tinymce.html.Schema({valid_elements: 'b?[id|class]'});
schema = new tinymce.html.Schema({valid_elements: 'b?[id|class]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
deepEqual(schema.getElementRule('bx').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('bx').attributesOrder, ["id", "class"]);
equal(schema.getElementRule('body'), undefined);
var schema = new tinymce.html.Schema({valid_elements: 'b+[id|class]'});
schema = new tinymce.html.Schema({valid_elements: 'b+[id|class]'});
deepEqual(schema.getElementRule('body').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('body').attributesOrder, ["id", "class"]);
deepEqual(schema.getElementRule('bx').attributes, {"id": {}, "class": {} });
@@ -50,21 +39,23 @@ test('Whildcard element rule', function() {
});
test('Whildcard attribute rule', function() {
var schema;
expect(13);
var schema = new tinymce.html.Schema({valid_elements: 'b[id|class|*]'});
schema = new tinymce.html.Schema({valid_elements: 'b[id|class|*]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
ok(schema.getElementRule('b').attributePatterns[0].pattern.test('x'));
var schema = new tinymce.html.Schema({valid_elements: 'b[id|class|x?]'});
schema = new tinymce.html.Schema({valid_elements: 'b[id|class|x?]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
ok(schema.getElementRule('b').attributePatterns[0].pattern.test('xy'));
ok(!schema.getElementRule('b').attributePatterns[0].pattern.test('xba'));
ok(!schema.getElementRule('b').attributePatterns[0].pattern.test('a'));
var schema = new tinymce.html.Schema({valid_elements: 'b[id|class|x+]'});
schema = new tinymce.html.Schema({valid_elements: 'b[id|class|x+]'});
deepEqual(schema.getElementRule('b').attributes, {"id": {}, "class": {} });
deepEqual(schema.getElementRule('b').attributesOrder, ["id", "class"]);
ok(!schema.getElementRule('b').attributePatterns[0].pattern.test('x'));
@@ -73,84 +64,104 @@ test('Whildcard attribute rule', function() {
});
test('Valid attributes and attribute order', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({valid_elements: 'div,a[href|title],b[title]'});
schema = new tinymce.html.Schema({valid_elements: 'div,a[href|title],b[title]'});
deepEqual(schema.getElementRule('div'), {"attributes": {}, "attributesOrder": []});
deepEqual(schema.getElementRule('a'), {"attributes": {"href": {}, "title": {}}, "attributesOrder": ["href", "title"]});
deepEqual(schema.getElementRule('b'), {"attributes": {"title": {}}, "attributesOrder": ["title"]});
});
test('Required any attributes', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: 'a![id|style|href]'});
schema = new tinymce.html.Schema({valid_elements: 'a![id|style|href]'});
deepEqual(schema.getElementRule('a'), {"attributes": {"href": {}, "id": {}, "style": {}}, "attributesOrder": ["id", "style", "href"], "removeEmptyAttrs": true});
});
test('Required attributes', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: 'a[!href|!name]'});
schema = new tinymce.html.Schema({valid_elements: 'a[!href|!name]'});
deepEqual(schema.getElementRule('a'), {"attributes": {"href": {"required": true}, "name": {"required": true}}, "attributesOrder": ["href", "name"], "attributesRequired": ["href", "name"]});
});
test('Default attribute values', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: 'img[border=0]'});
schema = new tinymce.html.Schema({valid_elements: 'img[border=0]'});
deepEqual(schema.getElementRule('img'), {"attributes": {"border": {"defaultValue": "0"}}, "attributesOrder": ["border"], "attributesDefault": [{"name": "border", "value": "0"}]});
});
test('Forced attribute values', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: 'img[border:0]'});
schema = new tinymce.html.Schema({valid_elements: 'img[border:0]'});
deepEqual(schema.getElementRule('img'), {"attributes": {"border": {"forcedValue": "0"}}, "attributesOrder": ["border"], "attributesForced": [{"name": "border", "value": "0"}]});
});
test('Required attribute values', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: 'span[dir<ltr?rtl]'});
schema = new tinymce.html.Schema({valid_elements: 'span[dir<ltr?rtl]'});
deepEqual(schema.getElementRule('span'), {"attributes": {"dir": {"validValues": {"rtl": {}, "ltr": {}}}}, "attributesOrder": ["dir"]});
});
test('Remove empty elements', function() {
var schema;
expect(2);
var schema = new tinymce.html.Schema({valid_elements: '-span'});
schema = new tinymce.html.Schema({valid_elements: '-span'});
deepEqual(schema.getElementRule('span'), {"attributes": {}, "attributesOrder": [], "removeEmpty": true});
var schema = new tinymce.html.Schema({valid_elements: '#span'});
schema = new tinymce.html.Schema({valid_elements: '#span'});
deepEqual(schema.getElementRule('span'), {"attributes": {}, "attributesOrder": [], "paddEmpty": true});
});
test('addValidElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema({valid_elements: '@[id|style],img[src|-style]'});
schema = new tinymce.html.Schema({valid_elements: '@[id|style],img[src|-style]'});
schema.addValidElements('b[class]');
deepEqual(schema.getElementRule('b'), {"attributes": {"id": {}, "style": {}, "class": {}}, "attributesOrder": ["id", "style", "class"]});
});
test('setValidElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({valid_elements: '@[id|style],img[src|-style]'});
schema = new tinymce.html.Schema({valid_elements: '@[id|style],img[src|-style]'});
schema.setValidElements('b[class]');
equal(schema.getElementRule('img'), undefined);
deepEqual(schema.getElementRule('b'), {"attributes": {"class": {}}, "attributesOrder": ["class"]});
var schema = new tinymce.html.Schema({valid_elements: 'img[src]'});
schema = new tinymce.html.Schema({valid_elements: 'img[src]'});
schema.setValidElements('@[id|style],img[src]');
deepEqual(schema.getElementRule('img'), {"attributes": {"id": {}, "style": {}, "src": {}}, "attributesOrder": ["id", "style", "src"]});
});
test('getBoolAttrs', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getBoolAttrs(), {
"CONTROLS": {}, "LOOP": {}, "AUTOPLAY": {}, "SELECTED": {}, "READONLY": {}, "NOWRAP": {},
"NOSHADE": {}, "NORESIZE": {}, "NOHREF": {}, "MULTIPLE": {}, "ISMAP": {}, "DISABLED": {}, "DEFER": {},
@@ -162,9 +173,11 @@ test('getBoolAttrs', function() {
});
test('getBlockElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getBlockElements(), {
ASIDE: {}, HGROUP: {}, SECTION: {}, ARTICLE: {}, FOOTER: {}, HEADER: {},
ISINDEX: {}, MENU: {}, NOSCRIPT: {}, FIELDSET: {}, DIR: {}, DD: {}, DT: {},
@@ -182,9 +195,11 @@ test('getBlockElements', function() {
});
test('getShortEndedElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getShortEndedElements(), {
"EMBED": {}, "PARAM": {}, "META": {}, "LINK": {}, "ISINDEX": {},
"INPUT": {}, "IMG": {}, "HR": {}, "FRAME": {}, "COL": {}, "BR": {},
@@ -196,9 +211,11 @@ test('getShortEndedElements', function() {
});
test('getNonEmptyElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getNonEmptyElements(), {
"EMBED": {}, "PARAM": {}, "META": {}, "LINK": {}, "ISINDEX": {},
"INPUT": {}, "IMG": {}, "HR": {}, "FRAME": {}, "COL": {}, "BR": {},
@@ -212,9 +229,11 @@ test('getNonEmptyElements', function() {
});
test('getWhiteSpaceElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getWhiteSpaceElements(), {
"IFRAME": {}, "NOSCRIPT": {}, "OBJECT": {}, "PRE": {},
"SCRIPT": {}, "STYLE": {}, "TEXTAREA": {}, "VIDEO": {}, "AUDIO": {},
@@ -224,9 +243,11 @@ test('getWhiteSpaceElements', function() {
});
test('getTextBlockElements', function() {
var schema;
expect(1);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
deepEqual(schema.getTextBlockElements(), {
"ADDRESS": {}, "ARTICLE": {}, "ASIDE": {}, "BLOCKQUOTE": {}, "CENTER": {}, "DIR": {}, "DIV": {}, "FIELDSET": {}, "FIGURE": {}, "FOOTER": {}, "FORM": {},
"H1": {}, "H2": {}, "H3": {}, "H4": {}, "H5": {}, "H6": {}, "HEADER": {}, "HGROUP": {}, "NAV": {}, "P": {}, "PRE": {}, "SECTION": {},
@@ -236,9 +257,11 @@ test('getTextBlockElements', function() {
});
test('isValidChild', function() {
var schema;
expect(4);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
ok(schema.isValidChild('body', 'p'));
ok(schema.isValidChild('p', 'img'));
ok(!schema.isValidChild('body', 'body'));
@@ -246,18 +269,22 @@ test('isValidChild', function() {
});
test('getElementRule', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
ok(schema.getElementRule('b'));
ok(!schema.getElementRule('bx'));
ok(!schema.getElementRule(null));
});
test('addCustomElements', function() {
var schema;
expect(5);
var schema = new tinymce.html.Schema({valid_elements:'inline,block'});
schema = new tinymce.html.Schema({valid_elements:'inline,block'});
schema.addCustomElements('~inline,block');
ok(schema.getElementRule('inline'));
ok(schema.getElementRule('block'));
@@ -267,9 +294,11 @@ test('addCustomElements', function() {
});
test('addValidChildren', function() {
var schema;
expect(7);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
ok(schema.isValidChild('body', 'p'));
ok(!schema.isValidChild('body', 'body'));
ok(!schema.isValidChild('body', 'html'));
@@ -277,81 +306,97 @@ test('addValidChildren', function() {
ok(schema.isValidChild('body', 'body'));
ok(schema.isValidChild('body', 'html'));
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
ok(schema.isValidChild('body', 'p'));
schema.addValidChildren('-body[p]');
ok(!schema.isValidChild('body', 'p'));
});
test('addCustomElements/getCustomElements', function() {
var schema;
expect(4);
var schema = new tinymce.html.Schema();
schema = new tinymce.html.Schema();
schema.addCustomElements('~inline,block');
ok(schema.getBlockElements()['block']);
ok(!schema.getBlockElements()['inline']);
ok(schema.getCustomElements()['inline']);
ok(schema.getCustomElements()['block']);
ok(schema.getBlockElements().block);
ok(!schema.getBlockElements().inline);
ok(schema.getCustomElements().inline);
ok(schema.getCustomElements().block);
});
test('whitespaceElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({whitespace_elements : 'pre,p'});
ok(schema.getWhiteSpaceElements()['pre']);
ok(!schema.getWhiteSpaceElements()['span']);
schema = new tinymce.html.Schema({whitespace_elements : 'pre,p'});
ok(schema.getWhiteSpaceElements().pre);
ok(!schema.getWhiteSpaceElements().span);
var schema = new tinymce.html.Schema({whitespace_elements : 'code'});
ok(schema.getWhiteSpaceElements()['code']);
schema = new tinymce.html.Schema({whitespace_elements : 'code'});
ok(schema.getWhiteSpaceElements().code);
});
test('selfClosingElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({self_closing_elements : 'pre,p'});
ok(schema.getSelfClosingElements()['pre']);
ok(schema.getSelfClosingElements()['p']);
ok(!schema.getSelfClosingElements()['li']);
schema = new tinymce.html.Schema({self_closing_elements : 'pre,p'});
ok(schema.getSelfClosingElements().pre);
ok(schema.getSelfClosingElements().p);
ok(!schema.getSelfClosingElements().li);
});
test('shortEndedElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({short_ended_elements : 'pre,p'});
ok(schema.getShortEndedElements()['pre']);
ok(schema.getShortEndedElements()['p']);
ok(!schema.getShortEndedElements()['img']);
schema = new tinymce.html.Schema({short_ended_elements : 'pre,p'});
ok(schema.getShortEndedElements().pre);
ok(schema.getShortEndedElements().p);
ok(!schema.getShortEndedElements().img);
});
test('booleanAttributes', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({boolean_attributes : 'href,alt'});
ok(schema.getBoolAttrs()['href']);
ok(schema.getBoolAttrs()['alt']);
ok(!schema.getBoolAttrs()['checked']);
schema = new tinymce.html.Schema({boolean_attributes : 'href,alt'});
ok(schema.getBoolAttrs().href);
ok(schema.getBoolAttrs().alt);
ok(!schema.getBoolAttrs().checked);
});
test('nonEmptyElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({non_empty_elements : 'pre,p'});
ok(schema.getNonEmptyElements()['pre']);
ok(schema.getNonEmptyElements()['p']);
ok(!schema.getNonEmptyElements()['img']);
schema = new tinymce.html.Schema({non_empty_elements : 'pre,p'});
ok(schema.getNonEmptyElements().pre);
ok(schema.getNonEmptyElements().p);
ok(!schema.getNonEmptyElements().img);
});
test('blockElements', function() {
var schema;
expect(3);
var schema = new tinymce.html.Schema({block_elements : 'pre,p'});
ok(schema.getBlockElements()['pre']);
ok(schema.getBlockElements()['p']);
ok(!schema.getBlockElements()['h1']);
schema = new tinymce.html.Schema({block_elements : 'pre,p'});
ok(schema.getBlockElements().pre);
ok(schema.getBlockElements().p);
ok(!schema.getBlockElements().h1);
});
test('isValid', function() {
var schema = new tinymce.html.Schema({valid_elements : 'a[href],i[*]'});
var schema;
schema = new tinymce.html.Schema({valid_elements : 'a[href],i[*]'});
ok(schema.isValid('a'));
ok(schema.isValid('a', 'href'));
@@ -361,14 +406,4 @@ test('isValid', function() {
ok(schema.isValid('i'));
ok(schema.isValid('i', 'id'));
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Schema tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

24
tests/qunit/editor/tinymce/html/Serializer.html → tests/qunit/editor/tinymce/html/Serializer.js
View File

@@ -1,18 +1,5 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Serializer tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Serializer");
QUnit.config.reorder = false;
test('Basic serialization', function() {
var serializer = new tinymce.html.Serializer();
@@ -33,14 +20,3 @@ test('Sorting of attributes', function() {
equal(serializer.serialize(new tinymce.html.DomParser().parse('<b class="class" id="id">x</b>')), '<strong id="id" class="class">x</strong>');
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Serializer tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

24
tests/qunit/editor/tinymce/html/Styles.html → tests/qunit/editor/tinymce/html/Styles.js
View File

@@ -1,18 +1,5 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Styles tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Styles");
QUnit.config.reorder = false;
test('Basic parsing/serializing', function() {
var styles = new tinymce.html.Styles();
@@ -163,14 +150,3 @@ test('Script urls allowed', function() {
equal(styles.serialize(styles.parse('background:url(javascript:alert(1)')), "background: url('javascript:alert(1');");
equal(styles.serialize(styles.parse('background:url(vbscript:alert(1)')), "background: url('vbscript:alert(1');");
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Styles tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

92
tests/qunit/editor/tinymce/html/Writer.html → tests/qunit/editor/tinymce/html/Writer.js
View File

@@ -1,126 +1,131 @@
<!DOCTYPE html>
<html>
<head>
<title>tinymce.html.Writer tests</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script>
module("tinymce.html.Writer");
QUnit.config.reorder = false;
test('Comment', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.comment('text');
equal(writer.getContent(), '<!--text-->');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.comment('');
equal(writer.getContent(), '<!---->');
});
test('CDATA', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.cdata('text');
equal(writer.getContent(), '<![CDATA[text]]>');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.cdata('');
equal(writer.getContent(), '<![CDATA[]]>');
});
test('PI', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.pi('xml', 'someval');
equal(writer.getContent(), '<?xml someval?>');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.pi('xml');
equal(writer.getContent(), '<?xml?>');
});
test('Doctype', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.doctype(' text');
equal(writer.getContent(), '<!DOCTYPE text>');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.doctype('');
equal(writer.getContent(), '<!DOCTYPE>');
});
test('Text', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.text('te<xt');
equal(writer.getContent(), 'te&lt;xt');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.text('');
equal(writer.getContent(), '');
});
test('Text raw', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.text('te<xt', true);
equal(writer.getContent(), 'te<xt');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.text('', true);
equal(writer.getContent(), '');
});
test('Start', function() {
var writer;
expect(5);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('b');
equal(writer.getContent(), '<b>');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('b', [{name: 'attr1', value: 'value1'}, {name: 'attr2', value: 'value2'}]);
equal(writer.getContent(), '<b attr1="value1" attr2="value2">');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('b', [{name: 'attr1', value: 'val<"ue1'}]);
equal(writer.getContent(), '<b attr1="val&lt;&quot;ue1">');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('img', [{name: 'attr1', value: 'value1'}, {name: 'attr2', value: 'value2'}], true);
equal(writer.getContent(), '<img attr1="value1" attr2="value2" />');
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('br', null, true);
equal(writer.getContent(), '<br />');
});
test('End', function() {
var writer;
expect(1);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.end('b');
equal(writer.getContent(), '</b>');
});
test('Indentation', function() {
var writer;
expect(2);
var writer = new tinymce.html.Writer({indent: true, indent_before: 'p', indent_after:'p'});
writer = new tinymce.html.Writer({indent: true, indent_before: 'p', indent_after:'p'});
writer.start('p');
writer.start('span');
writer.text('a');
@@ -131,7 +136,7 @@ test('Indentation', function() {
writer.end('p');
equal(writer.getContent(), '<p><span>a</span></p>\n<p>a</p>');
var writer = new tinymce.html.Writer({indent: true, indent_before: 'p', indent_after:'p'});
writer = new tinymce.html.Writer({indent: true, indent_before: 'p', indent_after:'p'});
writer.start('p');
writer.text('a');
writer.end('p');
@@ -139,36 +144,25 @@ test('Indentation', function() {
});
test('Entities', function() {
var writer;
expect(3);
var writer = new tinymce.html.Writer();
writer = new tinymce.html.Writer();
writer.start('p', [{name: "title", value: '<>"\'&\u00e5\u00e4\u00f6'}]);
writer.text('<>"\'&\u00e5\u00e4\u00f6');
writer.end('p');
equal(writer.getContent(), '<p title="&lt;&gt;&quot;\'&amp;\u00e5\u00e4\u00f6">&lt;&gt;"\'&amp;\u00e5\u00e4\u00f6</p>');
var writer = new tinymce.html.Writer({entity_encoding: 'numeric'});
writer = new tinymce.html.Writer({entity_encoding: 'numeric'});
writer.start('p', [{name: "title", value: '<>"\'&\u00e5\u00e4\u00f6'}]);
writer.text('<>"\'&\u00e5\u00e4\u00f6');
writer.end('p');
equal(writer.getContent(), '<p title="&lt;&gt;&quot;\'&amp;&#229;&#228;&#246;">&lt;&gt;"\'&amp;&#229;&#228;&#246;</p>');
var writer = new tinymce.html.Writer({entity_encoding: 'named'});
writer = new tinymce.html.Writer({entity_encoding: 'named'});
writer.start('p', [{name: "title", value: '<>"\'&\u00e5\u00e4\u00f6'}]);
writer.text('<>"\'&\u00e5\u00e4\u00f6');
writer.end('p');
equal(writer.getContent(), '<p title="&lt;&gt;&quot;\'&amp;&aring;&auml;&ouml;">&lt;&gt;"\'&amp;&aring;&auml;&ouml;</p>');
});
</script>
</head>
<body>
<h1 id="qunit-header">tinymce.html.Writer tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="content"></div>
</body>
</html>

14
tests/qunit/editor/tinymce/html/tests.js
View File

@@ -1,14 +0,0 @@
{
"title": "tinymce.html",
"tests": [
{"title": "DomParser", "url": "DomParser.html"},
{"title": "Entities", "url": "Entities.html"},
{"title": "Node", "url": "Node.html"},
{"title": "SaxParser", "url": "SaxParser.html"},
{"title": "Schema", "url": "Schema.html"},
{"title": "Serializer", "url": "Serializer.html"},
{"title": "Styles", "url": "Styles.html"},
{"title": "Writer", "url": "Writer.html"},
{"title": "Obsolete tags and attributes", "url": "obsolete.html"}
]
}

15
tests/qunit/editor/tinymce/tests.js
View File

@@ -1,15 +0,0 @@
{
"title": "tinymce",
"tests": [
{"title": "Editor", "url": "Editor.html"},
{"title": "EditorCommands", "url": "EditorCommands.html"},
{"title": "EnterKey", "url": "EnterKey.html"},
{"title": "ForceBlocks", "url": "ForceBlocks.html"},
{"title": "Formatter (Apply)", "url": "Formatter_apply.html"},
{"title": "Formatter (Remove)", "url": "Formatter_remove.html"},
{"title": "Formatter (Check)", "url": "Formatter_check.html"},
{"title": "Formatter (jsrobot)", "url": "Formatter_robot.html", "jsrobot":true},
{"title": "UndoManager", "url": "UndoManager.html"},
{"title": "Undo", "url": "UndoManager_robot.html", "jsrobot": true}
]
}

63
tests/qunit/editor/tinymce/ui/AbsoluteLayout.html
View File

@@ -1,63 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.AbsoluteLayout Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.AbsoluteLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function createPanel(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'panel',
layout: 'absolute',
width: 200,
height: 200
}, settings)).renderTo(document.getElementById('view')).reflow();
}
test("spacer x:10, y:20, minWidth: 100, minHeight: 100", function() {
panel = createPanel({
items: [
{type: 'spacer', x: 10, y: 20, w: 100, h: 120, classes: 'red'}
]
});
deepEqual(rect(panel), [0, 0, 200, 200]);
deepEqual(rect(panel.find('spacer')[0]), [10, 20, 100, 120]);
});
</script>
</head>
<body>
<h1 id="qunit-header">ui.AbsoluteLayout Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

31
tests/qunit/editor/tinymce/ui/AbsoluteLayout.js Normal file
View File

@@ -0,0 +1,31 @@
(function() {
module("tinymce.ui.AbsoluteLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function createPanel(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'panel',
layout: 'absolute',
width: 200,
height: 200
}, settings)).renderTo(document.getElementById('view')).reflow();
}
test("spacer x:10, y:20, minWidth: 100, minHeight: 100", function() {
var panel = createPanel({
items: [
{type: 'spacer', x: 10, y: 20, w: 100, h: 120, classes: 'red'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 200, 200]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [10, 20, 100, 120]);
});
})();

133
tests/qunit/editor/tinymce/ui/Button.html
View File

@@ -1,133 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Button Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.Button", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function createButton(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'button'
}, settings)).renderTo(document.getElementById('view'));
}
test("button text, size default", function() {
var button = createButton({text: 'X'});
nearlyEqualRects(rect(button), [0, 0, 34, 30], 4);
});
test("button text, size large", function() {
var button = createButton({text: 'X', size: 'large'});
nearlyEqualRects(rect(button), [0, 0, 41, 39], 4);
});
test("button text, size small", function() {
var button = createButton({text: 'X', size: 'small'});
nearlyEqualRects(rect(button), [0, 0, 19, 23], 4);
});
test("button text, width 100, height 100", function() {
var button = createButton({text: 'X', width: 100, height: 100});
deepEqual(rect(button), [0, 0, 100, 100]);
deepEqual(rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button icon, size default", function() {
var button = createButton({icon: 'test'});
nearlyEqualRects(rect(button), [0, 0, 40, 30], 4);
});
test("button icon, size small", function() {
var button = createButton({icon: 'test', size: 'small'});
nearlyEqualRects(rect(button), [0, 0, 28, 24], 4);
});
test("button icon, size large", function() {
var button = createButton({icon: 'test', size: 'large'});
nearlyEqualRects(rect(button), [0, 0, 44, 40], 4);
});
test("button icon, width 100, height 100", function() {
var button = createButton({icon: 'test', width: 100, height: 100});
deepEqual(rect(button), [0, 0, 100, 100]);
deepEqual(rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button text & icon, size default", function() {
var button = createButton({text: 'X', icon: 'test'});
nearlyEqualRects(rect(button), [0, 0, 52, 30], 4);
});
test("button text & icon, size large", function() {
var button = createButton({text: 'X', icon: 'test', size: 'large'});
nearlyEqualRects(rect(button), [0, 0, 59, 40], 4);
});
test("button text & icon, size small", function() {
var button = createButton({text: 'X', icon: 'test', size: 'small'});
nearlyEqualRects(rect(button), [0, 0, 38, 24], 4);
});
test("button text & icon, width 100, height 100", function() {
var button = createButton({text: 'X', icon: 'test', width: 100, height: 100});
deepEqual(rect(button), [0, 0, 100, 100]);
deepEqual(rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button click event", function() {
var button, clicks = {};
button = createButton({text: 'X', onclick: function() {clicks.a = 'a';}});
button.on('click', function() {clicks.b = 'b';});
button.on('click', function() {clicks.c = 'c';});
button.fire('click');
deepEqual(clicks, {a: 'a', b: 'b', c: 'c'});
});
</script>
</head>
<body>
<h1 id="qunit-header">Button Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

104
tests/qunit/editor/tinymce/ui/Button.js Normal file
View File

@@ -0,0 +1,104 @@
(function() {
module("tinymce.ui.Button", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function createButton(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'button'
}, settings)).renderTo(document.getElementById('view'));
}
test("button text, size default", function() {
var button = createButton({text: 'X'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 34, 30], 4);
});
test("button text, size large", function() {
var button = createButton({text: 'X', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 41, 39], 4);
});
test("button text, size small", function() {
var button = createButton({text: 'X', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 19, 23], 4);
});
test("button text, width 100, height 100", function() {
var button = createButton({text: 'X', width: 100, height: 100});
deepEqual(Utils.rect(button), [0, 0, 100, 100]);
deepEqual(Utils.rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button icon, size default", function() {
var button = createButton({icon: 'test'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 40, 30], 4);
});
test("button icon, size small", function() {
var button = createButton({icon: 'test', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 28, 24], 4);
});
test("button icon, size large", function() {
var button = createButton({icon: 'test', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 44, 40], 4);
});
test("button icon, width 100, height 100", function() {
var button = createButton({icon: 'test', width: 100, height: 100});
deepEqual(Utils.rect(button), [0, 0, 100, 100]);
deepEqual(Utils.rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button text & icon, size default", function() {
var button = createButton({text: 'X', icon: 'test'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 52, 30], 4);
});
test("button text & icon, size large", function() {
var button = createButton({text: 'X', icon: 'test', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 59, 40], 4);
});
test("button text & icon, size small", function() {
var button = createButton({text: 'X', icon: 'test', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(button), [0, 0, 38, 24], 4);
});
test("button text & icon, width 100, height 100", function() {
var button = createButton({text: 'X', icon: 'test', width: 100, height: 100});
deepEqual(Utils.rect(button), [0, 0, 100, 100]);
deepEqual(Utils.rect(button.getEl().firstChild), [1, 1, 98, 98]);
});
test("button click event", function() {
var button, clicks = {};
button = createButton({text: 'X', onclick: function() {clicks.a = 'a';}});
button.on('click', function() {clicks.b = 'b';});
button.on('click', function() {clicks.c = 'c';});
button.fire('click');
deepEqual(clicks, {a: 'a', b: 'b', c: 'c'});
});
})();

43
tests/qunit/editor/tinymce/ui/ButtonGroup.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.ButtonGroup Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.ButtonGroup", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.ButtonGroup Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/Checkbox.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.Checkbox Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.Checkbox", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.Checkbox Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

273
tests/qunit/editor/tinymce/ui/Collection.html
View File

@@ -1,273 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Collection Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
module("ui.Collection");
window.onload = function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
items: [
{type: 'button', name: 'button1', text: 'button1', classes: 'class1', disabled: true},
{type: 'button', name: 'button2', classes: 'class1 class2'},
{type: 'button', name: 'button3', classes: 'class2 class1 class3'},
{type: 'buttongroup', name: 'buttongroup1', items: [
{type: 'button', name: 'button4'},
{type: 'button', name: 'button5'},
{type: 'button', name: 'button6'}
]},
{type: 'buttongroup', name: 'buttongroup2', items: [
{type: 'button', name: 'button7'},
{type: 'button', name: 'button8'},
{type: 'button', name: 'button9'}
]},
{type: 'toolbar', name: 'toolbar1', items: [
{type: 'buttongroup', name: 'buttongroup3', items: [
{type: 'button', name: 'button10', disabled: true},
{type: 'button', name: 'button11'},
{type: 'button', name: 'button12', classes: 'class4'}
]}
]}
]
}).renderTo(document.getElementById('view'));
QUnit.start();
};
test("Constructor", function() {
equal(new tinymce.ui.Collection().length, 0);
equal(new tinymce.ui.Collection(panel.find('button').toArray()).length, 12);
equal(new tinymce.ui.Collection(panel.find('button')).length, 12);
equal(new tinymce.ui.Collection(panel.find('button:first')[0]).length, 1);
equal(new tinymce.ui.Collection(panel.find('button:first')[0])[0].type, 'button');
});
test("add", function() {
var collection = new tinymce.ui.Collection([panel, panel]);
equal(collection.add(panel).length, 3);
equal(collection.add([panel, panel]).length, 5);
});
test("set", function() {
var collection = new tinymce.ui.Collection([panel, panel]);
equal(collection.set(panel).length, 1);
equal(collection.set([panel, panel]).length, 2);
});
test("filter", function() {
equal(panel.find('button').filter('*:first').length, 4);
equal(panel.find('button').filter('buttongroup button').length, 9);
equal(panel.find('button').filter('*').length, 12);
equal(panel.find('button').filter('nomatch').length, 0);
equal(panel.find('button').filter(function(ctrl) {return ctrl.settings.name == "button7";}).length, 1);
});
test("slice", function() {
equal(panel.find('button').slice(1).length, 11);
equal(panel.find('button').slice(1)[0].name(), 'button2');
equal(panel.find('button').slice(0, 1).length, 1);
equal(panel.find('button').slice(0, 1)[0].name(), 'button1');
equal(panel.find('button').slice(-1).length, 1);
equal(panel.find('button').slice(-1)[0].name(), 'button12');
equal(panel.find('button').slice(-2).length, 2);
equal(panel.find('button').slice(-2)[0].name(), 'button11');
equal(panel.find('button').slice(-2, -1).length, 1);
equal(panel.find('button').slice(-2, -1)[0].name(), 'button11');
equal(panel.find('button').slice(1000).length, 0);
equal(panel.find('button').slice(-1000).length, 12);
});
test("eq", function() {
equal(panel.find('button').eq(1).length, 1);
equal(panel.find('button').eq(1)[0].name(), 'button2');
equal(panel.find('button').eq(-2).length, 1);
equal(panel.find('button').eq(-2)[0].name(), 'button11');
equal(panel.find('button').eq(1000).length, 0);
});
test("each", function() {
var count;
count = 0;
panel.find('button').each(function() {
count++;
});
equal(count, 12);
count = 0;
panel.find('nomatch').each(function() {
count++;
});
equal(count, 0);
count = 0;
panel.find('button').each(function(item, index) {
count += index;
});
equal(count, 66);
count = 0;
panel.find('button').each(function(item, index) {
if (item.type == 'button')
count++;
});
equal(count, 12);
count = 0;
panel.find('button').each(function(item, index) {
count++;
if (index == 3)
return false;
});
equal(count, 4);
});
test("toArray", function() {
equal(panel.find('button').toArray().length, 12);
equal(panel.find('button').toArray().concat, Array.prototype.concat);
});
test("fire/on/off", function() {
var value;
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button#button1').fire('test', {value: 42});
equal(value, 42);
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button').fire('test', {value: 42});
equal(value, 84);
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button#button1').off('test');
panel.find('button').fire('test', {value: 42});
equal(value, 42);
panel.find('button').off();
value = 0;
panel.find('button').fire('test', {value: 42});
equal(value, 0);
});
test("show/hide", function() {
panel.find('button#button1,button#button2').hide();
equal(panel.find('button:not(:visible)').length, 2);
panel.find('button#button1').show();
equal(panel.find('button:not(:visible)').length, 1);
panel.find('button#button2').show();
});
test("text", function() {
equal(panel.find('button#button1,button#button2').text(), 'button1');
equal(panel.find('button#button2').text('button2').text(), 'button2');
equal(panel.find('button#button2,button#button3').text('test').text(), 'test');
equal(panel.find('button#button3').text(), 'test');
});
test("disabled", function() {
ok(panel.find('button#button1').disabled());
ok(!panel.find('button#button2').disabled());
ok(panel.find('button#button2').disabled(true).disabled());
panel.find('button#button2').disabled(false);
});
test("visible", function() {
ok(panel.find('button#button2').visible());
ok(!panel.find('button#button2').visible(false).visible());
panel.find('button#button2').visible(true);
});
test("active", function() {
ok(!panel.find('button#button2').active());
ok(panel.find('button#button2').active(true).active());
panel.find('button#button2').active(false);
});
test("name", function() {
equal(panel.find('button#button1').name(), 'button1');
equal(panel.find('button#button2').name('buttonX').name(), 'buttonX');
panel.find('button#buttonX').name('button2');
});
test("addClass/removeClass/hasClass", function() {
panel.find('button#button1').addClass('test');
ok(panel.find('button#button1').hasClass('test'));
ok(!panel.find('button#button1').hasClass('nomatch'));
panel.find('button#button1').removeClass('test');
ok(!panel.find('button#button1').hasClass('test'));
});
test("prop", function() {
ok(panel.find('button#button1').prop('disabled'));
equal(panel.find('button#button1').prop('name'), 'button1');
equal(panel.find('button#button1').prop('name', 'buttonX').prop('name'), 'buttonX');
panel.find('button#buttonX').prop('name', 'button1');
equal(panel.find('button#button1').prop('missingProperty'), undefined);
});
test("exec", function() {
ok(!panel.find('button#button1').exec('disabled', false).disabled());
panel.find('button#button1').disabled(true);
});
</script>
</head>
<body>
<h1 id="qunit-header">ui.Collection Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

253
tests/qunit/editor/tinymce/ui/Collection.js Normal file
View File

@@ -0,0 +1,253 @@
(function() {
var panel;
module("tinymce.ui.Collection", {
setupModule: function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
items: [
{type: 'button', name: 'button1', text: 'button1', classes: 'class1', disabled: true},
{type: 'button', name: 'button2', classes: 'class1 class2'},
{type: 'button', name: 'button3', classes: 'class2 class1 class3'},
{type: 'buttongroup', name: 'buttongroup1', items: [
{type: 'button', name: 'button4'},
{type: 'button', name: 'button5'},
{type: 'button', name: 'button6'}
]},
{type: 'buttongroup', name: 'buttongroup2', items: [
{type: 'button', name: 'button7'},
{type: 'button', name: 'button8'},
{type: 'button', name: 'button9'}
]},
{type: 'toolbar', name: 'toolbar1', items: [
{type: 'buttongroup', name: 'buttongroup3', items: [
{type: 'button', name: 'button10', disabled: true},
{type: 'button', name: 'button11'},
{type: 'button', name: 'button12', classes: 'class4'}
]}
]}
]
}).renderTo(document.getElementById('view'));
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
test("Constructor", function() {
equal(new tinymce.ui.Collection().length, 0);
equal(new tinymce.ui.Collection(panel.find('button').toArray()).length, 12);
equal(new tinymce.ui.Collection(panel.find('button')).length, 12);
equal(new tinymce.ui.Collection(panel.find('button:first')[0]).length, 1);
equal(new tinymce.ui.Collection(panel.find('button:first')[0])[0].type, 'button');
});
test("add", function() {
var collection = new tinymce.ui.Collection([panel, panel]);
equal(collection.add(panel).length, 3);
equal(collection.add([panel, panel]).length, 5);
});
test("set", function() {
var collection = new tinymce.ui.Collection([panel, panel]);
equal(collection.set(panel).length, 1);
equal(collection.set([panel, panel]).length, 2);
});
test("filter", function() {
equal(panel.find('button').filter('*:first').length, 4);
equal(panel.find('button').filter('buttongroup button').length, 9);
equal(panel.find('button').filter('*').length, 12);
equal(panel.find('button').filter('nomatch').length, 0);
equal(panel.find('button').filter(function(ctrl) {return ctrl.settings.name == "button7";}).length, 1);
});
test("slice", function() {
equal(panel.find('button').slice(1).length, 11);
equal(panel.find('button').slice(1)[0].name(), 'button2');
equal(panel.find('button').slice(0, 1).length, 1);
equal(panel.find('button').slice(0, 1)[0].name(), 'button1');
equal(panel.find('button').slice(-1).length, 1);
equal(panel.find('button').slice(-1)[0].name(), 'button12');
equal(panel.find('button').slice(-2).length, 2);
equal(panel.find('button').slice(-2)[0].name(), 'button11');
equal(panel.find('button').slice(-2, -1).length, 1);
equal(panel.find('button').slice(-2, -1)[0].name(), 'button11');
equal(panel.find('button').slice(1000).length, 0);
equal(panel.find('button').slice(-1000).length, 12);
});
test("eq", function() {
equal(panel.find('button').eq(1).length, 1);
equal(panel.find('button').eq(1)[0].name(), 'button2');
equal(panel.find('button').eq(-2).length, 1);
equal(panel.find('button').eq(-2)[0].name(), 'button11');
equal(panel.find('button').eq(1000).length, 0);
});
test("each", function() {
var count;
count = 0;
panel.find('button').each(function() {
count++;
});
equal(count, 12);
count = 0;
panel.find('nomatch').each(function() {
count++;
});
equal(count, 0);
count = 0;
panel.find('button').each(function(item, index) {
count += index;
});
equal(count, 66);
count = 0;
panel.find('button').each(function(item) {
if (item.type == 'button') {
count++;
}
});
equal(count, 12);
count = 0;
panel.find('button').each(function(item, index) {
count++;
if (index == 3) {
return false;
}
});
equal(count, 4);
});
test("toArray", function() {
equal(panel.find('button').toArray().length, 12);
equal(panel.find('button').toArray().concat, Array.prototype.concat);
});
test("fire/on/off", function() {
var value;
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button#button1').fire('test', {value: 42});
equal(value, 42);
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button').fire('test', {value: 42});
equal(value, 84);
value = 0;
panel.find('button').off();
panel.find('button#button1,button#button2').on('test', function(args) {
value += args.value;
});
panel.find('button#button1').off('test');
panel.find('button').fire('test', {value: 42});
equal(value, 42);
panel.find('button').off();
value = 0;
panel.find('button').fire('test', {value: 42});
equal(value, 0);
});
test("show/hide", function() {
panel.find('button#button1,button#button2').hide();
equal(panel.find('button:not(:visible)').length, 2);
panel.find('button#button1').show();
equal(panel.find('button:not(:visible)').length, 1);
panel.find('button#button2').show();
});
test("text", function() {
equal(panel.find('button#button1,button#button2').text(), 'button1');
equal(panel.find('button#button2').text('button2').text(), 'button2');
equal(panel.find('button#button2,button#button3').text('test').text(), 'test');
equal(panel.find('button#button3').text(), 'test');
});
test("disabled", function() {
ok(panel.find('button#button1').disabled());
ok(!panel.find('button#button2').disabled());
ok(panel.find('button#button2').disabled(true).disabled());
panel.find('button#button2').disabled(false);
});
test("visible", function() {
ok(panel.find('button#button2').visible());
ok(!panel.find('button#button2').visible(false).visible());
panel.find('button#button2').visible(true);
});
test("active", function() {
ok(!panel.find('button#button2').active());
ok(panel.find('button#button2').active(true).active());
panel.find('button#button2').active(false);
});
test("name", function() {
equal(panel.find('button#button1').name(), 'button1');
equal(panel.find('button#button2').name('buttonX').name(), 'buttonX');
panel.find('button#buttonX').name('button2');
});
test("addClass/removeClass/hasClass", function() {
panel.find('button#button1').addClass('test');
ok(panel.find('button#button1').hasClass('test'));
ok(!panel.find('button#button1').hasClass('nomatch'));
panel.find('button#button1').removeClass('test');
ok(!panel.find('button#button1').hasClass('test'));
});
test("prop", function() {
ok(panel.find('button#button1').prop('disabled'));
equal(panel.find('button#button1').prop('name'), 'button1');
equal(panel.find('button#button1').prop('name', 'buttonX').prop('name'), 'buttonX');
panel.find('button#buttonX').prop('name', 'button1');
equal(panel.find('button#button1').prop('missingProperty'), undefined);
});
test("exec", function() {
ok(!panel.find('button#button1').exec('disabled', false).disabled());
panel.find('button#button1').disabled(true);
});
})();

132
tests/qunit/editor/tinymce/ui/ColorButton.html
View File

@@ -1,132 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Button Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.ColorButton", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function createColorButton(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'colorbutton'
}, settings)).renderTo(document.getElementById('view'));
}
test("colorbutton text, size default", function() {
var colorButton = createColorButton({text: 'X'});
nearlyEqualRects(rect(colorButton), [0, 0, 42, 30], 4);
});
test("colorbutton text, size large", function() {
var colorButton = createColorButton({text: 'X', size: 'large'});
nearlyEqualRects(rect(colorButton), [0, 0, 49, 39], 4);
});
test("colorbutton text, size small", function() {
var colorButton = createColorButton({text: 'X', size: 'small'});
nearlyEqualRects(rect(colorButton), [0, 0, 34, 23], 4);
});
test("colorbutton text, width 100, height 100", function() {
var colorButton = createColorButton({text: 'X', width: 100, height: 100});
deepEqual(rect(colorButton), [0, 0, 100, 100]);
deepEqual(rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton icon, size default", function() {
var colorButton = createColorButton({icon: 'test'});
nearlyEqualRects(rect(colorButton), [0, 0, 50, 30], 4);
});
test("colorbutton icon, size small", function() {
var colorButton = createColorButton({icon: 'test', size: 'small'});
nearlyEqualRects(rect(colorButton), [0, 0, 43, 24], 4);
});
test("colorbutton icon, size large", function() {
var colorButton = createColorButton({icon: 'test', size: 'large'});
nearlyEqualRects(rect(colorButton), [0, 0, 54, 40], 4);
});
test("colorbutton icon, width 100, height 100", function() {
var colorButton = createColorButton({icon: 'test', width: 100, height: 100});
deepEqual(rect(colorButton), [0, 0, 100, 100]);
deepEqual(rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton text & icon, size default", function() {
var colorButton = createColorButton({text: 'X', icon: 'test'});
nearlyEqualRects(rect(colorButton), [0, 0, 62, 30], 4);
});
test("colorbutton text & icon, size large", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', size: 'large'});
nearlyEqualRects(rect(colorButton), [0, 0, 69, 40], 4);
});
test("colorbutton text & icon, size small", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', size: 'small'});
nearlyEqualRects(rect(colorButton), [0, 0, 53, 24], 4);
});
test("colorbutton text & icon, width 100, height 100", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', width: 100, height: 100});
deepEqual(rect(colorButton), [0, 0, 100, 100]);
deepEqual(rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton click event", function() {
var colorButton, clicks = {};
colorButton = createColorButton({text: 'X', onclick: function() {clicks.a = 'a';}});
colorButton.renderTo(document.getElementById('view'));
colorButton.fire('click', {target: colorButton.getEl()});
deepEqual(clicks, {a: 'a'});
});
</script>
</head>
<body>
<h1 id="qunit-header">Button Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

102
tests/qunit/editor/tinymce/ui/ColorButton.js Normal file
View File

@@ -0,0 +1,102 @@
(function() {
module("tinymce.ui.ColorButton", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function createColorButton(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'colorbutton'
}, settings)).renderTo(document.getElementById('view'));
}
test("colorbutton text, size default", function() {
var colorButton = createColorButton({text: 'X'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 42, 30], 4);
});
test("colorbutton text, size large", function() {
var colorButton = createColorButton({text: 'X', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 49, 39], 4);
});
test("colorbutton text, size small", function() {
var colorButton = createColorButton({text: 'X', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 34, 23], 4);
});
test("colorbutton text, width 100, height 100", function() {
var colorButton = createColorButton({text: 'X', width: 100, height: 100});
deepEqual(Utils.rect(colorButton), [0, 0, 100, 100]);
deepEqual(Utils.rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton icon, size default", function() {
var colorButton = createColorButton({icon: 'test'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 50, 30], 4);
});
test("colorbutton icon, size small", function() {
var colorButton = createColorButton({icon: 'test', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 43, 24], 4);
});
test("colorbutton icon, size large", function() {
var colorButton = createColorButton({icon: 'test', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 54, 40], 4);
});
test("colorbutton icon, width 100, height 100", function() {
var colorButton = createColorButton({icon: 'test', width: 100, height: 100});
deepEqual(Utils.rect(colorButton), [0, 0, 100, 100]);
deepEqual(Utils.rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton text & icon, size default", function() {
var colorButton = createColorButton({text: 'X', icon: 'test'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 62, 30], 4);
});
test("colorbutton text & icon, size large", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', size: 'large'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 69, 40], 4);
});
test("colorbutton text & icon, size small", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', size: 'small'});
Utils.nearlyEqualRects(Utils.rect(colorButton), [0, 0, 53, 24], 4);
});
test("colorbutton text & icon, width 100, height 100", function() {
var colorButton = createColorButton({text: 'X', icon: 'test', width: 100, height: 100});
deepEqual(Utils.rect(colorButton), [0, 0, 100, 100]);
deepEqual(Utils.rect(colorButton.getEl().firstChild), [1, 1, 98, 98]);
});
test("colorbutton click event", function() {
var colorButton, clicks = {};
colorButton = createColorButton({text: 'X', onclick: function() {clicks.a = 'a';}});
colorButton.renderTo(document.getElementById('view'));
colorButton.fire('click', {target: colorButton.getEl()});
deepEqual(clicks, {a: 'a'});
});
})();

49
tests/qunit/editor/tinymce/ui/ComboBox.html
View File

@@ -1,49 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.ComboBox Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.TextBox", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
/*
test("combobox text, size default", function() {
var combobox = new tinymce.ui.ComboBox({text: 'abc'}).renderTo(document.getElementById('view'));
deepEqual(rect(combobox), [0, 0, 40, 22]);
});
*/
</script>
</head>
<body>
<h1 id="qunit-header">ui.ComboBox Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/Container.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.Container Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.Container", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.Container Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

229
tests/qunit/editor/tinymce/ui/Control.html
View File

@@ -1,229 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Control Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
module("ui.Control");
test("Initial states", function() {
var ctrl;
ctrl = new tinymce.ui.Control({});
// Check inital states
equal(ctrl.disabled(), false);
equal(ctrl.active(), false);
equal(ctrl.visible(), true);
equal(ctrl.text(), "");
equal(ctrl.width(), 0);
equal(ctrl.height(), 0);
equal(ctrl.name(), "");
equal(ctrl.title(), "");
equal(ctrl.parent(), undefined);
deepEqual(ctrl.settings, {});
});
test("Settings", function() {
var ctrl = new tinymce.ui.Control({
disabled: true,
active: true,
visible: true,
text: 'Text',
title: 'Title',
width: 100,
height: 200,
name: 'Name'
});
// Check settings states
equal(ctrl.disabled(), true);
equal(ctrl.active(), true);
equal(ctrl.visible(), true);
equal(ctrl.text(), "Text");
equal(ctrl.width(), 100);
equal(ctrl.height(), 200);
equal(ctrl.name(), "Name");
equal(ctrl.title(), "Title");
equal(ctrl.parent(), undefined);
deepEqual(ctrl.settings, {
disabled: true,
active: true,
visible: true,
text: 'Text',
title: 'Title',
width: 100,
height: 200,
name: 'Name'
});
});
/*
test("Properties", function() {
var ctrl, cont;
cont = new tinymce.ui.Container({});
ctrl = new tinymce.ui.Control({});
// Set all states
ctrl = ctrl.
disabled(true).
active(true).
visible(true).
text("Text").
title("Title").
width(100).
height(200).
name("Name").parent(cont);
// Check states
equal(ctrl.disabled(), true);
equal(ctrl.active(), true);
equal(ctrl.visible(), true);
equal(ctrl.text(), "Text");
equal(ctrl.width(), 100);
equal(ctrl.height(), 200);
equal(ctrl.name(), "Name");
equal(ctrl.title(), "Title");
equal(ctrl.parent(), cont);
deepEqual(ctrl.settings, {});
});
test("Chained methods", function() {
var ctrl = new tinymce.ui.Control({});
// Set all states
ctrl = ctrl.
refresh().
bind('click', function() {}).
unbind().
renderTo(document.getElementById('viewport')).
fire("nothing").
remove();
// Check so that the chain worked
ok(ctrl instanceof tinymce.ui.Control);
});
test("Events", function() {
var ctrl = new tinymce.ui.Control({
handlers: {
handler1: function() {
count++;
}
}
}), count;
ctrl.bind('MyEvent', function(target, args) {
ok(target === ctrl);
ok(ctrl === this);
deepEqual(args, {myKey: 'myVal'});
});
ctrl.fire('MyEvent', {myKey: 'myVal'});
function countAndBreak(target, args) {
count++;
return false;
}
// Bind two events
ctrl.bind('MyEvent2', countAndBreak);
ctrl.bind('MyEvent2', countAndBreak);
// Check if only one of them was called
count = 0;
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 1);
// Fire unbound event
ctrl.fire('MyEvent3', {myKey: 'myVal'});
// Unbind all
ctrl.unbind();
count = 0;
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 0, 'Unbind all');
// Unbind by name
ctrl.bind('MyEvent1', countAndBreak);
ctrl.bind('MyEvent2', countAndBreak);
ctrl.unbind('MyEvent2');
count = 0;
ctrl.fire('MyEvent1', {myKey: 'myVal'});
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 1);
// Unbind by name callback
ctrl.bind('MyEvent1', countAndBreak);
ctrl.bind('MyEvent1', function() {count++;});
ctrl.unbind('MyEvent1', countAndBreak);
count = 0;
ctrl.fire('MyEvent1', {myKey: 'myVal'});
equal(count, 1);
// Bind by named handler
ctrl.unbind();
ctrl.bind('MyEvent', 'handler1');
count = 0;
ctrl.fire('MyEvent', {myKey: 'myVal'});
equal(count, 1);
});
test("hasClass,addClass,removeClass", function() {
var ctrl = new tinymce.ui.Control({classes: 'class1 class2 class3'});
equal(ctrl.classes(), 'class1 class2 class3');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(!ctrl.hasClass('class4'));
ctrl.addClass('class4');
equal(ctrl.classes(), 'class1 class2 class3 class4');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(ctrl.hasClass('class4'));
ctrl.removeClass('class4');
equal(ctrl.classes(), 'class1 class2 class3');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(!ctrl.hasClass('class4'));
ctrl.removeClass('class3').removeClass('class2');
equal(ctrl.classes(), 'class1');
ok(ctrl.hasClass('class1'));
ok(!ctrl.hasClass('class2'));
ok(!ctrl.hasClass('class3'));
ctrl.removeClass('class3').removeClass('class1');
equal(ctrl.classes(), '');
ok(!ctrl.hasClass('class1'));
ok(!ctrl.hasClass('class2'));
ok(!ctrl.hasClass('class3'));
});
*/
</script>
</head>
<body>
<h1 id="qunit-header">ui.Control Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

204
tests/qunit/editor/tinymce/ui/Control.js Normal file
View File

@@ -0,0 +1,204 @@
(function() {
module("tinymce.ui.Control");
test("Initial states", function() {
var ctrl;
ctrl = new tinymce.ui.Control({});
// Check inital states
equal(ctrl.disabled(), false);
equal(ctrl.active(), false);
equal(ctrl.visible(), true);
equal(ctrl.text(), "");
equal(ctrl.width(), 0);
equal(ctrl.height(), 0);
equal(ctrl.name(), "");
equal(ctrl.title(), "");
equal(ctrl.parent(), undefined);
deepEqual(ctrl.settings, {});
});
test("Settings", function() {
var ctrl = new tinymce.ui.Control({
disabled: true,
active: true,
visible: true,
text: 'Text',
title: 'Title',
width: 100,
height: 200,
name: 'Name'
});
// Check settings states
equal(ctrl.disabled(), true);
equal(ctrl.active(), true);
equal(ctrl.visible(), true);
equal(ctrl.text(), "Text");
equal(ctrl.width(), 100);
equal(ctrl.height(), 200);
equal(ctrl.name(), "Name");
equal(ctrl.title(), "Title");
equal(ctrl.parent(), undefined);
deepEqual(ctrl.settings, {
disabled: true,
active: true,
visible: true,
text: 'Text',
title: 'Title',
width: 100,
height: 200,
name: 'Name'
});
});
/*
test("Properties", function() {
var ctrl, cont;
cont = new tinymce.ui.Container({});
ctrl = new tinymce.ui.Control({});
// Set all states
ctrl = ctrl.
disabled(true).
active(true).
visible(true).
text("Text").
title("Title").
width(100).
height(200).
name("Name").parent(cont);
// Check states
equal(ctrl.disabled(), true);
equal(ctrl.active(), true);
equal(ctrl.visible(), true);
equal(ctrl.text(), "Text");
equal(ctrl.width(), 100);
equal(ctrl.height(), 200);
equal(ctrl.name(), "Name");
equal(ctrl.title(), "Title");
equal(ctrl.parent(), cont);
deepEqual(ctrl.settings, {});
});
test("Chained methods", function() {
var ctrl = new tinymce.ui.Control({});
// Set all states
ctrl = ctrl.
refresh().
bind('click', function() {}).
unbind().
renderTo(document.getElementById('viewport')).
fire("nothing").
remove();
// Check so that the chain worked
ok(ctrl instanceof tinymce.ui.Control);
});
test("Events", function() {
var ctrl = new tinymce.ui.Control({
handlers: {
handler1: function() {
count++;
}
}
}), count;
ctrl.bind('MyEvent', function(target, args) {
ok(target === ctrl);
ok(ctrl === this);
deepEqual(args, {myKey: 'myVal'});
});
ctrl.fire('MyEvent', {myKey: 'myVal'});
function countAndBreak(target, args) {
count++;
return false;
}
// Bind two events
ctrl.bind('MyEvent2', countAndBreak);
ctrl.bind('MyEvent2', countAndBreak);
// Check if only one of them was called
count = 0;
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 1);
// Fire unbound event
ctrl.fire('MyEvent3', {myKey: 'myVal'});
// Unbind all
ctrl.unbind();
count = 0;
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 0, 'Unbind all');
// Unbind by name
ctrl.bind('MyEvent1', countAndBreak);
ctrl.bind('MyEvent2', countAndBreak);
ctrl.unbind('MyEvent2');
count = 0;
ctrl.fire('MyEvent1', {myKey: 'myVal'});
ctrl.fire('MyEvent2', {myKey: 'myVal'});
equal(count, 1);
// Unbind by name callback
ctrl.bind('MyEvent1', countAndBreak);
ctrl.bind('MyEvent1', function() {count++;});
ctrl.unbind('MyEvent1', countAndBreak);
count = 0;
ctrl.fire('MyEvent1', {myKey: 'myVal'});
equal(count, 1);
// Bind by named handler
ctrl.unbind();
ctrl.bind('MyEvent', 'handler1');
count = 0;
ctrl.fire('MyEvent', {myKey: 'myVal'});
equal(count, 1);
});
test("hasClass,addClass,removeClass", function() {
var ctrl = new tinymce.ui.Control({classes: 'class1 class2 class3'});
equal(ctrl.classes(), 'class1 class2 class3');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(!ctrl.hasClass('class4'));
ctrl.addClass('class4');
equal(ctrl.classes(), 'class1 class2 class3 class4');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(ctrl.hasClass('class4'));
ctrl.removeClass('class4');
equal(ctrl.classes(), 'class1 class2 class3');
ok(ctrl.hasClass('class1'));
ok(ctrl.hasClass('class2'));
ok(ctrl.hasClass('class3'));
ok(!ctrl.hasClass('class4'));
ctrl.removeClass('class3').removeClass('class2');
equal(ctrl.classes(), 'class1');
ok(ctrl.hasClass('class1'));
ok(!ctrl.hasClass('class2'));
ok(!ctrl.hasClass('class3'));
ctrl.removeClass('class3').removeClass('class1');
equal(ctrl.classes(), '');
ok(!ctrl.hasClass('class1'));
ok(!ctrl.hasClass('class2'));
ok(!ctrl.hasClass('class3'));
});
*/
})();

43
tests/qunit/editor/tinymce/ui/DragHelper.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.DragHelper Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.DragHelper", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.DragHelper Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/ElementPath.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.ElementPath Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.ElementPath", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.ElementPath Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/Factory.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.Factory Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.Factory", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.Factory Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/FieldSet.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FieldSet Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FieldSet", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.FieldSet Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/FilePicker.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FilePicker Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FilePicker", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.FilePicker Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

87
tests/qunit/editor/tinymce/ui/FitLayout.html
View File

@@ -1,87 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FitLayout Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FitLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function createFitPanel(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'panel',
layout: 'fit',
width: 200,
height: 200,
border: 1
}, settings)).renderTo(document.getElementById('view')).reflow();
}
test("fit with spacer inside", function() {
panel = createFitPanel({
items: [
{type: 'spacer', classes: 'red'}
]
});
deepEqual(rect(panel), [0, 0, 200, 200]);
deepEqual(rect(panel.find('spacer')[0]), [1, 1, 198, 198]);
});
test("fit with padding and spacer inside", function() {
panel = createFitPanel({
padding: 3,
items: [
{type: 'spacer', classes: 'red'}
]
});
deepEqual(rect(panel), [0, 0, 200, 200]);
deepEqual(rect(panel.find('spacer')[0]), [4, 4, 192, 192]);
});
test("fit with panel inside", function() {
panel = createFitPanel({
items: [
{type: 'panel', border: 1}
]
});
deepEqual(rect(panel), [0, 0, 200, 200]);
deepEqual(rect(panel.find('panel')[0]), [1, 1, 198, 198]);
});
</script>
</head>
<body>
<h1 id="qunit-header">ui.FitLayout Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

57
tests/qunit/editor/tinymce/ui/FitLayout.js Normal file
View File

@@ -0,0 +1,57 @@
(function() {
var panel;
module("tinymce.ui.FitLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function createFitPanel(settings) {
return tinymce.ui.Factory.create(tinymce.extend({
type: 'panel',
layout: 'fit',
width: 200,
height: 200,
border: 1
}, settings)).renderTo(document.getElementById('view')).reflow();
}
test("fit with spacer inside", function() {
panel = createFitPanel({
items: [
{type: 'spacer', classes: 'red'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 200, 200]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [1, 1, 198, 198]);
});
test("fit with padding and spacer inside", function() {
panel = createFitPanel({
padding: 3,
items: [
{type: 'spacer', classes: 'red'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 200, 200]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [4, 4, 192, 192]);
});
test("fit with panel inside", function() {
panel = createFitPanel({
items: [
{type: 'panel', border: 1}
]
});
deepEqual(Utils.rect(panel), [0, 0, 200, 200]);
deepEqual(Utils.rect(panel.find('panel')[0]), [1, 1, 198, 198]);
});
})();

915
tests/qunit/editor/tinymce/ui/FlexLayout.html
View File

@@ -1,915 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FlexLayout Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FlexLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function renderPanel(settings) {
var panel = tinymce.ui.Factory.create(tinymce.extend({
type: "panel",
layout: "flex",
width: 200, height: 200,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green'},
{type: 'spacer', classes: 'blue'}
]
}, settings)).renderTo(document.getElementById('view')).reflow();
resetScroll(panel.getEl('body'));
return panel;
}
test("pack: default, align: default, flex: default", function() {
panel = renderPanel({});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack: default, align: default, flex: default, borders", function() {
panel = renderPanel({defaults: {border: 1}});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 22, 22]);
deepEqual(rect(panel.find('spacer')[1]), [22, 0, 22, 22]);
deepEqual(rect(panel.find('spacer')[2]), [44, 0, 22, 22]);
});
test("pack: default, flex: 1", function() {
panel = renderPanel({
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: default, flex: 1, minWidth: various", function() {
panel = renderPanel({
defaults: {flex: 1},
items: [
{type: 'spacer', minWidth: 25, classes: 'red'},
{type: 'spacer', minWidth: 30, classes: 'green'},
{type: 'spacer', minWidth: 35, classes: 'blue'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 62, 20]);
deepEqual(rect(panel.find('spacer')[1]), [62, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [128, 0, 72, 20]);
});
test("pack: start, flex: default", function() {
panel = renderPanel({
pack: "start"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack: start, flex: 1", function() {
panel = renderPanel({
pack: "start",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: end, flex: default", function() {
panel = renderPanel({
pack: "end"
});
deepEqual(rect(panel.find('spacer')[0]), [140, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [160, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: end, flex: 1", function() {
panel = renderPanel({
pack: "end",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: center, flex: default", function() {
panel = renderPanel({
pack: "center"
});
deepEqual(rect(panel.find('spacer')[0]), [70, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [110, 0, 20, 20]);
});
test("pack: center, flex: 1", function() {
panel = renderPanel({
pack: "center",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: start, spacing: 3", function() {
panel = renderPanel({
layout: "flex",
pack: "start",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [23, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [46, 0, 20, 20]);
});
test("pack: end, spacing: 3", function() {
panel = renderPanel({
pack: "end",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [134, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [157, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: center, spacing: 3", function() {
panel = renderPanel({
pack: "center",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [67, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [113, 0, 20, 20]);
});
test("pack: start, padding: 3", function() {
panel = renderPanel({
pack: "start",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [23, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [43, 3, 20, 20]);
});
test("pack: start, spacing: 3, padding: 3", function() {
panel = renderPanel({
pack: "start",
padding: 3,
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [26, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [49, 3, 20, 20]);
});
test("pack: start, align: start", function() {
panel = renderPanel({
pack: "start",
align: "start"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack start, align: center", function() {
panel = renderPanel({
pack: "start",
align: "center"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 90, 20, 20]);
});
test("pack: start, align: end", function() {
panel = renderPanel({
pack: "start",
align: "end"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 180, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 180, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 180, 20, 20]);
});
test("pack: start, align: stretch", function() {
panel = renderPanel({
pack: "start",
align: "stretch"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 200]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 200]);
deepEqual(rect(panel.find('spacer')[2]), [40, 0, 20, 200]);
});
test("pack: start, padding: 3, align: stretch", function() {
panel = renderPanel({
pack: "start",
align: "stretch",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 194]);
deepEqual(rect(panel.find('spacer')[1]), [23, 3, 20, 194]);
deepEqual(rect(panel.find('spacer')[2]), [43, 3, 20, 194]);
});
test("pack: start, flex: mixed values", function() {
panel = renderPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 0.3},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 0.5}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 43, 20]);
deepEqual(rect(panel.find('spacer')[1]), [43, 0, 98, 20]);
deepEqual(rect(panel.find('spacer')[2]), [141, 0, 59, 20]);
});
test("pack: justify", function() {
panel = renderPanel({
pack: "justify"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: justify, padding: 3", function() {
panel = renderPanel({
pack: "justify",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [177, 3, 20, 20]);
});
test("pack: justify, minWidth: mixed values, padding: 3", function() {
panel = renderPanel({
pack: "justify",
padding: 3,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green', minWidth: 80},
{type: 'spacer', classes: 'blue', minWidth: 50}
]
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [45, 3, 80, 20]);
deepEqual(rect(panel.find('spacer')[2]), [147, 3, 50, 20]);
});
test("pack: start, flex: 1, maxWidth: 80 on second", function() {
panel = renderPanel({
pack: "start",
width: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', maxWidth: 80, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 160, 20]);
deepEqual(rect(panel.find('spacer')[1]), [160, 0, 80, 20]);
deepEqual(rect(panel.find('spacer')[2]), [240, 0, 160, 20]);
});
test("pack: start, flex: 1, minWidth: 150 on second", function() {
panel = renderPanel({
pack: "start",
width: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', minWidth: 150, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 90, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 0, 220, 20]);
deepEqual(rect(panel.find('spacer')[2]), [310, 0, 90, 20]);
});
test("pack: start, flex: default, hide item and reflow", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green'},
{type: 'spacer', classes: 'blue'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
deepEqual(rect(panel), [0, 0, 60, 20]);
panel.items().eq(0).hide();
panel.reflow();
deepEqual(rect(panel), [0, 0, 40, 20]);
});
test("pack: start, flex: 1, reflow after resize outer width", function() {
panel = renderPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
deepEqual(rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
panel.layoutRect({w: 400, h: 400}).reflow();
deepEqual(rect(panel), [0, 0, 400, 400]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 133, 20]);
deepEqual(rect(panel.find('spacer')[1]), [133, 0, 133, 20]);
deepEqual(rect(panel.find('spacer')[2]), [267, 0, 133, 20]);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow W+H)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxWidth: 100,
maxHeight: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
deepEqual(rect(panel), [0, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, direction: column, maxWidth/maxHeight: 100, padding: 20, spacing: 10, item minWidth/maxHeight: 200 (overflow W+H)", function() {
panel = renderPanel({
pack: "start",
direction: "column",
autoResize: true,
autoScroll: true,
maxWidth: 100,
maxHeight: 100,
padding: 20,
spacing: 10,
items: [
{type: 'spacer', minWidth: 100, minHeight: 100, classes: 'red dotted'},
{type: 'spacer', minWidth: 100, minHeight: 100, classes: 'green dotted'}
]
});
deepEqual(rect(panel), [0, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[0]), [20, 20, 100, 100]);
deepEqual(rect(panel.find('spacer')[1]), [20, 130, 100, 100]);
equal(panel.layoutRect().contentW, 20 + 100 + 20);
equal(panel.layoutRect().contentH, 20 + 100 + 10 + 100 + 20);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow W)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxWidth: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow H)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxHeight: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, minWidth: 200, item minWidth: 100 (underflow)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
minWidth: 200,
items: [
{type: 'spacer', minWidth: 100, classes: 'red'}
]
});
deepEqual(rect(panel), [0, 0, 200, 20]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 100, 20]);
});
test("pack: start, flex: 1, border: 1, reflow after resize inner width", function() {
panel = renderPanel({
pack: "start",
border: 1,
items: [
{type: 'spacer', classes: 'red', flex: 1}
]
});
panel.layoutRect({innerW: 400, innerH: 400}).reflow();
deepEqual(rect(panel), [0, 0, 402, 402]);
deepEqual(rect(panel.find('spacer')[0]), [1, 1, 400, 20]);
});
test("row flexbox in row flexbox", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
deepEqual(rect(panel), [0, 0, 110, 40]);
deepEqual(rect(panel.find("panel")[0]), [20, 0, 70, 40]);
deepEqual(rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [30, 10, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [60, 10, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [90, 20, 20, 20]);
});
test("row flexbox in row flexbox hide inner item and reflow", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
panel.find('spacer')[1].hide().parent().reflow();
deepEqual(rect(panel), [0, 0, 80, 40]);
deepEqual(rect(panel.find("panel")[0]), [20, 0, 40, 40]);
deepEqual(rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [30, 10, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [60, 20, 20, 20]);
});
// Direction column tests
function renderColumnPanel(settings) {
settings.direction = "column";
return renderPanel(settings);
}
test("direction: column, pack: default, align: default, flex: default", function() {
panel = renderColumnPanel({});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack: default, flex: 1", function() {
panel = renderColumnPanel({
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
deepEqual(rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: default, flex: 1, minWidth: various", function() {
panel = renderColumnPanel({
defaults: {flex: 1},
items: [
{type: 'spacer', minHeight: 25, classes: 'red'},
{type: 'spacer', minHeight: 30, classes: 'green'},
{type: 'spacer', minHeight: 35, classes: 'blue'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 62]);
deepEqual(rect(panel.find('spacer')[1]), [0, 62, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 128, 20, 72]);
});
test("direction: column, pack: start, flex: default", function() {
panel = renderColumnPanel({
pack: "start"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack: start, flex: 1", function() {
panel = renderColumnPanel({
pack: "start",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
deepEqual(rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: end, flex: default", function() {
panel = renderColumnPanel({
pack: "end"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 140, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 160, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: end, flex: 1", function() {
panel = renderColumnPanel({
pack: "end",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
deepEqual(rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: center, flex: default", function() {
panel = renderColumnPanel({
pack: "center"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 70, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 110, 20, 20]);
});
test("direction: column, pack: center, flex: 1", function() {
panel = renderColumnPanel({
pack: "center",
defaults: {flex: 1}
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
deepEqual(rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: start, spacing: 3", function() {
panel = renderColumnPanel({
layout: "flex",
pack: "start",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 23, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 46, 20, 20]);
});
test("direction: column, pack: end, spacing: 3", function() {
panel = renderColumnPanel({
pack: "end",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [0, 134, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 157, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: center, spacing: 3", function() {
panel = renderColumnPanel({
pack: "center",
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [0, 67, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 113, 20, 20]);
});
test("direction: column, pack: start, padding: 3", function() {
panel = renderColumnPanel({
pack: "start",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [3, 23, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 43, 20, 20]);
});
test("direction: column, pack: start, spacing: 3, padding: 3", function() {
panel = renderColumnPanel({
pack: "start",
padding: 3,
spacing: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [3, 26, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 49, 20, 20]);
});
test("direction: column, pack: start, align: start", function() {
panel = renderColumnPanel({
pack: "start",
align: "start"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack start, align: center", function() {
panel = renderColumnPanel({
pack: "start",
align: "center"
});
deepEqual(rect(panel.find('spacer')[0]), [90, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [90, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [90, 40, 20, 20]);
});
test("direction: column, pack: start, align: end", function() {
panel = renderColumnPanel({
pack: "start",
align: "end"
});
deepEqual(rect(panel.find('spacer')[0]), [180, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [180, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [180, 40, 20, 20]);
});
test("direction: column, pack: start, align: stretch", function() {
panel = renderColumnPanel({
pack: "start",
align: "stretch"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 200, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 20, 200, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 40, 200, 20]);
});
test("direction: column, pack: start, padding: 3, align: stretch", function() {
panel = renderColumnPanel({
pack: "start",
align: "stretch",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 194, 20]);
deepEqual(rect(panel.find('spacer')[1]), [3, 23, 194, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 43, 194, 20]);
});
test("direction: column, pack: start, flex: mixed values", function() {
panel = renderColumnPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 0.3},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 0.5}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 43]);
deepEqual(rect(panel.find('spacer')[1]), [0, 43, 20, 98]);
deepEqual(rect(panel.find('spacer')[2]), [0, 141, 20, 59]);
});
test("direction: column, pack: justify", function() {
panel = renderColumnPanel({
pack: "justify"
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: justify, padding: 3", function() {
panel = renderColumnPanel({
pack: "justify",
padding: 3
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [3, 90, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 177, 20, 20]);
});
test("direction: column, pack: justify, minHeight: mixed values, padding: 3", function() {
panel = renderColumnPanel({
pack: "justify",
padding: 3,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green', minHeight: 80},
{type: 'spacer', classes: 'blue', minHeight: 50}
]
});
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [3, 45, 20, 80]);
deepEqual(rect(panel.find('spacer')[2]), [3, 147, 20, 50]);
});
test("direction: column, pack: start, flex: 1, maxHeight: 80 on second", function() {
panel = renderColumnPanel({
pack: "start",
height: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', maxHeight: 80, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 160]);
deepEqual(rect(panel.find('spacer')[1]), [0, 160, 20, 80]);
deepEqual(rect(panel.find('spacer')[2]), [0, 240, 20, 160]);
});
test("direction: column, pack: start, flex: 1, minHeight: 150 on second", function() {
panel = renderColumnPanel({
pack: "start",
height: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', minHeight: 150, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 90]);
deepEqual(rect(panel.find('spacer')[1]), [0, 90, 20, 220]);
deepEqual(rect(panel.find('spacer')[2]), [0, 310, 20, 90]);
});
test("direction: column, pack: start, flex: 1, reflow after resize outer height", function() {
panel = renderColumnPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
deepEqual(rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
deepEqual(rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
panel.layoutRect({w: 400, h: 400}).reflow();
deepEqual(rect(panel), [0, 0, 400, 400]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 133]);
deepEqual(rect(panel.find('spacer')[1]), [0, 133, 20, 133]);
deepEqual(rect(panel.find('spacer')[2]), [0, 267, 20, 133]);
});
test("direction: column, pack: start, flex: 1, border: 1, reflow after resize inner width", function() {
panel = renderColumnPanel({
pack: "start",
border: 1,
items: [
{type: 'spacer', classes: 'red', flex: 1}
]
});
panel.layoutRect({innerW: 400, innerH: 400}).reflow();
deepEqual(rect(panel), [0, 0, 402, 402]);
deepEqual(rect(panel.find('spacer')[0]), [1, 1, 20, 400]);
});
test("direction: column, row flexbox in row flexbox and resize parent", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
deepEqual(rect(panel), [0, 0, 110, 40]);
deepEqual(rect(panel.find("panel")[0]), [20, 0, 70, 40]);
deepEqual(rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [30, 10, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [60, 10, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [90, 20, 20, 20]);
});
</script>
</head>
<body>
<h1 id="qunit-header">ui.FlexLayout Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

884
tests/qunit/editor/tinymce/ui/FlexLayout.js Normal file
View File

@@ -0,0 +1,884 @@
(function() {
var panel;
module("tinymce.ui.FlexLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function renderPanel(settings) {
var panel = tinymce.ui.Factory.create(tinymce.extend({
type: "panel",
layout: "flex",
width: 200, height: 200,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green'},
{type: 'spacer', classes: 'blue'}
]
}, settings)).renderTo(document.getElementById('view')).reflow();
Utils.resetScroll(panel.getEl('body'));
return panel;
}
test("pack: default, align: default, flex: default", function() {
panel = renderPanel({});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack: default, align: default, flex: default, borders", function() {
panel = renderPanel({defaults: {border: 1}});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 22, 22]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [22, 0, 22, 22]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [44, 0, 22, 22]);
});
test("pack: default, flex: 1", function() {
panel = renderPanel({
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: default, flex: 1, minWidth: various", function() {
panel = renderPanel({
defaults: {flex: 1},
items: [
{type: 'spacer', minWidth: 25, classes: 'red'},
{type: 'spacer', minWidth: 30, classes: 'green'},
{type: 'spacer', minWidth: 35, classes: 'blue'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 62, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [62, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [128, 0, 72, 20]);
});
test("pack: start, flex: default", function() {
panel = renderPanel({
pack: "start"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack: start, flex: 1", function() {
panel = renderPanel({
pack: "start",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: end, flex: default", function() {
panel = renderPanel({
pack: "end"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [140, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [160, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: end, flex: 1", function() {
panel = renderPanel({
pack: "end",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: center, flex: default", function() {
panel = renderPanel({
pack: "center"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [70, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [110, 0, 20, 20]);
});
test("pack: center, flex: 1", function() {
panel = renderPanel({
pack: "center",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
});
test("pack: start, spacing: 3", function() {
panel = renderPanel({
layout: "flex",
pack: "start",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [23, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [46, 0, 20, 20]);
});
test("pack: end, spacing: 3", function() {
panel = renderPanel({
pack: "end",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [134, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [157, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: center, spacing: 3", function() {
panel = renderPanel({
pack: "center",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [67, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [113, 0, 20, 20]);
});
test("pack: start, padding: 3", function() {
panel = renderPanel({
pack: "start",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [23, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [43, 3, 20, 20]);
});
test("pack: start, spacing: 3, padding: 3", function() {
panel = renderPanel({
pack: "start",
padding: 3,
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [26, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [49, 3, 20, 20]);
});
test("pack: start, align: start", function() {
panel = renderPanel({
pack: "start",
align: "start"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
});
test("pack start, align: center", function() {
panel = renderPanel({
pack: "start",
align: "center"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 90, 20, 20]);
});
test("pack: start, align: end", function() {
panel = renderPanel({
pack: "start",
align: "end"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 180, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 180, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 180, 20, 20]);
});
test("pack: start, align: stretch", function() {
panel = renderPanel({
pack: "start",
align: "stretch"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 200]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 200]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 0, 20, 200]);
});
test("pack: start, padding: 3, align: stretch", function() {
panel = renderPanel({
pack: "start",
align: "stretch",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 194]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [23, 3, 20, 194]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [43, 3, 20, 194]);
});
test("pack: start, flex: mixed values", function() {
panel = renderPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 0.3},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 0.5}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 43, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [43, 0, 98, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [141, 0, 59, 20]);
});
test("pack: justify", function() {
panel = renderPanel({
pack: "justify"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [180, 0, 20, 20]);
});
test("pack: justify, padding: 3", function() {
panel = renderPanel({
pack: "justify",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [177, 3, 20, 20]);
});
test("pack: justify, minWidth: mixed values, padding: 3", function() {
panel = renderPanel({
pack: "justify",
padding: 3,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green', minWidth: 80},
{type: 'spacer', classes: 'blue', minWidth: 50}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [45, 3, 80, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [147, 3, 50, 20]);
});
test("pack: start, flex: 1, maxWidth: 80 on second", function() {
panel = renderPanel({
pack: "start",
width: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', maxWidth: 80, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 160, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [160, 0, 80, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [240, 0, 160, 20]);
});
test("pack: start, flex: 1, minWidth: 150 on second", function() {
panel = renderPanel({
pack: "start",
width: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', minWidth: 150, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 90, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 0, 220, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [310, 0, 90, 20]);
});
test("pack: start, flex: default, hide item and reflow", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green'},
{type: 'spacer', classes: 'blue'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [40, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 60, 20]);
panel.items().eq(0).hide();
panel.reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 40, 20]);
});
test("pack: start, flex: 1, reflow after resize outer width", function() {
panel = renderPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [67, 0, 67, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [133, 0, 67, 20]);
panel.layoutRect({w: 400, h: 400}).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 400, 400]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 133, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [133, 0, 133, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [267, 0, 133, 20]);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow W+H)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxWidth: 100,
maxHeight: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 100, 100]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, direction: column, maxWidth/maxHeight: 100, padding: 20, spacing: 10, item minWidth/maxHeight: 200 (overflow W+H)", function() {
panel = renderPanel({
pack: "start",
direction: "column",
autoResize: true,
autoScroll: true,
maxWidth: 100,
maxHeight: 100,
padding: 20,
spacing: 10,
items: [
{type: 'spacer', minWidth: 100, minHeight: 100, classes: 'red dotted'},
{type: 'spacer', minWidth: 100, minHeight: 100, classes: 'green dotted'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 100, 100]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [20, 20, 100, 100]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [20, 130, 100, 100]);
equal(panel.layoutRect().contentW, 20 + 100 + 20);
equal(panel.layoutRect().contentH, 20 + 100 + 10 + 100 + 20);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow W)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxWidth: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, maxWidth/maxHeight: 100, item minWidth/maxHeight: 200 (overflow H)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
autoScroll: true,
maxHeight: 100,
items: [
{type: 'spacer', minWidth: 200, minHeight: 200, classes: 'red dotted'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 200, 200]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("pack: start, minWidth: 200, item minWidth: 100 (underflow)", function() {
panel = renderPanel({
pack: "start",
autoResize: true,
minWidth: 200,
items: [
{type: 'spacer', minWidth: 100, classes: 'red'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 200, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 100, 20]);
});
test("pack: start, flex: 1, border: 1, reflow after resize inner width", function() {
panel = renderPanel({
pack: "start",
border: 1,
items: [
{type: 'spacer', classes: 'red', flex: 1}
]
});
panel.layoutRect({innerW: 400, innerH: 400}).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 402, 402]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [1, 1, 400, 20]);
});
test("row flexbox in row flexbox", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 110, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find("panel")[0]), [20, 0, 70, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [30, 10, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [60, 10, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[3]), [90, 20, 20, 20]);
});
test("row flexbox in row flexbox hide inner item and reflow", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
panel.find('spacer')[1].hide().parent().reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 80, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find("panel")[0]), [20, 0, 40, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [30, 10, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[3]), [60, 20, 20, 20]);
});
// Direction column tests
function renderColumnPanel(settings) {
settings.direction = "column";
return renderPanel(settings);
}
test("direction: column, pack: default, align: default, flex: default", function() {
panel = renderColumnPanel({});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack: default, flex: 1", function() {
panel = renderColumnPanel({
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: default, flex: 1, minWidth: various", function() {
panel = renderColumnPanel({
defaults: {flex: 1},
items: [
{type: 'spacer', minHeight: 25, classes: 'red'},
{type: 'spacer', minHeight: 30, classes: 'green'},
{type: 'spacer', minHeight: 35, classes: 'blue'}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 62]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 62, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 128, 20, 72]);
});
test("direction: column, pack: start, flex: default", function() {
panel = renderColumnPanel({
pack: "start"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack: start, flex: 1", function() {
panel = renderColumnPanel({
pack: "start",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: end, flex: default", function() {
panel = renderColumnPanel({
pack: "end"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 140, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 160, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: end, flex: 1", function() {
panel = renderColumnPanel({
pack: "end",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: center, flex: default", function() {
panel = renderColumnPanel({
pack: "center"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 70, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 110, 20, 20]);
});
test("direction: column, pack: center, flex: 1", function() {
panel = renderColumnPanel({
pack: "center",
defaults: {flex: 1}
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
});
test("direction: column, pack: start, spacing: 3", function() {
panel = renderColumnPanel({
layout: "flex",
pack: "start",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 23, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 46, 20, 20]);
});
test("direction: column, pack: end, spacing: 3", function() {
panel = renderColumnPanel({
pack: "end",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 134, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 157, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: center, spacing: 3", function() {
panel = renderColumnPanel({
pack: "center",
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 67, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 113, 20, 20]);
});
test("direction: column, pack: start, padding: 3", function() {
panel = renderColumnPanel({
pack: "start",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [3, 23, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [3, 43, 20, 20]);
});
test("direction: column, pack: start, spacing: 3, padding: 3", function() {
panel = renderColumnPanel({
pack: "start",
padding: 3,
spacing: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [3, 26, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [3, 49, 20, 20]);
});
test("direction: column, pack: start, align: start", function() {
panel = renderColumnPanel({
pack: "start",
align: "start"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 40, 20, 20]);
});
test("direction: column, pack start, align: center", function() {
panel = renderColumnPanel({
pack: "start",
align: "center"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [90, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [90, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [90, 40, 20, 20]);
});
test("direction: column, pack: start, align: end", function() {
panel = renderColumnPanel({
pack: "start",
align: "end"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [180, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [180, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [180, 40, 20, 20]);
});
test("direction: column, pack: start, align: stretch", function() {
panel = renderColumnPanel({
pack: "start",
align: "stretch"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 200, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 20, 200, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 40, 200, 20]);
});
test("direction: column, pack: start, padding: 3, align: stretch", function() {
panel = renderColumnPanel({
pack: "start",
align: "stretch",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 194, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [3, 23, 194, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [3, 43, 194, 20]);
});
test("direction: column, pack: start, flex: mixed values", function() {
panel = renderColumnPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 0.3},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 0.5}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 43]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 43, 20, 98]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 141, 20, 59]);
});
test("direction: column, pack: justify", function() {
panel = renderColumnPanel({
pack: "justify"
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 180, 20, 20]);
});
test("direction: column, pack: justify, padding: 3", function() {
panel = renderColumnPanel({
pack: "justify",
padding: 3
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [3, 90, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [3, 177, 20, 20]);
});
test("direction: column, pack: justify, minHeight: mixed values, padding: 3", function() {
panel = renderColumnPanel({
pack: "justify",
padding: 3,
items: [
{type: 'spacer', classes: 'red'},
{type: 'spacer', classes: 'green', minHeight: 80},
{type: 'spacer', classes: 'blue', minHeight: 50}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [3, 45, 20, 80]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [3, 147, 20, 50]);
});
test("direction: column, pack: start, flex: 1, maxHeight: 80 on second", function() {
panel = renderColumnPanel({
pack: "start",
height: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', maxHeight: 80, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 160]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 160, 20, 80]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 240, 20, 160]);
});
test("direction: column, pack: start, flex: 1, minHeight: 150 on second", function() {
panel = renderColumnPanel({
pack: "start",
height: 400,
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', minHeight: 150, flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 90]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 90, 20, 220]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 310, 20, 90]);
});
test("direction: column, pack: start, flex: 1, reflow after resize outer height", function() {
panel = renderColumnPanel({
pack: "start",
items: [
{type: 'spacer', classes: 'red', flex: 1},
{type: 'spacer', classes: 'green', flex: 1},
{type: 'spacer', classes: 'blue', flex: 1}
]
});
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 67, 20, 67]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 133, 20, 67]);
panel.layoutRect({w: 400, h: 400}).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 400, 400]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 133]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [0, 133, 20, 133]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [0, 267, 20, 133]);
});
test("direction: column, pack: start, flex: 1, border: 1, reflow after resize inner width", function() {
panel = renderColumnPanel({
pack: "start",
border: 1,
items: [
{type: 'spacer', classes: 'red', flex: 1}
]
});
panel.layoutRect({innerW: 400, innerH: 400}).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 402, 402]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [1, 1, 20, 400]);
});
test("direction: column, row flexbox in row flexbox and resize parent", function() {
panel = tinymce.ui.Factory.create({
type: 'panel',
layout: 'flex',
align: 'end',
items: [
{type: 'spacer', classes: 'red'},
{type: 'panel', layout: 'flex', padding: 10, spacing: 10, items: [
{type: 'spacer', classes: 'yellow'},
{type: 'spacer', classes: 'magenta'}
]},
{type: 'spacer', classes: 'green'}
]
}).renderTo(document.getElementById('view')).reflow();
Utils.nearlyEqualRects(Utils.rect(panel), [0, 0, 110, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find("panel")[0]), [20, 0, 70, 40]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[0]), [0, 20, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[1]), [30, 10, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[2]), [60, 10, 20, 20]);
Utils.nearlyEqualRects(Utils.rect(panel.find('spacer')[3]), [90, 20, 20, 20]);
});
})();

43
tests/qunit/editor/tinymce/ui/FloatPanel.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FloatPanel Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FloatPanel", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.FloatPanel Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/FlowLayout.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FlowLayout Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FlowLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.FlowLayout Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/Form.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.Form Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.Form", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.Form Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

43
tests/qunit/editor/tinymce/ui/FormItem.html
View File

@@ -1,43 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.FormItem Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.FormItem", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
</script>
</head>
<body>
<h1 id="qunit-header">ui.FormItem Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

244
tests/qunit/editor/tinymce/ui/GridLayout.html
View File

@@ -1,244 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ui.GridLayout Test Suite</title>
<link type="text/css" rel="stylesheet" href="../../../../../src/wp-includes/js/tinymce/skins/lightgray/skin.min.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/ui-overrides.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css" type="text/css" />
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="../../js/qunit/reporter.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/tinymce_loader.js"></script>
<script type="text/javascript">
var panel;
QUnit.config.autostart = false;
QUnit.config.reorder = false;
module("ui.GridLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
//document.getElementById('view').innerHTML = '';
}
});
window.onload = function() {
QUnit.start();
};
function renderGridPanel(settings) {
var panel = tinymce.ui.Factory.create(tinymce.extend({
type: "panel",
layout: "grid",
defaults: {type: 'spacer'}
}, settings)).renderTo(document.getElementById('view')).reflow();
resetScroll(panel.getEl('body'));
return panel;
}
test("automatic grid size 2x2", function() {
panel = renderGridPanel({
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(rect(panel), [0, 0, 40, 40]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 20, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [20, 20, 20, 20]);
});
/*
test("fixed pixel size, automatic grid size 2x2", function() {
panel = renderGridPanel({
width: 100, height: 100,
align: "center",
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(rect(panel), [0, 0, 200, 200]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 17, 22]);
deepEqual(rect(panel.find('spacer')[1]), [17, 0, 17, 22]);
deepEqual(rect(panel.find('spacer')[2]), [0, 22, 16, 22]);
deepEqual(rect(panel.find('spacer')[3]), [17, 22, 17, 22]);
});
*/
test("spacing: 3, automatic grid size 2x2", function() {
panel = renderGridPanel({
spacing: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(rect(panel), [0, 0, 43, 43]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [23, 0, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [0, 23, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [23, 23, 20, 20]);
});
test("padding: 3, automatic grid size 2x2", function() {
panel = renderGridPanel({
padding: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(rect(panel), [0, 0, 46, 46]);
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [23, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 23, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [23, 23, 20, 20]);
});
test("spacing: 3, padding: 3, automatic grid size 2x2", function() {
panel = renderGridPanel({
padding: 3,
spacing: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(rect(panel), [0, 0, 49, 49]);
deepEqual(rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[1]), [26, 3, 20, 20]);
deepEqual(rect(panel.find('spacer')[2]), [3, 26, 20, 20]);
deepEqual(rect(panel.find('spacer')[3]), [26, 26, 20, 20]);
});
test("inner elements 100x100 maxWidth/maxHeight: 118 (overflow W+H)", function() {
panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 118,
maxHeight: 118,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(rect(panel), [0, 0, 118, 118]);
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().w, 118);
equal(panel.layoutRect().h, 118);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("inner elements: 100x100, padding: 20, spacing: 10, maxWidth/maxHeight: 118 (overflow W+H)", function() {
panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 118,
maxHeight: 118,
padding: 20,
spacing: 10,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(rect(panel), [0, 0, 118, 118]);
deepEqual(rect(panel.find('spacer')[0]), [20, 20, 100, 100]);
deepEqual(rect(panel.find('spacer')[1]), [130, 20, 100, 100]);
deepEqual(rect(panel.find('spacer')[2]), [20, 130, 100, 100]);
deepEqual(rect(panel.find('spacer')[3]), [130, 130, 100, 100]);
equal(panel.layoutRect().w, 118);
equal(panel.layoutRect().h, 118);
equal(panel.layoutRect().contentW, 20 + 200 + 10 + 20);
equal(panel.layoutRect().contentH, 20 + 200 + 10 + 20);
});
test("inner elements 100x100 maxWidth: 118 (overflow W)", function() {
panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 100,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("inner elements 100x100 maxHeight: 118 (overflow H)", function() {
panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxHeight: 100,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
</script>
</head>
<body>
<h1 id="qunit-header">ui.GridLayout Test Suite</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests">
</ol>
<div id="view" style="position: absolute; right: 0; top: 0"></div>
</body>
</html>

212
tests/qunit/editor/tinymce/ui/GridLayout.js Normal file
View File

@@ -0,0 +1,212 @@
(function() {
module("tinymce.ui.GridLayout", {
setup: function() {
document.getElementById('view').innerHTML = '';
},
teardown: function() {
tinymce.dom.Event.clean(document.getElementById('view'));
}
});
function renderGridPanel(settings) {
var panel = tinymce.ui.Factory.create(tinymce.extend({
type: "panel",
layout: "grid",
defaults: {type: 'spacer'}
}, settings)).renderTo(document.getElementById('view')).reflow();
Utils.resetScroll(panel.getEl('body'));
return panel;
}
test("automatic grid size 2x2", function() {
var panel = renderGridPanel({
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 40, 40]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [20, 0, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 20, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [20, 20, 20, 20]);
});
/*
test("fixed pixel size, automatic grid size 2x2", function() {
panel = renderGridPanel({
width: 100, height: 100,
align: "center",
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 200, 200]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 17, 22]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [17, 0, 17, 22]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 22, 16, 22]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [17, 22, 17, 22]);
});
*/
test("spacing: 3, automatic grid size 2x2", function() {
var panel = renderGridPanel({
spacing: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 43, 43]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [23, 0, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 23, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [23, 23, 20, 20]);
});
test("padding: 3, automatic grid size 2x2", function() {
var panel = renderGridPanel({
padding: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 46, 46]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [23, 3, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [3, 23, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [23, 23, 20, 20]);
});
test("spacing: 3, padding: 3, automatic grid size 2x2", function() {
var panel = renderGridPanel({
padding: 3,
spacing: 3,
items: [
{classes: 'red'}, {classes: 'green'},
{classes: 'blue'}, {classes: 'cyan'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 49, 49]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [3, 3, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [26, 3, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [3, 26, 20, 20]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [26, 26, 20, 20]);
});
test("inner elements 100x100 maxWidth/maxHeight: 118 (overflow W+H)", function() {
var panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 118,
maxHeight: 118,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 118, 118]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().w, 118);
equal(panel.layoutRect().h, 118);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("inner elements: 100x100, padding: 20, spacing: 10, maxWidth/maxHeight: 118 (overflow W+H)", function() {
var panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 118,
maxHeight: 118,
padding: 20,
spacing: 10,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(Utils.rect(panel), [0, 0, 118, 118]);
deepEqual(Utils.rect(panel.find('spacer')[0]), [20, 20, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [130, 20, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [20, 130, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [130, 130, 100, 100]);
equal(panel.layoutRect().w, 118);
equal(panel.layoutRect().h, 118);
equal(panel.layoutRect().contentW, 20 + 200 + 10 + 20);
equal(panel.layoutRect().contentH, 20 + 200 + 10 + 20);
});
test("inner elements 100x100 maxWidth: 118 (overflow W)", function() {
var panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxWidth: 100,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
test("inner elements 100x100 maxHeight: 118 (overflow H)", function() {
var panel = renderGridPanel({
autoResize: true,
autoScroll: true,
maxHeight: 100,
defaults: {
type: 'spacer',
minWidth: 100,
minHeight: 100
},
items: [
{classes: 'red dotted'}, {classes: 'green dotted'},
{classes: 'blue dotted'}, {classes: 'cyan dotted'}
]
});
deepEqual(Utils.rect(panel.find('spacer')[0]), [0, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[1]), [100, 0, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[2]), [0, 100, 100, 100]);
deepEqual(Utils.rect(panel.find('spacer')[3]), [100, 100, 100, 100]);
equal(panel.layoutRect().contentW, 200);
equal(panel.layoutRect().contentH, 200);
});
})();

Some files were not shown because too many files have changed in this diff Show More