Basic info:
- Node.js version: 8.12.0
- jsdom version: 12.0.0
I've read through the WhatWG spec, and I think this is true:
Dispatching a MoustEvent of type click on a child element of a label should cause the first labeled control to toggle checkedness. (If clicking a label normally causes this behavior)
This is implemented inconsistently between browsers. Chrome 69, Safari 11.1.2, IE 11 toggle the inputs checked value, Firerfox 62 does not.
From reading the specs, this is what I understand:
click() dispatches a MouseEvent with type click on the target element (div)
- div does not have activation behavior, so activationTarget is null
- parent node (label) has activation behavior, activationTarget is set to parent (label)
- Run activation behavior of activationTarget
Minimal reproduction case
const { JSDOM } = require('jsdom');
var dom = new JSDOM('\
<!DOCTYPE html>\
<html>\
<body>\
<label><div /><input type="checkbox"></label>\
</body>\
</html>\
');
var div = dom.window.document.querySelector('div');
var input = dom.window.document.querySelector('input');
var label = dom.window.document.querySelector('label')
label.click()
console.log('expecting true, actual', input.checked); // actual = true
div.click();
console.log('expecting false, actual', input.checked); // actual = true
How does similar code behave in browsers?
Input checkedness is toggled in most browsers (https://jsfiddle.net/4x0tjLms/5/).
Input checkedness is not toggled in Firerfox 62, but Firefox does not toggle checkedness when click is called on a label with labeled control. JSDOM does toggle checkedness when click is called on label with a labeled control.
Basic info:
I've read through the WhatWG spec, and I think this is true:
Dispatching a MoustEvent of type
clickon a child element of a label should cause the first labeled control to toggle checkedness. (If clicking a label normally causes this behavior)This is implemented inconsistently between browsers. Chrome 69, Safari 11.1.2, IE 11 toggle the inputs checked value, Firerfox 62 does not.
From reading the specs, this is what I understand:
click()dispatches a MouseEvent with typeclickon the target element (div)Minimal reproduction case
How does similar code behave in browsers?
Input checkedness is toggled in most browsers (https://jsfiddle.net/4x0tjLms/5/).
Input checkedness is not toggled in Firerfox 62, but Firefox does not toggle checkedness when
clickis called on a label with labeled control. JSDOM does toggle checkedness whenclickis called on label with a labeled control.