Best way to find position where sub-language tree begins?

Hello. I don’t have much experience with CodeMirror yet, but I love it. I am using CM as part of a simple online IDE.

I would like to access the syntax trees generated by Lezer. For example, I want to access the syntax tree inside an HTML element’s “style” attribute.

I have been playing around with TreeCursor and SyntaxNodes, and I found that: when I get to an AttributeName node and determine that it’s a “style” attribute, I can dig into that node and and find the offset where the sub-language tree starts. Something like this:

node._tree._tree.props[6].overlay[0]

By adding the above object’s “from” value to node’s “from” value, I get an offset I can pass to resolveInner (on the tree returned by syntaxTree(state)).

So, I think I can do what I want in the way I described. I’m just curious, is this a reasonable way to go about this? Is there a better way that I am missing? Thank you!

That’s using several non-public properties and an unpredictable ID value, so no, absolutely not safe. Use node.tree?.prop(NodeProp.mounted) instead. Generally, you don’t want to go poking around objects in the devtools and use whatever properties you find, but rather use the TypeScript types and project docs to figure out how to use the library’s datatypes.

1 Like

Yeah, I had a feeling.

Awesome, thank you!