diff --git a/CHANGES.md b/CHANGES.md
index e044ae3d71..59532ee122 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -10,12 +10,14 @@ New themes:
Core Changes:
-- none yet.
+- (javascript) fix JSX self-closing tag issues (#2322) [Josh Goebel][]
Language Improvements:
- none yet.
+[Josh Goebel]: https://github.com/yyyc514
+
## Version 9.17.1
@@ -23,6 +25,8 @@ Fixes:
- fix(parser): resolve IE 11 issue with Object.freeze() (#2319) [Josh Goebel][]
+[Josh Goebel]: https://github.com/yyyc514
+
## Version 9.17.0
diff --git a/src/languages/javascript.js b/src/languages/javascript.js
index 2d576d6bb1..701a5b1167 100644
--- a/src/languages/javascript.js
+++ b/src/languages/javascript.js
@@ -6,6 +6,8 @@ Website: https://developer.mozilla.org/en-US/docs/Web/JavaScript
*/
function(hljs) {
+ var TAG_START = /<[A-Za-z0-9\\._:-]+/;
+ var TAG_FINISH = /\/[A-Za-z0-9\\._:-]+>|\/>/;
var IDENT_RE = '[A-Za-z$_][0-9A-Za-z$_]*';
var KEYWORDS = {
keyword:
@@ -187,17 +189,13 @@ function(hljs) {
end: /\s*/,
skip: true,
},
- { // E4X / JSX
- begin: /, end: /(\/[A-Za-z0-9\\._:-]+|[A-Za-z0-9\\._:-]+\/)>/,
+ { // JSX
+ begin: TAG_START, end: TAG_FINISH,
subLanguage: 'xml',
contains: [
- { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true },
{
- begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+|[A-Za-z0-9\\._:-]+\/)>/, skip: true,
- contains: [
- { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true },
- 'self'
- ]
+ begin: TAG_START, end: TAG_FINISH, skip: true,
+ contains: ['self']
}
]
}
diff --git a/test/markup/javascript/jsx.expect.txt b/test/markup/javascript/jsx.expect.txt
index 2a2fb84e23..a000fe75a7 100644
--- a/test/markup/javascript/jsx.expect.txt
+++ b/test/markup/javascript/jsx.expect.txt
@@ -3,5 +3,25 @@
var jsx = <node>...<child>...</child></node>;
var jsx = <div><span><br /></span></div>;
var jsx = <pre-node><child /></pre-node>;
+
var x = 5;
+
return (<node attr="value"></node>);
+
+const n = () => <X />
+const m = () => <X x="" />
+
+class App extends Component {
+ render() {
+ return (
+ <BrowserRouter>
+ <div>
+ <Route path="/about" component={About} />
+ <Route path="/contact" component={Contact} />
+ </div>
+ </BrowserRouter>
+ );
+ }
+}
+
+var x = 5;
diff --git a/test/markup/javascript/jsx.txt b/test/markup/javascript/jsx.txt
index 7d1042c153..a76ef8eecd 100644
--- a/test/markup/javascript/jsx.txt
+++ b/test/markup/javascript/jsx.txt
@@ -3,5 +3,25 @@ var jsx =