2

One problem stopping Mobiscroll calendar working inside a LWC? is described in the PS to that question. An equivalent of element.matches (AKA element.matchesSelector) needs to be implemented for an LWC LightningElement, as neither of those methods is supported. There is also no parentNode property and AFAIK you can't access the document. These restrictions block the common polyfill and its parentNode equivalent.

So I'm starting to form the opinion that there is no way to implement element.matches logic applied to an LWC LightningElement given the access restrictions. Is there a way?

2 Answers 2

2

An LWC effectively has a document fragment within its "template". Given that you can access the this.template to access the rendered fragment for the LWC - albeit without the content of child components, which is hidden in those components' shadow DOMs. The template then provides you access to running selector-based queries using this.template.querySelectorAll.

It seems to me all you then have to do is see if the given element is a member of the node set returned by that call to determine whether it matches the selector.

If that doesn't work for you, please explain more here what you're trying to do (I must say I didn't read all the other linked items! Lazy me...)

2
  • HI Phil, May well be that starting from the template is the answer. Will try that tomorrow. Thanks!
    – Keith C
    Commented Jan 6, 2020 at 22:16
  • Breakpointing in the Mobiscroll JavaScript, element.toString() returns "SecureElement: [object HTMLInputElement]{ key: {"namespace":"cvnp"} }" which based on this documentation blocks access to any extra @api method added to the component or external code access to the template. Understandable from a security viewpoint, but I think blocks this approach.
    – Keith C
    Commented Jan 7, 2020 at 10:43
0

Based on my hacking around in the JavaScript debugger, the answer is no.

Real Phil W's answer and my comments there for more info.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .