<!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 WebKit adds style to the appropriate container.');

var testContainer = document.createElement("div");
testContainer.contentEditable = true;
document.body.appendChild(testContainer);

var styleWithCSS = false;
function testSingleToggle(toggleCommand, value, initialContents, expectedContents)
{
    testContainer.innerHTML = initialContents;
    window.getSelection().selectAllChildren(testContainer);
    document.execCommand('styleWithCSS', false, styleWithCSS);
    document.execCommand(toggleCommand, false, value);
    var action = toggleCommand + '(' + value + ') on all of "' + initialContents + '" yields "' + testContainer.innerHTML + '"';
    if (testContainer.innerHTML == expectedContents)
        testPassed(action);
    else
        testFailed(action + ', expected "' + expectedContents + '"');
}

debug('styleWithCSS = false');
testSingleToggle("fontSize", 3, '<font size="3">hello <font size="4">world</font></font>', '<font size="3">hello world</font>');
testSingleToggle("fontSize", 4, '<font face="Arial">hello</font>', '<font face="Arial" size="4">hello</font>');
testSingleToggle("fontSize", 4, '<font color="blue"><font face="Arial">hello</font></font>', '<font color="blue"><font face="Arial" size="4">hello</font></font>');
testSingleToggle("fontSize", 4, '<b><font face="Arial">hello</font></b>', '<b><font face="Arial" size="4">hello</font></b>');
testSingleToggle("fontSize", 4, '<font face="Arial"><i>hello</i></font>', '<font face="Arial" size="4"><i>hello</i></font>');
testSingleToggle("fontName", "Arial", '<b><font face="Arial">hello</font></b> world', '<font face="Arial"><b>hello</b> world</font>');
testSingleToggle("fontName", "Arial", '<font color="blue">hello</font> world', '<font face="Arial"><font color="blue">hello</font> world</font>');
testSingleToggle("fontName", "Arial", '<b><u>hello</u> world</b>', '<b><font face="Arial"><u>hello</u> world</font></b>');
testSingleToggle("foreColor", 'blue', '<font><u style="color:red;">hello</u></font>', '<font color="#0000ff"><u>hello</u></font>');
testSingleToggle("foreColor", 'rgb(0, 50, 100)', '<font><u style="color:red;">hello</u></font>', '<font color="#003264"><u>hello</u></font>');
testSingleToggle("foreColor", 'rgba(0, 50, 100, 0.4)', '<font color="#00ff00"><u>hello</u></font>', '<u style="color: rgba(0, 50, 100, 0.4);">hello</u>');
testSingleToggle("bold", null, '<u><strike>hello</strike> <strike>world</strike></u>', '<u><b><strike>hello</strike> <strike>world</strike></b></u>');
testSingleToggle("bold", null, '<i>hello</i> <b>world</b>', '<b><i>hello</i> world</b>');
testSingleToggle("bold", null, '<strike><i><u>hello <b>world</b></u></i> webkit</strike>', '<strike><b><i><u>hello world</u></i> webkit</b></strike>');
testSingleToggle("bold", null,
    '<b contenteditable="false"><span style="font-weight: normal;">hello</span> world</b> world',
    '<b contenteditable="false"><span style="font-weight: normal;">hello</span> world</b><b> world</b>');
testSingleToggle("bold", null,
    '<i>hello</i> <b contenteditable="false">world</b>',
    '<b><i>hello</i> </b><b contenteditable="false">world</b>');
testSingleToggle("strikeThrough", null, '<i>hello</i> <b><strike>world</strike></b> WebKit', '<strike><i>hello</i> <b>world</b> WebKit</strike>');
testSingleToggle("strikeThrough", null, '<b><i>hello <strike>world</strike></i> WebKit</b>', '<b><strike><i>hello world</i> WebKit</strike></b>');

debug('')
debug('styleWithCSS = true')
styleWithCSS = true;
testSingleToggle("fontSize", 4, '<font face="Arial">hello</font>', '<font face="Arial" style="font-size: large;">hello</font>');
testSingleToggle("fontSize", 4, '<font face="Arial"><b>hello</b></font>', '<font face="Arial"><b style="font-size: large;">hello</b></font>');
testSingleToggle("fontSize", 4, '<i><b>hello</b></i>', '<i><b style="font-size: large;">hello</b></i>');
testSingleToggle("fontSize", 4, '<i><b>hello</b> world</i>', '<i style="font-size: large;"><b>hello</b> world</i>');
testSingleToggle("fontSize", 4, '<font color="blue"><b>hello</b></font>', '<font color="blue"><b style="font-size: large;">hello</b></font>');
testSingleToggle("bold", null, '<span style="font-style: italic;">hello</span>', '<span style="font-style: italic; font-weight: bold;">hello</span>');
testSingleToggle("underline", null, '<span style="font-style: italic;"><b>hello</b></span>', '<span style="font-style: italic; text-decoration: underline;"><b>hello</b></span>');
testSingleToggle("underline", null,
    '<span style="color: blue;"><i><span style="font-size: large;"><b>hello</b> world</span></i></span>',
    '<span style="color: blue;"><i><span style="font-size: large; text-decoration: underline;"><b>hello</b> world</span></i></span>');

document.body.removeChild(testContainer);
var successfullyParsed = true;
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>