Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test gets skipped with pattern: os == 'android' OR apple_catalina OR apple_silicon
- Manifest: dom/html/test/mochitest.toml
<!DOCTYPE HTML>
<html>
<!--
-->
<head>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=615697">Mozilla Bug 615697</a>
<p id="display"></p>
<div id="content">
<input>
<textarea></textarea>
<input type='radio'>
<input type='checkbox'>
<select>
<option>foo</option>
<option>bar</option>
</select>
<select multiple size='1'>
<option>tulip</option>
</select>
</div>
<pre id="test">
<script type="application/javascript">
/**
* This test is making all elements trigger 'change' event.
* You should read the test from bottom to top:
* events are registered from the last one to the first one.
*
* Sometimes, elements are focused before a click. This might sound useless
* but it guarantees to have the element visible before simulating the click.
*/
var input = document.getElementsByTagName('input')[0];
var textarea = document.getElementsByTagName('textarea')[0];
var radio = document.getElementsByTagName('input')[1];
var checkbox= document.getElementsByTagName('input')[2];
var select = document.getElementsByTagName('select')[0];
var selectMultiple = document.getElementsByTagName('select')[1];
function checkChangeEvent(aEvent)
{
ok(aEvent.bubbles, "change event should bubble");
ok(!aEvent.cancelable, "change event shouldn't be cancelable");
}
selectMultiple.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
SimpleTest.finish();
}, {once: true});
selectMultiple.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
synthesizeMouseAtCenter(selectMultiple, {});
});
}, {once: true});
select.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
selectMultiple.focus();
}, {once: true});
select.addEventListener("keyup", function() {
select.blur();
}, {once: true});
select.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
synthesizeKey("KEY_ArrowDown");
});
}, {once: true});
checkbox.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
select.focus();
}, {once: true});
checkbox.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
synthesizeMouseAtCenter(checkbox, {});
});
}, {once: true});
radio.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
checkbox.focus();
}, {once: true});
radio.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
synthesizeMouseAtCenter(radio, {});
});
}, {once: true});
textarea.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
radio.focus();
}, {once: true});
textarea.addEventListener("input", function() {
textarea.blur();
}, {once: true});
textarea.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
sendString("f");
});
}, {once: true});
input.addEventListener("change", function(aEvent) {
checkChangeEvent(aEvent);
textarea.focus();
}, {once: true});
input.addEventListener("input", function() {
input.blur();
}, {once: true});
input.addEventListener("focus", function() {
SimpleTest.executeSoon(function () {
sendString("f");
});
}, {once: true});
SimpleTest.waitForExplicitFinish();
SimpleTest.waitForFocus(function() {
input.focus();
});
</script>
</pre>
</body>
</html>