<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<script>
description('Test if change event fires properly when color chooser changes. Bug 66848 <br> To manually test this, click on the input color element in the top left corner and change the value from the color chooser. See if the number of "value changed" messages matches the number of times you changed the color.');

var input = document.createElement('input');
input.type = 'color';
input.value = '#000000';
document.body.appendChild(input);

input.style.position = 'absolute';
input.style.left = '0';
input.style.top = '0';
input.style.width = '20px';
input.style.height = '20px';

var onChangeCount = 0;
input.onchange = function() {
    debug("change event dispatched - value changed to " + input.value);
    onChangeCount++;
};

input.oninput = function() {
    debug("input event dispatched - value is:  " + input.value);
};

eventSender.mouseMoveTo(10, 10);
eventSender.mouseDown();
eventSender.mouseUp();

shouldBe('onChangeCount', '0');

// input.onchange should be called
internals.selectColorInColorChooser(input, '#ff0000');
shouldBe('onChangeCount', '1');
// input.onchange should not be called
internals.selectColorInColorChooser(input, '#ff0000');
shouldBe('onChangeCount', '1');

shouldBe('input.value', '"#ff0000"');
</script>
</body>
</html>