Below is your official invite to view a mindbending bug solved by our guru-in-residence, @saqimtiaz
Lesson to all (and those choosing not to read the whole bug), if you’re using $eventcatcher and trapping clicks bubbling up from <$button><svg>.../> constructs, you might want to add this somewhere “global” in you CSS:
button svg{
pointer-events: none;
}
Thanks again to @saqimtiaz ← lifesaver.
opened 11:35PM - 27 Nov 23 UTC
closed 09:32PM - 28 Nov 23 UTC
### Describe the bug
This code...
```javascript
while(!$tw.utils.domMatches… Selector(selectedNode,selector) && selectedNode !== domNode) {
selectedNode = selectedNode.parentNode;
}
```
cannot find the ancestor(s) of
```text
\define sv-prev-section-btn()
<$button actions=<<sv-prev-section-btn-actions>> class="tc-btn-invisible sv-prev-section-btn"
tooltip="View the previous section in this chapter">{{$:/core/images/left-arrow}}</$button>
\end
\define sv-next-section-btn()
<$button actions=<<sv-next-section-btn-actions>> class="tc-btn-invisible sv-next-section-btn"
tooltip="View the next section in this chapter">{{$:/core/images/right-arrow}}</$button>
\end
```
If I replace the svg images with X and Y, $eventcatcher works fine. With svg images in place, RSOE "node is null" on the first attempt at getting parentNode and calling into
```
exports.domMatchesSelector = function(node,selector) {
return node.matches ? node.matches(selector) : node.msMatchesSelector(selector);
};
```
`node` (i.e. `selectedNode` in the caller's context) becomes null.
Here's the relevant part of the DOM:
### Expected behavior
DOM walking code should work?
### To Reproduce
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
### Screenshots
_No response_
### TiddlyWiki Configuration
- Version 5.3.1
- OS: Win10
- Browser FF latest
### Additional context
Probably irrelevant but something in the same area of the core gave similar trouble recently (now seemingly cured).
https://talk.tiddlywiki.org/t/erroneous-domexception-in-dom-js/8478
