blob: daee1cd8f45474fd78c7ac9fa479583032003718 [file] [log] [blame]
description("This test performs a check that :valid/:invalid CSS psudo selectors are lively applied.");
// Setup for static elements.
var form = document.createElement('form');
document.body.appendChild(form);
var nonForm = document.createElement('div');
document.body.appendChild(nonForm);
function makeInvalid() {
var i = document.createElement('input');
i.name = 'foo';
i.required = true;
i.value = '';
form.appendChild(i);
return i;
}
function backgroundOf(el) {
return document.defaultView.getComputedStyle(el, null).getPropertyValue('background-color');
}
var elBackground = 'backgroundOf(el)';
var invalidColor = 'rgb(255, 0, 0)';
var normalColor = 'rgb(255, 255, 255)';
var disabledColor = 'rgb(0, 0, 0)';
var validColor = 'rgb(0, 0, 255)';
// --------------------------------
// willValidate change
// --------------------------------
var el = makeInvalid();
// Confirm this element is invalid.
debug('Chheck the initial state:');
shouldBe(elBackground, 'invalidColor');
debug('Change name:');
el.name = '';
shouldBe(elBackground, 'invalidColor');
el.name = 'bar';
shouldBe(elBackground, 'invalidColor');
debug('Change disabled:');
el = makeInvalid();
el.disabled = true;
shouldBe(elBackground, 'disabledColor');
el.disabled = false;
shouldBe(elBackground, 'invalidColor');
debug('Change readOnly:');
el = makeInvalid();
el.readOnly = true;
shouldBe(elBackground, 'normalColor');
el.readOnly = false;
shouldBe(elBackground, 'invalidColor');
debug('Inside/outside of a form:');
el = makeInvalid();
nonForm.appendChild(el);
shouldBe(elBackground, 'invalidColor');
form.appendChild(el);
shouldBe(elBackground, 'invalidColor');
// --------------------------------
// value change
// --------------------------------
debug('Change the value by DOM attribute:');
el = makeInvalid();
el.value = 'abc';
shouldBe(elBackground, 'validColor');
el.value = '';
shouldBe(elBackground, 'invalidColor');
debug('Change the value by DOM attribute for a focused text field:');
el = makeInvalid();
el.focus();
el.value = 'abc';
shouldBe(elBackground, 'validColor');
debug('Change the value by key input:');
el = makeInvalid();
el.focus();
eventSender.keyDown('a');
shouldBe(elBackground, 'validColor');
eventSender.keyDown('\x08', []);
shouldBe(elBackground, 'invalidColor');
// --------------------------------
// Constraints change
// --------------------------------
debug('Change required:');
el = makeInvalid();
el.required = false;
shouldBe(elBackground, 'validColor');
el.required = true;
shouldBe(elBackground, 'invalidColor');
debug('Change pattern:');
el = makeInvalid();
el.value = 'abc';
shouldBe(elBackground, 'validColor');
el.pattern = 'a..c';
shouldBe(elBackground, 'invalidColor');
el.pattern = 'a.c';
shouldBe(elBackground, 'validColor');
debug('Change step:');
el = makeInvalid();
el.value = '1';
el.type = 'number';
shouldBe(elBackground, 'validColor');
el.step = '2';
shouldBe(elBackground, 'invalidColor');
el.step = '0.5';
shouldBe(elBackground, 'validColor');