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