benbot/nvim-treesitter
1
0
Fork 0
mirror of https://github.com/nvim-treesitter/nvim-treesitter.git synced 2026-07-17 10:50:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(injections): use string_fragment for template literal injections

Browse source 
Template literal injection queries previously captured the entire
`template_string` node with `injection.include-children`, which caused
template substitutions (e.g. `${expr}`) to be included in the injected
language's parse input. This broke highlighting in cases like:

    html`<p class="static ${classMap({ dynamic })} after"></p>`

where the HTML parser's attribute_value node would span across the
template substitution gap, and the lit-html `${` injection query
(in html_tags) would match the buffer text at that range, injecting
JS at the wrong offset.

Two fixes:

1. ecma/injections.scm: capture `string_fragment` nodes instead of
   `template_string`, and use `injection.combined` to merge them. This
   aligns with upstream tree-sitter-javascript's approach. The `#offset!`
   directives are removed since `string_fragment` already excludes the
   backticks.

2. html_tags/injections.scm: anchor the lit-html `${` pattern with `^`
   so it only matches attribute values that *start* with `${`, not
   attribute values whose buffer text happens to contain `${` in the
   middle (which occurs when the attribute_value node spans a template
   substitution gap).

Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benny Powers 2026-03-28 22:04:12 +03:00
parent 7caec274fd
commit 605ba7428f
2 changed files with 59 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

110
runtime/queries/ecma/injections.scm
View file

