From 0da4bd1471dee2008916e618989061e463ceabb9 Mon Sep 17 00:00:00 2001
From: Tristan Menzel <tristan.menzel@readify.net>
Date: Mon, 20 Apr 2020 12:24:48 +1000
Subject: [PATCH] Adds support for jsx blocks in typescript lexer

Adds support for jsx tags with a period in their name
Adds support for jsx fragments (<></>)
---
 lexers/j/jsx.go              |  5 +--
 lexers/t/typescript.go       | 26 ++++++++++++++-
 lexers/testdata/jsx.actual   |  6 +++-
 lexers/testdata/jsx.expected | 14 +++++++-
 lexers/testdata/tsx.actual   | 13 ++++++++
 lexers/testdata/tsx.expected | 65 ++++++++++++++++++++++++++++++++++++
 6 files changed, 124 insertions(+), 5 deletions(-)
 create mode 100644 lexers/testdata/tsx.actual
 create mode 100644 lexers/testdata/tsx.expected

diff --git a/lexers/j/jsx.go b/lexers/j/jsx.go
index 71642d6..7c098b9 100644
--- a/lexers/j/jsx.go
+++ b/lexers/j/jsx.go
@@ -69,8 +69,9 @@ var JSX = internal.Register(MustNewLexer(
 			Include("root"),
 		},
 		"jsx": {
-			{`(<)([\w]+)`, ByGroups(Punctuation, NameTag), Push("tag")},
-			{`(<)(/)([\w]+)(>)`, ByGroups(Punctuation, Punctuation, NameTag, Punctuation), nil},
+			{`(<)(/?)(>)`, ByGroups(Punctuation, Punctuation, Punctuation), nil},
+			{`(<)([\w\.]+)`, ByGroups(Punctuation, NameTag), Push("tag")},
+			{`(<)(/)([\w\.]+)(>)`, ByGroups(Punctuation, Punctuation, NameTag, Punctuation), nil},
 		},
 		"tag": {
 			{`\s+`, Text, nil},
diff --git a/lexers/t/typescript.go b/lexers/t/typescript.go
index 57d08bf..3b425ed 100644
--- a/lexers/t/typescript.go
+++ b/lexers/t/typescript.go
@@ -9,7 +9,7 @@ import (
 var TypeScript = internal.Register(MustNewLexer(
 	&Config{
 		Name:      "TypeScript",
-		Aliases:   []string{"ts", "typescript"},
+		Aliases:   []string{"ts", "tsx", "typescript"},
 		Filenames: []string{"*.ts", "*.tsx"},
 		MimeTypes: []string{"text/x-typescript"},
 		DotAll:    true,
@@ -32,6 +32,7 @@ var TypeScript = internal.Register(MustNewLexer(
 			{`\n`, Text, Pop(1)},
 		},
 		"root": {
+			Include("jsx"),
 			{`^(?=\s|/|<!--)`, Text, Push("slashstartsregex")},
 			Include("commentsandwhitespace"),
 			{`\+\+|--|~|&&|\?|:|\|\||\\(?=\n)|(<<|>>>?|==?|!=?|[-<>+*%&|^/])=?`, Operator, Push("slashstartsregex")},
@@ -69,5 +70,28 @@ var TypeScript = internal.Register(MustNewLexer(
 			{`\}`, LiteralStringInterpol, Pop(1)},
 			Include("root"),
 		},
+		"jsx": {
+			{`(<)(/?)(>)`, ByGroups(Punctuation, Punctuation, Punctuation), nil},
+			{`(<)([\w\.]+)`, ByGroups(Punctuation, NameTag), Push("tag")},
+			{`(<)(/)([\w\.]*)(>)`, ByGroups(Punctuation, Punctuation, NameTag, Punctuation), nil},
+		},
+		"tag": {
+			{`\s+`, Text, nil},
+			{`([\w]+\s*)(=)(\s*)`, ByGroups(NameAttribute, Operator, Text), Push("attr")},
+			{`[{}]+`, Punctuation, nil},
+			{`[\w\.]+`, NameAttribute, nil},
+			{`(/?)(\s*)(>)`, ByGroups(Punctuation, Text, Punctuation), Pop(1)},
+		},
+		"attr": {
+			{`{`, Punctuation, Push("expression")},
+			{`".*?"`, LiteralString, Pop(1)},
+			{`'.*?'`, LiteralString, Pop(1)},
+			Default(Pop(1)),
+		},
+		"expression": {
+			{`{`, Punctuation, Push()},
+			{`}`, Punctuation, Pop(1)},
+			Include("root"),
+		},
 	},
 ))
diff --git a/lexers/testdata/jsx.actual b/lexers/testdata/jsx.actual
index 8f215e5..aa0d2ee 100644
--- a/lexers/testdata/jsx.actual
+++ b/lexers/testdata/jsx.actual
@@ -5,6 +5,10 @@ import './index.css';
 import 'github-fork-ribbon-css/gh-fork-ribbon.css';
 
 ReactDOM.render(
-  <App />,
+  <>
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>
+  </>,
   document.getElementById('root')
 );
diff --git a/lexers/testdata/jsx.expected b/lexers/testdata/jsx.expected
index 5781d82..75be2eb 100644
--- a/lexers/testdata/jsx.expected
+++ b/lexers/testdata/jsx.expected
@@ -41,10 +41,22 @@
   {"type":"NameOther","value":"render"},
   {"type":"Punctuation","value":"("},
   {"type":"Text","value":"\n  "},
+  {"type":"Punctuation","value":"\u003c\u003e"},
+  {"type":"Text","value":"\n    "},
+  {"type":"Punctuation","value":"\u003c"},
+  {"type":"NameTag","value":"React.StrictMode"},
+  {"type":"Punctuation","value":"\u003e"},
+  {"type":"Text","value":"\n      "},
   {"type":"Punctuation","value":"\u003c"},
   {"type":"NameTag","value":"App"},
   {"type":"Text","value":" "},
-  {"type":"Punctuation","value":"/\u003e,"},
+  {"type":"Punctuation","value":"/\u003e"},
+  {"type":"Text","value":"\n    "},
+  {"type":"Punctuation","value":"\u003c/"},
+  {"type":"NameTag","value":"React.StrictMode"},
+  {"type":"Punctuation","value":"\u003e"},
+  {"type":"Text","value":"\n  "},
+  {"type":"Punctuation","value":"\u003c/\u003e,"},
   {"type":"Text","value":"\n  "},
   {"type":"NameBuiltin","value":"document"},
   {"type":"Punctuation","value":"."},
diff --git a/lexers/testdata/tsx.actual b/lexers/testdata/tsx.actual
new file mode 100644
index 0000000..2762b50
--- /dev/null
+++ b/lexers/testdata/tsx.actual
@@ -0,0 +1,13 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import './index.css'
+import { App } from './App'
+
+ReactDOM.render(
+  <>
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>
+  </>,
+  document.getElementById('root'),
+)
\ No newline at end of file
diff --git a/lexers/testdata/tsx.expected b/lexers/testdata/tsx.expected
new file mode 100644
index 0000000..69acfc4
--- /dev/null
+++ b/lexers/testdata/tsx.expected
@@ -0,0 +1,65 @@
+[
+  {"type":"KeywordReserved","value":"import"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"React"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"from"},
+  {"type":"Text","value":" "},
+  {"type":"LiteralStringSingle","value":"'react'"},
+  {"type":"Text","value":"\n"},
+  {"type":"KeywordReserved","value":"import"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"ReactDOM"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"from"},
+  {"type":"Text","value":" "},
+  {"type":"LiteralStringSingle","value":"'react-dom'"},
+  {"type":"Text","value":"\n"},
+  {"type":"KeywordReserved","value":"import"},
+  {"type":"Text","value":" "},
+  {"type":"LiteralStringSingle","value":"'./index.css'"},
+  {"type":"Text","value":"\n"},
+  {"type":"KeywordReserved","value":"import"},
+  {"type":"Text","value":" "},
+  {"type":"Punctuation","value":"{"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"App"},
+  {"type":"Text","value":" "},
+  {"type":"Punctuation","value":"}"},
+  {"type":"Text","value":" "},
+  {"type":"NameOther","value":"from"},
+  {"type":"Text","value":" "},
+  {"type":"LiteralStringSingle","value":"'./App'"},
+  {"type":"Text","value":"\n\n"},
+  {"type":"NameOther","value":"ReactDOM"},
+  {"type":"Punctuation","value":"."},
+  {"type":"NameOther","value":"render"},
+  {"type":"Punctuation","value":"("},
+  {"type":"Text","value":"\n  "},
+  {"type":"Punctuation","value":"\u003c\u003e"},
+  {"type":"Text","value":"\n    "},
+  {"type":"Punctuation","value":"\u003c"},
+  {"type":"NameTag","value":"React.StrictMode"},
+  {"type":"Punctuation","value":"\u003e"},
+  {"type":"Text","value":"\n      "},
+  {"type":"Punctuation","value":"\u003c"},
+  {"type":"NameTag","value":"App"},
+  {"type":"Text","value":" "},
+  {"type":"Punctuation","value":"/\u003e"},
+  {"type":"Text","value":"\n    "},
+  {"type":"Punctuation","value":"\u003c/"},
+  {"type":"NameTag","value":"React.StrictMode"},
+  {"type":"Punctuation","value":"\u003e"},
+  {"type":"Text","value":"\n  "},
+  {"type":"Punctuation","value":"\u003c/\u003e,"},
+  {"type":"Text","value":"\n  "},
+  {"type":"NameBuiltin","value":"document"},
+  {"type":"Punctuation","value":"."},
+  {"type":"NameOther","value":"getElementById"},
+  {"type":"Punctuation","value":"("},
+  {"type":"LiteralStringSingle","value":"'root'"},
+  {"type":"Punctuation","value":"),"},
+  {"type":"Text","value":"\n"},
+  {"type":"Punctuation","value":")"},
+  {"type":"Text","value":"\n"}
+]