Using DocumentFragment with document.evaluate()

when using a template tag

<template>
            <div>test</div>
            <div>{{text}}</div>
</template>

and then creating an instance of it with
document.querySelector("template").cloneNode(true)
you get a template instance with .content being a document-fragment of all the children of the original template

now if i want to query the elements in this document-fragment for changes for example for variable replacement (only returning those whose textContent ends and start with brackets in this case)
my prefered way of doing this would be using document.evaluate with the contextNode being the document fragment ,
document.evaluate('.//*[ starts-with(text(),'{{')]',contextNode, null, XPathResult.ANY_TYPE,null )

// omitted ends-with as it is quite the lengthy code as xpath in the browser is only v1.0 but thats a differnet matter 😅

unfortunately when doing this i get an error that document-fragment is not a valid node :thinking: and well ... i wanna know why it isnt :innocent:
uncaught DOMException: Failed to execute 'evaluate' on 'Document': The node provided is '#document-fragment', which is not a valid context node type.

DocumentFragment and everything DOM-related is not part of JavaScript, it's part of HTML, so this isn't the right place to discuss it. See html/CONTRIBUTING.md at 823a14b4353266c7885c7b06da0d6ba1e4f1bb20 · whatwg/html · GitHub