button-type-change.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../../../resources/js-test.js"></script>
</head>
<body onload="runTests()">
<script>

description("Tests for <a href=\"https://bugs.webkit.org/show_bug.cgi?id=14439\"> \
bug 14439</a>. Button type should be set using el.type.");

var didSubmit = false;
var btn;
var txt;

function testTypeValue()
{
    btn = document.getElementById("b");

    shouldBe("btn.type = 'submit'; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'submit'");
    
    shouldBe("btn.type = 'reset'; btn.type", "'reset'");
    shouldBe("btn.getAttribute('type')", "'reset'");
    
    shouldBe("btn.type = 'button'; btn.type", "'button'");
    shouldBe("btn.getAttribute('type')", "'button'");
    
    shouldBe("btn.type = 'reset'; btn.type", "'reset'");
    shouldBe("btn.getAttribute('type')", "'reset'");
    
    shouldBe("btn.type = 'suBmiT'; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'suBmiT'");
    
    shouldBe("btn.type = ''; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "''");
    
    shouldBe("btn.type = 'b'; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'b'");
    
    shouldBe("btn.type = 'RESET'; btn.type", "'reset'");
    shouldBe("btn.getAttribute('type')", "'RESET'");
    
    shouldBe("btn.type = ''; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "''");
    
    shouldBe("btn.type = '/'; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'/'");
    
    shouldBe("btn.type = ' '; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "' '");
    
    shouldBe("btn.type = 'button '; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'button '");
    
    shouldBe("btn.type = ' b u t t o n '; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "' b u t t o n '");
    
    shouldBe("btn.type = null; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'null'");
    
    shouldBe("btn.type = undefined; btn.type", "'submit'");
    shouldBe("btn.getAttribute('type')", "'undefined'");
}

function testTypeBehavior()
{
    btn = document.getElementById("b");
    txt = document.getElementById("t");

    btn.type = "submit";
    txt.value = "hello";

    shouldBe("btn.type = 'reset'; txt.value = 'hello'; btn.click(); txt.value", "''");
    shouldBe("didSubmit", "false");
    shouldBe("btn.type = 'button'; txt.value = 'hello'; btn.click(); txt.value", "'hello'");
}

function testSubmitBehavior()
{
    shouldBe("btn.type = 'submit'; btn.click(); didSubmit", "true");
    didSubmit = false;
    txt.value = "";
}

function formWasSubmitted()
{
    didSubmit = true;
}

function runTests()
{
    testTypeValue();
    testTypeBehavior();
    testSubmitBehavior();
    
    wasPostTestScriptParsed = true;

    if (window.jsTestIsAsync) {
        if (window.testRunner)
            testRunner.waitUntilDone();
        if (window.wasFinishJSTestCalled)
            finishJSTest();
    } else
        finishJSTest();
    }
</script>
<form id="f" action="#submitted" onsubmit="formWasSubmitted();">
  <input id="t" type="text" />
  <button id="b"></button>
</form>
</body>
</html>
chromium/third_party/blink/web_tests/fast/forms/button/button-type-change.html
