[HTML] Add support for mime type completions (#4061)

This commit... 1. scopes `type="..."` attributes with unique `meta.attribute-with-value.type` 2. adds basic completions for known mime types. This change is probably of lower importance for basic HTML, but this change may help improving DX for template languages, which support more mime types like TypeScript, LiveScript, Babel, CoffeScript, ... .
sublimehq · Oct 22, 2024 · 8aecabd · 8aecabd
1 parent 76069dc
commit 8aecabd
Show file tree

Hide file tree

Showing 9 changed files with 145 additions and 32 deletions.
diff --git a/ASP/HTML (ASP).sublime-syntax b/ASP/HTML (ASP).sublime-syntax
@@ -105,12 +105,12 @@ contexts:
     - include: script-lang-attribute
 
   script-lang-attribute:
-    - match: (?i:language){{attribute_name_break}}
-      scope: meta.attribute-with-value.html entity.other.attribute-name.html
+    - match: (?i:lang(?:uage)?){{attribute_name_break}}
+      scope: meta.attribute-with-value.lang.html entity.other.attribute-name.html
       set: script-lang-attribute-assignment
 
   script-lang-attribute-assignment:
-    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.lang.html
     - match: =
       scope: punctuation.separator.key-value.html
       set: script-lang-attribute-value
@@ -119,37 +119,42 @@ contexts:
 
   script-lang-attribute-value:
     - meta_include_prototype: false
-    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.lang.html
     - include: script-lang-decider
 
   script-lang-decider:
     - match: (?={{jscript_lang}}{{unquoted_attribute_break}}|'{{jscript_lang}}'|"{{jscript_lang}}")
       set:
         - script-javascript
-        - tag-generic-attribute-meta
+        - tag-lang-attribute-meta
         - tag-generic-attribute-value
     - match: (?={{vbscript_lang}}{{unquoted_attribute_break}}|'{{vbscript_lang}}'|"{{vbscript_lang}}")
       set:
         - script-vbscript
-        - tag-generic-attribute-meta
+        - tag-lang-attribute-meta
         - tag-generic-attribute-value
     - match: (?=>|''|"")
       set:
         - script-vbscript
-        - tag-generic-attribute-meta
+        - tag-lang-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
       set:
         - script-other
-        - tag-generic-attribute-meta
+        - tag-lang-attribute-meta
         - tag-generic-attribute-value
 
+  tag-lang-attribute-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.lang.html
+    - include: immediately-pop
+
   script-type-decider:
     - meta_prepend: true
     - match: (?={{vbscript_mime_type}}{{unquoted_attribute_break}}|'{{vbscript_mime_type}}'|"{{vbscript_mime_type}}")
       set:
         - script-vbscript
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
 
   script-javascript-content:

diff --git a/ASP/Script Lang Values.sublime-completions b/ASP/Script Lang Values.sublime-completions
@@ -0,0 +1,25 @@
+{
+	"scope": "text.html.asp meta.tag.script meta.attribute-with-value.lang",
+	"completions": [
+		{
+			"trigger": "js",
+			"kind": ["type", "t", "Language Type"],
+			"details": "JavaScript"
+		},
+		{
+			"trigger": "jscript",
+			"kind": ["type", "t", "Language Type"],
+			"details": "JavaScript"
+		},
+		{
+			"trigger": "vb",
+			"kind": ["type", "t", "Language Type"],
+			"details": "VisualBasicScript"
+		},
+		{
+			"trigger": "vbscript",
+			"kind": ["type", "t", "Language Type"],
+			"details": "VisualBasicScript"
+		}
+	]
+}
diff --git a/ASP/Script Type Values.sublime-completions b/ASP/Script Type Values.sublime-completions
@@ -0,0 +1,15 @@
+{
+	"scope": "text.html.asp meta.tag.script meta.attribute-with-value.type",
+	"completions": [
+		{
+			"trigger": "application/vbscript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "Visual Basic Script"
+		},
+		{
+			"trigger": "text/vbscript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "Visual Basic Script"
+		}
+	]
+}
diff --git a/ASP/syntax_test_asp.asp b/ASP/syntax_test_asp.asp
@@ -84,6 +84,7 @@
 
     <script language="jscript"> var foo = 0 </script>
     ' ^^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+    '       ^^^^^^^^^^^^^^^^^^ meta.attribute-with-value.lang.html
     '                          ^^^^^^^^^^^^^ source.js.embedded.html - meta.tag
     '                                       ^^^^^^^^^ meta.tag - source
 
@@ -104,16 +105,19 @@
 
     <script language="vbscript"> Dim var = 0 </script>
     ' ^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+    '       ^^^^^^^^^^^^^^^^^^^ meta.attribute-with-value.lang.html
     '                           ^^^^^^^^^^^^^ source.asp.embedded.html - meta.tag
     '                                        ^^^^^^^^^ meta.tag - source
 
     <script type="vbscript"> Dim var = 0 </script>
     ' ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+    '       ^^^^^^^^^^^^^^^ meta.attribute-with-value.type.html
     '                       ^^^^^^^^^^^^^ source.asp.embedded.html - meta.tag
     '                                    ^^^^^^^^^ meta.tag - source
 
     <script type="vbscript"> Dim var = 0 --> </script>
     ' ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+    '       ^^^^^^^^^^^^^^^ meta.attribute-with-value.type.html
     '                       ^^^^^^^^^^^^^ source.asp.embedded.html - meta.tag
     '                                    ^^^^ - meta.tag - source
     '                                    ^^^ comment.block.html punctuation.definition.comment.end.html

diff --git a/HTML/HTML.sublime-syntax b/HTML/HTML.sublime-syntax
@@ -402,12 +402,12 @@ contexts:
 
   script-type-attribute:
     - match: (?i:type){{attribute_name_break}}
-      scope: meta.attribute-with-value.html entity.other.attribute-name.html
+      scope: meta.attribute-with-value.type.html entity.other.attribute-name.html
       set: script-type-attribute-assignment
 
   script-type-attribute-assignment:
     - meta_include_prototype: false
-    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.type.html
     - match: =
       scope: punctuation.separator.key-value.html
       set: script-type-attribute-value
@@ -416,41 +416,46 @@ contexts:
 
   script-type-attribute-value:
     - meta_include_prototype: false
-    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.type.html
     - include: script-type-decider
 
   script-type-decider:
     - match: (?={{javascript_mime_type}}{{unquoted_attribute_break}}|'{{javascript_mime_type}}'|"{{javascript_mime_type}}")
       set:
         - script-javascript
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=(?i:module{{unquoted_attribute_break}}|'module'|"module"))
       set:
         - script-javascript
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=>|''|"")
       set:
         - script-javascript
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?={{json_mime_type}}{{unquoted_attribute_break}}|'{{json_mime_type}}'|"{{json_mime_type}}")
       set:
         - script-json
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=(?i:{{html_mime_type}}{{unquoted_attribute_break}}|'{{html_mime_type}}'|"{{html_mime_type}}"))
       set:
         - script-html
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
       set:
         - script-other
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
 
