[JavaScript] Fix JSX interpolation scopes (#4116)

* [JavaScript] Fix interpolation punctuation scope This commit renames `punctuation.definition.interpolation` scope to `punctuation.section.interpolation` to comply with scope naming guidelines. * [JavaScript] Use named contexts for JSX interpolation
sublimehq · Dec 18, 2024 · 27e290d · 27e290d
1 parent 5d34111
commit 27e290d
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 33 deletions.
diff --git a/JavaScript/JSX.sublime-syntax b/JavaScript/JSX.sublime-syntax
@@ -36,31 +36,35 @@ contexts:
       push: jsx-interpolation-plain
 
   jsx-interpolation-comment:
-    - match: '({)(/\*)'
+    - match: ({)(/\*)
       captures:
-        1: punctuation.definition.interpolation.begin.js
+        1: punctuation.section.interpolation.begin.js
         2: punctuation.definition.comment.begin.js
-      set:
-        - meta_include_prototype: false
-        - meta_scope: meta.interpolation.js comment.block.js
-        - match: '(\*/)(})'
-          captures:
-            1: punctuation.definition.comment.end.js
-            2: punctuation.definition.interpolation.end.js
-          pop: 1
-        - match: (?=\*/)
-          fail: jsx-interpolation-comment
+      set: jsx-interpolation-comment-body
+
+  jsx-interpolation-comment-body:
+    - meta_include_prototype: false
+    - meta_scope: meta.interpolation.js comment.block.js
+    - match: (\*/)(})
+      captures:
+        1: punctuation.definition.comment.end.js
+        2: punctuation.section.interpolation.end.js
+      pop: 1
+    - match: (?=\*/)
+      fail: jsx-interpolation-comment
 
   jsx-interpolation-plain:
-    - match: '{'
-      scope: punctuation.definition.interpolation.begin.js
-      set:
-        - - meta_scope: meta.interpolation.js
-          - meta_content_scope: source.js.embedded.jsx
-          - match: '}'
-            scope: punctuation.definition.interpolation.end.js
-            pop: 1
-        - expression
+    - match: \{
+      scope: punctuation.section.interpolation.begin.js
+      set: jsx-interpolation-plain-body
+
+  jsx-interpolation-plain-body:
+    - meta_scope: meta.interpolation.js
+    - meta_content_scope: source.js.embedded.jsx
+    - match: \}
+      scope: punctuation.section.interpolation.end.js
+      pop: 1
+    - include: expressions
 
   jsx-expect-tag-end:
     - meta_content_scope: meta.tag.js

diff --git a/JavaScript/tests/syntax_test_jsx.jsx b/JavaScript/tests/syntax_test_jsx.jsx
@@ -212,18 +212,18 @@
 
     baz={xyzzy}
 //      ^^^^^^^ meta.interpolation
-//      ^ punctuation.definition.interpolation.begin
+//      ^ punctuation.section.interpolation.begin
 //       ^^^^^ source.js.embedded.jsx variable.other.readwrite
-//            ^ punctuation.definition.interpolation.end
+//            ^ punctuation.section.interpolation.end
 
     baz={{ xyzzy:42 }}
 //      ^^^^^^^^^^^^^^ meta.interpolation
-//      ^ punctuation.definition.interpolation.begin
+//      ^ punctuation.section.interpolation.begin
 //       ^^^^^^^^^^^^ source.js.embedded.jsx meta.mapping
 //         ^^^^^ meta.mapping.key
 //              ^ punctuation.separator.key-value
 //               ^^ meta.number.integer.decimal.js constant.numeric.value.js
-//                   ^ punctuation.definition.interpolation.end
+//                   ^ punctuation.section.interpolation.end
 
 
     {...attrs}
@@ -240,7 +240,7 @@
 //        ^^^^^ meta.mapping.key
 //             ^ punctuation.separator.key-value
 //              ^^ meta.number.integer.decimal.js constant.numeric.value.js
-//                  ^ punctuation.definition.interpolation.end
+//                  ^ punctuation.section.interpolation.end
 
     // baz
 //  ^^^^^^ comment.line.double-slash
@@ -278,32 +278,32 @@
 //     ^^^^^ meta.mapping.key
 //          ^ punctuation.separator.key-value
 //           ^^ meta.number.integer.decimal.js constant.numeric.value.js
-//               ^ punctuation.definition.interpolation.end
+//               ^ punctuation.section.interpolation.end
 
     {//}
-//  ^ punctuation.definition.interpolation.begin
+//  ^ punctuation.section.interpolation.begin
 //   ^^^ comment.line.double-slash
 //   ^^ punctuation.definition.comment
 //     ^ - punctuation
     }
-//  ^ punctuation.definition.interpolation.end
+//  ^ punctuation.section.interpolation.end
 
     {/* foo */}
 //  ^^^^^^^^^^^ meta.jsx meta.interpolation comment.block - source.embedded
-//  ^ punctuation.definition.interpolation.begin
+//  ^ punctuation.section.interpolation.begin
 //   ^^ punctuation.definition.comment.begin
 //          ^^ punctuation.definition.comment.end
-//            ^ punctuation.definition.interpolation.end
+//            ^ punctuation.section.interpolation.end
 
     {/* foo */ bar}
 //  ^^^^^^^^^^^^^^^ meta.jsx meta.interpolation
 //   ^^^^^^^^^^^^^ source.js.embedded
-//  ^ punctuation.definition.interpolation.begin - comment
+//  ^ punctuation.section.interpolation.begin - comment
 //   ^^ punctuation.definition.comment.begin
 //          ^^ punctuation.definition.comment.end
 //            ^^^^^ - comment
 //             ^^^ meta.jsx meta.interpolation variable.other.readwrite
-//                ^ punctuation.definition.interpolation.end
+//                ^ punctuation.section.interpolation.end
 
 </foo>;