Wordpress/tests/qunit/editor/tinymce/util/Quirks_webkit.html

136 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Webkit Quirks</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;
QUnit.config.reorder = false;
QUnit.config.autostart = false;
module("WebKit Quirks Tests", {
autostart: false
});
if (tinymce.isWebKit) {
test('Delete from beginning of P into H1', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
setSelection('p', 0);
editor.execCommand('Delete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab</h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('Delete whole H1 before P', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
rng = editor.selection.getRng();
rng.setStartBefore(editor.getBody().firstChild);
rng.setEndAfter(editor.getBody().firstChild);
editor.selection.setRng(rng);
editor.execCommand('Delete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>b<br></h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('Delete from beginning of P with style span inside into H1', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b<span style="color:red">c</span></p>';
setSelection('p', 0);
editor.execCommand('Delete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab<span data-mce-style="color:red" style="color:red">c</span></h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('ForwardDelete from end of H1 into P', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
setSelection('h1', 1);
editor.execCommand('ForwardDelete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab</h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('ForwardDelete whole H1 before P', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
rng = editor.selection.getRng();
rng.setStartBefore(editor.getBody().firstChild);
rng.setEndAfter(editor.getBody().firstChild);
editor.selection.setRng(rng);
editor.execCommand('ForwardDelete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>b<br></h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('ForwardDelete from end of H1 into P with style span inside', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b<span style="color:red">c</span></p>';
setSelection('h1', 1);
editor.execCommand('ForwardDelete');
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab<span data-mce-style="color:red" style="color:red">c</span></h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('Backspace key from beginning of P into H1', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
setSelection('p', 0);
editor.fire("keydown", {keyCode: 8});
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab</h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
test('Delete key from end of H1 into P', function() {
editor.getBody().innerHTML ='<h1>a</h1><p>b</p>';
setSelection('h1', 1);
editor.fire("keydown", {keyCode: 46});
equal(cleanHtml(editor.getBody().innerHTML), '<h1>ab</h1>');
equal(editor.selection.getStart().nodeName, 'H1');
});
} else {
test("Skipped since the browser isn't WebKit", function() {
ok(true, "Skipped");
});
}
// WP
var url = document.location.href.substring( 0, document.location.href.lastIndexOf('tinymce/') );
tinymce.init({
mode : "exact",
// WP
external_plugins: {
table: url + 'external-plugins/table/plugin.js'
},
// WP end
elements : "elm1",
indent: false,
init_instance_callback : function(ed) {
editor = ed;
QUnit.start();
}
});
</script>
</head>
<body>
<h1 id="qunit-header">Webkit Quirks</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>