Click event on label should be prevented if its child input element is disabled

[polendri]

Related to DevExpress/testcafe-hammerhead#1880, where a fix was added to prevent mouse events on elements that have the disabled attribute set (or that have an ancestor for which it's set).

There's an edge case which wasn't considered: it's semantically correct to have a <label> element which contains its related input element, and in this case mouse events on the <label> should be prevented if the input is disabled.

Example:

<label>Do you like peas?
  <input type="checkbox" disabled name="peas">
</label>

In TestCafe 1.0.0 (hammerhead 14.4.12 based on my package-lock.json), this works as expected in Chrome, Edge and IE, but Firefox incorrectly triggers a click event on a label such as the one above. Firefox does not do this when manually clicking the label, so it's specific to Hammerhead.

[LavrovArtem]

Thank you for this information! I've reproduced this issue.

[polendri]

Thanks for the prompt response/prioritization!

One more situation that causes this issue: <label> has a for attribute which links it to an <input> element, and browser behaviour is to supress click events on the <label> if its for attribute points to a disabled input element. So a click on the <label> in this example should also not trigger an event:

<label for="peas-input">Do you like peas?</label>
<input id="peas-input" type="checkbox" disabled name="peas">

[LavrovArtem]

Thank you for the additional information. It is very helpful.

[AlexKamaev]

Please also take a look at #2902

[pingviini]

I believe this issue relates also to a following scenario where you have link inside checkbox label. E.g. in my case I have following piece of html:

<div class="checkbox">
  <input
    id="terms-and-conditions"
    type="checkbox"
  >
  <label for="terms-and-conditions">
    I have read and accept
    <a class="terms-and-conditions-link" href="#" onclick="alert('Alert');">
      terms and conditions.
    </a>
  </label>
</div>

Clicking that link manually with Firefox or Chrome won't check that checkbox. When running tests with Testcafe & Chrome checkbox gets checked from clicking that link. Same won't happen with Testcafe & Firefox.