<!DOCTYPE html>
<html>
<head>
    <script src="../../resources/js-test-pre.js"></script>
<style>
    .underline_important {
        text-decoration: underline !important;
    }
    .linethrough_important{
        text-decoration: line-through !important;
    }

    .underline_decoration {
        text-decoration: underline;
    }
    .linethrough_decoration{
        text-decoration: line-through;
    }
</style>
</head>
<body>
<script>
description('Test to make sure we return correct text-decoration state on applying different command.');

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

function textdecorationState(decoration, content, command)
{
    testContainer.innerHTML = content;
    var target = document.getElementById('e');
    var selection = window.getSelection();
    var range = document.createRange();
    range.setStart(target, 0);
    range.setEnd(target, 1);
    target.focus();
    selection.removeAllRanges();
    selection.addRange(range);
    document.execCommand(command, false, null);

    return document.queryCommandState(decoration);
}

//!important
shouldBe('textdecorationState("underline","<span id=e style=\'text-decoration: none !important;\'>hello world</span>", "underline")', 'false');
shouldBe('textdecorationState("underline","<span id=e style=\'text-decoration: underline !important;\'>hello world</span>", "underline")', 'true');
shouldBe('textdecorationState("strikeThrough","<span id=e style=\'text-decoration: underline !important;\'>hello world</span>", "strikethrough")', 'false');
shouldBe('textdecorationState("strikeThrough","<span style=\'text-decoration: underline !important;\'><em id=e>hello world</em></span>", "strikethrough")', 'true');
shouldBe('textdecorationState("underline","<span id=e class=\'underline_important\'>hello world</span>", "removeFormat")', 'true');
shouldBe('textdecorationState("strikeThrough","<span id=e class=\'linethrough_important\'>hello world</span>", "removeFormat")', 'true');
shouldBe('textdecorationState("underline","<u><span id=e style=\'text-decoration: underline !important;\'>hello world</span></u>", "underline")', 'false');

//general
shouldBe('textdecorationState("underline","<span id=e style=\'text-decoration: none;\'>hello world</span>", "underline")', 'true');
shouldBe('textdecorationState("underline","<span id=e style=\'text-decoration: underline;\'>hello world</span>", "underline")', 'false');
shouldBe('textdecorationState("strikeThrough","<span id=e style=\'text-decoration: underline;\'>hello world</span>", "strikethrough")', 'true');
shouldBe('textdecorationState("strikeThrough","<span style=\'text-decoration: underline;\'><em id=e>hello world</em></span>", "strikethrough")', 'true');
shouldBe('textdecorationState("underline","<span id=e  class=\'underline_decoration\'>hello world</span>", "removeFormat")', 'false');
shouldBe('textdecorationState("strikeThrough","<span id=e class=\'linethrough_decoration\'>hello world</span>", "removeFormat")', 'true');

shouldBe('textdecorationState("underline","<span id=e style=\'text-decoration: underline;\'>hello world</span>", "removeFormat")', 'false');
shouldBe('textdecorationState("underline","<span id=e>hello world</span>", "underline")', 'true');

shouldBe('textdecorationState("underline","<u><span id=e>hello world</span></u>", "underline")', 'false');
shouldBe('textdecorationState("underline","<u><span id=e style=\'text-decoration: underline;\'>hello world</span></u>", "underline")', 'false');

document.body.removeChild(testContainer);

var successfullyParsed = true;
</script>
</body>
</html>