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 
and well ... i wanna know why it isnt 
uncaught DOMException: Failed to execute 'evaluate' on 'Document': The node provided is '#document-fragment', which is not a valid context node type.