@ -10,12 +10,13 @@
function: (identifier) @injection.language function: (identifier) @injection.language
arguments: [ arguments: [
(arguments (arguments
(template_string) @injection.content) (template_string
(template_string) @injection.content (string_fragment) @injection.content))
(template_string
(string_fragment) @injection.content)
] ]
(#lua-match? @injection.language "^[a-zA-Z][a-zA-Z0-9]*$") (#lua-match? @injection.language "^[a-zA-Z][a-zA-Z0-9]*$")
(#offset! @injection.content 0 1 0 -1) (#set! injection.combined)
(#set! injection.include-children)
; Languages excluded from auto-injection due to special rules ; Languages excluded from auto-injection due to special rules
; - svg uses the html parser ; - svg uses the html parser
; - css uses the styled parser ; - css uses the styled parser
@ -27,11 +28,12 @@
(#eq? @_name "svg") (#eq? @_name "svg")
arguments: [ arguments: [
(arguments (arguments
(template_string) @injection.content) (template_string
(template_string) @injection.content (string_fragment) @injection.content))
(template_string
(string_fragment) @injection.content)
] ]
(#offset! @injection.content 0 1 0 -1) (#set! injection.combined)
(#set! injection.include-children)
(#set! injection.language "html")) (#set! injection.language "html"))
; Vercel PostgreSQL ; Vercel PostgreSQL
@ -41,12 +43,13 @@
property: (property_identifier) @injection.language) property: (property_identifier) @injection.language)
arguments: [ arguments: [
(arguments (arguments
(template_string) @injection.content) (template_string
(template_string) @injection.content (string_fragment) @injection.content))
(template_string
(string_fragment) @injection.content)
] ]
(#eq? @injection.language "sql") (#eq? @injection.language "sql")
(#offset! @injection.content 0 1 0 -1) (#set! injection.combined))
(#set! injection.include-children))
; Sanity CMS GROQ query ; Sanity CMS GROQ query
; defineQuery(`...`) ; defineQuery(`...`)
@ -54,9 +57,9 @@
function: (identifier) @_name function: (identifier) @_name
(#eq? @_name "defineQuery") (#eq? @_name "defineQuery")
arguments: (arguments arguments: (arguments
(template_string) @injection.content) (template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content))
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "groq")) (#set! injection.language "groq"))
; gql`...` or gql(`...`) ; gql`...` or gql(`...`)
@ -65,28 +68,29 @@
(#eq? @_name "gql") (#eq? @_name "gql")
arguments: [ arguments: [
(arguments (arguments
(template_string) @injection.content) (template_string
(template_string) @injection.content (string_fragment) @injection.content))
(template_string
(string_fragment) @injection.content)
] ]
(#offset! @injection.content 0 1 0 -1) (#set! injection.combined)
(#set! injection.include-children)
(#set! injection.language "graphql")) (#set! injection.language "graphql"))
(call_expression (call_expression
function: (identifier) @_name function: (identifier) @_name
(#eq? @_name "hbs") (#eq? @_name "hbs")
arguments: (template_string) @injection.content arguments: (template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "glimmer")) (#set! injection.language "glimmer"))
; css`<css>`, keyframes`<css>` ; css`<css>`, keyframes`<css>`
(call_expression (call_expression
function: (identifier) @_name function: (identifier) @_name
(#any-of? @_name "css" "keyframes") (#any-of? @_name "css" "keyframes")
arguments: (template_string) @injection.content arguments: (template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "styled")) (#set! injection.language "styled"))
; styled.div`<css>` ; styled.div`<css>`
@ -94,9 +98,9 @@
function: (member_expression function: (member_expression
object: (identifier) @_name object: (identifier) @_name
(#eq? @_name "styled")) (#eq? @_name "styled"))
arguments: ((template_string) @injection.content arguments: ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "styled"))) (#set! injection.language "styled")))
; styled(Component)`<css>` ; styled(Component)`<css>`
@ -104,9 +108,9 @@
function: (call_expression function: (call_expression
function: (identifier) @_name function: (identifier) @_name
(#eq? @_name "styled")) (#eq? @_name "styled"))
arguments: ((template_string) @injection.content arguments: ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "styled"))) (#set! injection.language "styled")))
; styled.div.attrs({ prop: "foo" })`<css>` ; styled.div.attrs({ prop: "foo" })`<css>`
@ -116,9 +120,9 @@
object: (member_expression object: (member_expression
object: (identifier) @_name object: (identifier) @_name
(#eq? @_name "styled")))) (#eq? @_name "styled"))))
arguments: ((template_string) @injection.content arguments: ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "styled"))) (#set! injection.language "styled")))
; styled(Component).attrs({ prop: "foo" })`<css>` ; styled(Component).attrs({ prop: "foo" })`<css>`
@ -128,9 +132,9 @@
object: (call_expression object: (call_expression
function: (identifier) @_name function: (identifier) @_name
(#eq? @_name "styled")))) (#eq? @_name "styled"))))
arguments: ((template_string) @injection.content arguments: ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "styled"))) (#set! injection.language "styled")))
((regex_pattern) @injection.content ((regex_pattern) @injection.content
@ -140,10 +144,10 @@
; (#eq? @_gql_comment "/* GraphQL */") ; (#eq? @_gql_comment "/* GraphQL */")
; (template_string) @injection.content ; (template_string) @injection.content
; (#set! injection.language "graphql")) ; (#set! injection.language "graphql"))
((template_string) @injection.content ((template_string
(#lua-match? @injection.content "^`#graphql") (string_fragment) @injection.content)
(#offset! @injection.content 0 1 0 -1) (#lua-match? @injection.content "^#graphql")
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "graphql")) (#set! injection.language "graphql"))
; el.innerHTML = `<html>` ; el.innerHTML = `<html>`
@ -151,9 +155,9 @@
left: (member_expression left: (member_expression
property: (property_identifier) @_prop property: (property_identifier) @_prop
(#any-of? @_prop "outerHTML" "innerHTML")) (#any-of? @_prop "outerHTML" "innerHTML"))
right: (template_string) @injection.content right: (template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "html")) (#set! injection.language "html"))
; el.innerHTML = '<html>' ; el.innerHTML = '<html>'
@ -178,9 +182,9 @@
(pair (pair
key: ((property_identifier) @_prop key: ((property_identifier) @_prop
(#eq? @_prop "template")) (#eq? @_prop "template"))
value: ((template_string) @injection.content value: ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "angular"))))))) (#set! injection.language "angular")))))))
; @Component({ ; @Component({
@ -196,9 +200,9 @@
key: ((property_identifier) @_prop key: ((property_identifier) @_prop
(#eq? @_prop "styles")) (#eq? @_prop "styles"))
value: (array value: (array
((template_string) @injection.content ((template_string
(#offset! @injection.content 0 1 0 -1) (string_fragment) @injection.content)
(#set! injection.include-children) (#set! injection.combined)
(#set! injection.language "css")))))))) (#set! injection.language "css"))))))))
; @Component({ ; @Component({
@ -213,7 +217,7 @@
(pair (pair
key: ((property_identifier) @_prop key: ((property_identifier) @_prop
(#eq? @_prop "styles")) (#eq? @_prop "styles"))
value: ((template_string) @injection.content value: ((template_string
(#set! injection.include-children) (string_fragment) @injection.content)
(#offset! @injection.content 0 1 0 -1) (#set! injection.combined)
(#set! injection.language "css"))))))) (#set! injection.language "css")))))))

4
runtime/queries/html_tags/injections.scm
View file

@ -81,13 +81,13 @@
((attribute ((attribute
(quoted_attribute_value (quoted_attribute_value
(attribute_value) @injection.content)) (attribute_value) @injection.content))
(#lua-match? @injection.content "%${") (#lua-match? @injection.content "^%${")
(#offset! @injection.content 0 2 0 -1) (#offset! @injection.content 0 2 0 -1)
(#set! injection.language "javascript")) (#set! injection.language "javascript"))
((attribute ((attribute
(attribute_value) @injection.content) (attribute_value) @injection.content)
(#lua-match? @injection.content "%${") (#lua-match? @injection.content "^%${")
(#offset! @injection.content 0 2 0 -2) (#offset! @injection.content 0 2 0 -2)
(#set! injection.language "javascript")) (#set! injection.language "javascript"))