+  tag-type-attribute-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.type.html
+    - include: immediately-pop
+
 ###[ STYLE TAG ]##############################################################
 
   style-tag:
@@ -527,12 +532,12 @@ contexts:
 
   style-type-attribute:
     - match: (?i:type){{attribute_name_break}}
-      scope: meta.attribute-with-value.html entity.other.attribute-name.html
+      scope: meta.attribute-with-value.type.html entity.other.attribute-name.html
       set: style-type-attribute-assignment
 
   style-type-attribute-assignment:
     - meta_include_prototype: false
-    - meta_content_scope: meta.tag.style.begin.html meta.attribute-with-value.html
+    - meta_content_scope: meta.tag.style.begin.html meta.attribute-with-value.type.html
     - match: =
       scope: punctuation.separator.key-value.html
       set: style-type-attribute-value
@@ -541,24 +546,24 @@ contexts:
 
   style-type-attribute-value:
     - meta_include_prototype: false
-    - meta_scope: meta.tag.style.begin.html meta.attribute-with-value.html
+    - meta_scope: meta.tag.style.begin.html meta.attribute-with-value.type.html
     - include: style-type-decider
 
   style-type-decider:
     - match: (?=(?i:text/css{{unquoted_attribute_break}}|'text/css'|"text/css"))
       set:
         - style-css
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=>|''|"")
       set:
         - style-css
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
       set:
         - style-other
-        - tag-generic-attribute-meta
+        - tag-type-attribute-meta
         - tag-generic-attribute-value
 
 ###[ ATTRIBUTES ]#############################################################

