83533 2012-04-09 18:38:00 -0700 html5test.com: input type=color - Field validation fails 2012-07-09 18:23:46 -0700 1 1 1 Unclassified WebKit Forms 528+ (Nightly build) Unspecified Unspecified RESOLVED FIXED http://html5test.com/index.html P2 Normal --- 40829 1 tkent tkent syoichi oldest_to_newest 598845 0 tkent 2012-04-09 18:38:00 -0700 It fails with Google Chrome 20.0.1096.1 OSX and Windows. I don't know why it fails. We need to investigate what is tested. 598883 1 keishi 2012-04-09 19:06:44 -0700 Hmm. Opera 11(Mac) failed too. It seems to be testing element.validity.valid //engine.js validation = true; element.field.value = "foo"; validation &= !element.field.validity.valid element.field.value = '#000000'; validation &= element.field.validity.valid 598894 2 tkent 2012-04-09 19:14:36 -0700 (In reply to comment #1) > validation = true; > > element.field.value = "foo"; > validation &= !element.field.validity.valid > > element.field.value = '#000000'; > validation &= element.field.validity.valid Does the 'element' have the required attribute? 598899 3 keishi 2012-04-09 19:17:57 -0700 (In reply to comment #2) > Does the 'element' have the required attribute? No. Here is the whole section /* input type=color */ var group = this.section.getGroup({ id: 'color' }); var element = this.createInput('color'); element.field.value = "foobar"; var sanitization = element.field.value != 'foobar'; var validation = false; if ('validity' in element.field) { validation = true; element.field.value = "foo"; validation &= !element.field.validity.valid element.field.value = '#000000'; validation &= element.field.validity.valid } group.setItem({ id: 'element', passed: element.field.type == 'color', value: 2 }); group.setItem({ id: 'ui', passed: baseline.field != getRenderedStyle(element.field) || baseline.wrapper != getRenderedStyle(element.wrapper), value: 2 }); group.setItem({ id: 'sanitization', passed: sanitization, required: true }); group.setItem({ id: 'validation', passed: validation, required: true }); this.removeInput(element); 598900 4 keishi 2012-04-09 19:18:36 -0700 createInput: function(type) { var wrapper = document.createElement('div'); document.body.appendChild(wrapper) var field = document.createElement('input'); wrapper.appendChild(field); try { field.setAttribute('type', type); } catch(e) { } /* Make sure our field is position absolutely for CSS style comparison */ wrapper.style.position = 'absolute'; wrapper.style.display = 'inline-block'; wrapper.style.top = '0px'; wrapper.style.left = '0px'; return { field: field, wrapper: wrapper }; }, 598901 5 tkent 2012-04-09 19:19:30 -0700 Oh, I remember the color type doesn't support the required attribute, and "foo" should be sanitized to "#000000". It seems the test is incorrect. 598934 6 tkent 2012-04-09 20:01:16 -0700 I'll contact the author of html5test.com. 598955 7 tkent 2012-04-09 20:41:09 -0700 I made a pull request: https://github.com/NielsLeenheer/html5test/pull/131 665378 8 tkent 2012-07-09 18:23:46 -0700 Will be fixed in the next release of html5test; http://alpha.html5test.com/