111 lines
4.0 KiB
HTML
111 lines
4.0 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<p id="description"></p>
|
|
<div id="console"></div>
|
|
<script>
|
|
description("Test to make sure styles toggle as expected and tag-based styles can be removed by editing commands.")
|
|
|
|
// Note that editing commands insert <b> instead of
|
|
// <span style="font-weight: bold"> when in quirks mode
|
|
// so edits to this file should be aware of parse mode.
|
|
// FIXME: This test could use iframe subdocuments to avoid
|
|
// needing to depend on the compatMode of this document
|
|
shouldBeEqualToString("document.compatMode", 'BackCompat');
|
|
|
|
function testToggleToRemove(toggleCommand, testContainer, testContent)
|
|
{
|
|
document.body.appendChild(testContainer);
|
|
window.getSelection().selectAllChildren(testContainer);
|
|
document.execCommand(toggleCommand, false, null);
|
|
document.body.removeChild(testContainer);
|
|
return (testContainer.firstChild == testContent);
|
|
}
|
|
|
|
function wrapInTag(tagName, content)
|
|
{
|
|
var element = document.createElement(tagName);
|
|
element.appendChild(content);
|
|
return element;
|
|
}
|
|
|
|
function wrapInEditableContainer(content)
|
|
{
|
|
var testContainer = wrapInTag('div', content);
|
|
testContainer.contentEditable = true;
|
|
return testContainer;
|
|
}
|
|
|
|
function wrapInCSSTag(testContent, cssProperty, cssValue)
|
|
{
|
|
var wrapperElement = wrapInTag('span', testContent);
|
|
wrapperElement.style.setProperty(cssProperty, cssValue, "");
|
|
return wrapperElement;
|
|
}
|
|
|
|
function testCSSRemovalOnToggle(cssProperty, cssValue, toggleCommand)
|
|
{
|
|
var testContent = document.createTextNode("test");
|
|
var testWrapper = wrapInCSSTag(testContent, cssProperty, cssValue);
|
|
var testContainer = wrapInEditableContainer(testWrapper);
|
|
if (testToggleToRemove(toggleCommand, testContainer, testContent)) {
|
|
testPassed(toggleCommand + " removing " + cssProperty + ": " + cssValue);
|
|
} else {
|
|
testFailed(toggleCommand + " removing " + cssProperty + ": " + cssValue + " -- " + testContainer.innerHTML);
|
|
}
|
|
}
|
|
|
|
function testTagRemovalOnToggle(tagName, toggleCommand)
|
|
{
|
|
var testContent = document.createTextNode("test");
|
|
var testWrapper = wrapInTag(tagName, testContent);
|
|
var testContainer = wrapInEditableContainer(testWrapper);
|
|
if (testToggleToRemove(toggleCommand, testContainer, testContent)) {
|
|
testPassed(toggleCommand + " removing " + tagName);
|
|
} else {
|
|
testFailed(toggleCommand + " removing " + tagName + " -- " + testContainer.innerHTML);
|
|
}
|
|
}
|
|
|
|
function testBasicToggle(toggleCommand)
|
|
{
|
|
var testContent = document.createTextNode("test");
|
|
var testContainer = wrapInEditableContainer(testContent);
|
|
document.body.appendChild(testContainer);
|
|
window.getSelection().selectAllChildren(testContainer);
|
|
document.execCommand(toggleCommand, false, null);
|
|
document.execCommand(toggleCommand, false, null);
|
|
if (testContainer.firstChild == testContent) {
|
|
testPassed(toggleCommand + " toggle");
|
|
} else {
|
|
testFailed(toggleCommand + " toggle: " + testContainer.innerHTML);
|
|
}
|
|
document.body.removeChild(testContainer);
|
|
}
|
|
|
|
function runTests(toggleCommand, tagName, cssProperty, cssValue)
|
|
{
|
|
testBasicToggle(toggleCommand);
|
|
testTagRemovalOnToggle(tagName, toggleCommand);
|
|
testCSSRemovalOnToggle(cssProperty, cssValue, toggleCommand);
|
|
}
|
|
|
|
runTests("bold", "b", "font-weight", "bold");
|
|
testTagRemovalOnToggle("strong", "bold"); // IE adds "strong" tags for bold, so we should remove them (even though FF doesn't)
|
|
runTests("italic", "i", "font-style", "italic");
|
|
testTagRemovalOnToggle("em", "italic"); // IE adds "em" tags for italic, so we should remove them (even though FF doesn't)
|
|
runTests("subscript", "sub", "vertical-align", "sub");
|
|
runTests("superscript", "sup", "vertical-align", "super");
|
|
runTests("strikethrough", "strike", "text-decoration", "line-through");
|
|
testTagRemovalOnToggle("s", "strikethrough");
|
|
runTests("underline", "u", "text-decoration", "underline");
|
|
|
|
var successfullyParsed = true;
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|