diff --git a/HTML/Script Type Values.sublime-completions b/HTML/Script Type Values.sublime-completions
@@ -0,0 +1,40 @@
+{
+	"scope": "text.html meta.tag.script meta.attribute-with-value.type",
+	"completions": [
+		{
+			"trigger": "application/ecmascript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "ECMA Script"
+		},
+		{
+			"trigger": "application/javascript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "JavaScript"
+		},
+		{
+			"trigger": "application/json",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "JSON"
+		},
+		{
+			"trigger": "text/ecmascript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "ECMA Script"
+		},
+		{
+			"trigger": "text/html",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "HTML"
+		},
+		{
+			"trigger": "text/javascript",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "JavaScript"
+		},
+		{
+			"trigger": "text/json",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "JSON"
+		}
+	]
+}
diff --git a/HTML/Style Type Values.sublime-completions b/HTML/Style Type Values.sublime-completions
@@ -0,0 +1,10 @@
+{
+	"scope": "text.html meta.tag.style meta.attribute-with-value.type",
+	"completions": [
+		{
+			"trigger": "text/css",
+			"kind": ["type", "t", "Mime Type"],
+			"details": "Cascading Stylesheet"
+		}
+	]
+}
diff --git a/HTML/syntax_test_html.html b/HTML/syntax_test_html.html
@@ -99,7 +99,7 @@
 
         <script type="text/javascript"> <!--
         ##^^^^^^ meta.tag.script.begin.html - meta.tag meta.tag - meta.attribute-with-value - source
-        ##      ^^^^^^^^^^^^^^^^^^^^^^ meta.tag.script.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value - source
+        ##      ^^^^^^^^^^^^^^^^^^^^^^ meta.tag.script.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value - source
         ##                            ^ meta.tag.script.begin.html - meta.tag meta.tag - meta.attribute-with-value - source
         ##                             ^^^^^^ - meta.tag  - source
         ## ^ entity.name.tag.script
@@ -120,11 +120,20 @@
 
         <script
         type
-        ## <- meta.tag.script.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ## <- meta.tag.script.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ></script>
+
+        <script
+        type
+        =
+        ## <- meta.tag.script.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ></script>
+
+        <script
+        type
         =
-        ## <- meta.tag.script.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
         application/jAvAsCrIpT>
-        ## <- meta.tag.script.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ## <- meta.tag.script.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
             var foo = 100;
         ##  ^^^^^^^^^^^^^^^ source.js.embedded
         </script>
@@ -186,7 +195,7 @@
 
         <script type = "text/html"> <!--
         ##^^^^^^ meta.tag.script.begin.html - meta.tag meta.tag - meta.attribute-with-value
-        ##      ^^^^^^^^^^^^^^^^^^ meta.tag.script.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ##      ^^^^^^^^^^^^^^^^^^ meta.tag.script.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
         ##                        ^ meta.tag.script.begin.html - meta.tag meta.tag - meta.attribute-with-value
         ## ^ entity.name.tag.script - text.html.embedded.html
         ##             ^ string.quoted.double.html - text.html.embedded.html
@@ -317,7 +326,7 @@
 
         <style type="text/css"> <!-- h1 {} --> </style>
         ##^^^^^ meta.tag.style.begin.html - meta.tag meta.tag - meta.attribute-with-value
-        ##     ^^^^^^^^^^^^^^^ meta.tag.style.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ##     ^^^^^^^^^^^^^^^ meta.tag.style.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
         ##                    ^ meta.tag.style.begin.html - meta.tag meta.tag - meta.attribute-with-value
         ##                     ^ - meta.tag - comment - source
         ##                      ^^^^ comment.block.html punctuation.definition.comment.begin.html - source
@@ -328,7 +337,7 @@
 
         <style type  =  "text/css"> <!-- h1 {} --> </style>
         ##^^^^^ meta.tag.style.begin.html - meta.tag meta.tag - meta.attribute-with-value
-        ##     ^^^^^^^^^^^^^^^^^^^ meta.tag.style.begin.html meta.attribute-with-value.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
+        ##     ^^^^^^^^^^^^^^^^^^^ meta.tag.style.begin.html meta.attribute-with-value.type.html - meta.tag meta.tag - meta.attribute-with-value meta.attribute-with-value
         ##                        ^ meta.tag.style.begin.html - meta.tag meta.tag - meta.attribute-with-value
         ##                         ^ - meta.tag - comment - source
         ##                          ^^^^ comment.block.html punctuation.definition.comment.begin.html - source

diff --git a/Markdown/tests/syntax_test_markdown.md b/Markdown/tests/syntax_test_markdown.md
@@ -2384,7 +2384,7 @@ okay
 
 <style
   type="text/css">
-| ^^^^^^^^^^^^^^^ meta.disable-markdown meta.tag.style.begin.html meta.attribute-with-value.html
+| ^^^^^^^^^^^^^^^ meta.disable-markdown meta.tag.style.begin.html meta.attribute-with-value.type.html
 h1 {color:red;}
 |   ^^^^^ meta.disable-markdown source.css.embedded.html meta.property-list.css meta.property-name.css support.type.property-name.css