SnapLinks doen't work in checkbox with pointer-events none

[matheusroberson]

Hi,

While testing SnapLinks, I noticed an issue related to checkboxes that have pointer-events: none.

Observed behavior

• A checkbox with pointer-events: none is not detected/selected by SnapLinks.
• However, if the same checkbox is wrapped inside a <label> element, SnapLinks works as expected.

Minimal example

<input checked type="checkbox" value="0" style="pointer-events: none;">
Checkbox with pointer-events: none
<br>

<label>
  <input checked type="checkbox" value="0" style="pointer-events: none;">
  Checkbox with pointer-events: none inside a label
</label>

Possible cause

The issue may be related to this condition in content-scripts/ElementIndexer.js:

if (elPoint != elem && !elem.contains(elPoint) && elPoint.tagName !== 'LABEL')

Reproducible demo

https://codesandbox.io/p/sandbox/funny-elion-wqpf2r

Additional notes

• I'm happy to help investigate or test potential fixes if needed.
• I was testing 3.1.16 version

[cpriest]

Interesting, I wonder if this is W3C intended effects (like it hides INPUT[type=checkbox] from doc requests. Nothing in SnapLinks should be excluding this.

[matheusroberson]

You're probably right about the W3C spec, but it would be nice to have a fallback to handle these cases (pointer-events: none), which are very common nowadays for custom-styled checkboxes or layered links.