From b0fe52606b632f309af62861fe47c804d2cda2c7 Mon Sep 17 00:00:00 2001 From: Josh Goebel Date: Fri, 13 Dec 2019 17:23:48 -0500 Subject: [PATCH 1/5] (javascript) fix jsx self-closing tag issues --- src/languages/javascript.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/src/languages/javascript.js b/src/languages/javascript.js index 2d576d6bb1..5035723b85 100644 --- a/src/languages/javascript.js +++ b/src/languages/javascript.js @@ -188,17 +188,23 @@ function(hljs) { skip: true, }, { // E4X / JSX - begin: //, + className: 'jsx', + begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+\/?)>/, subLanguage: 'xml', contains: [ + // self-closing tag { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true }, + // manually closed tag { - begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+|[A-Za-z0-9\\._:-]+\/)>/, skip: true, + begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+\/?)>/, skip: true, contains: [ { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true }, 'self' ] - } + }, + // it's possible our beginning JSX tag is actually self closing tag, + // so we need to allow for that possibility + { begin: /\/>/, skip: true, endsParent: true}, ] } ], From 82a1217483aa65ba0d5ad5f6ca5bca28b1d19664 Mon Sep 17 00:00:00 2001 From: Josh Goebel Date: Fri, 13 Dec 2019 17:37:01 -0500 Subject: [PATCH 2/5] clean up --- src/languages/javascript.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/languages/javascript.js b/src/languages/javascript.js index 5035723b85..0cfa049581 100644 --- a/src/languages/javascript.js +++ b/src/languages/javascript.js @@ -6,6 +6,7 @@ Website: https://developer.mozilla.org/en-US/docs/Web/JavaScript */ function(hljs) { + var SELF_CLOSING_TAG = /<[A-Za-z0-9\\._:-]+\s*\/>/; var IDENT_RE = '[A-Za-z$_][0-9A-Za-z$_]*'; var KEYWORDS = { keyword: @@ -189,16 +190,15 @@ function(hljs) { }, { // E4X / JSX className: 'jsx', - begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+\/?)>/, + begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+)>/, subLanguage: 'xml', contains: [ - // self-closing tag - { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true }, + { begin: SELF_CLOSING_TAG, skip: true }, // manually closed tag { - begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+\/?)>/, skip: true, + begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+)>/, skip: true, contains: [ - { begin: /<[A-Za-z0-9\\._:-]+\s*\/>/, skip: true }, + { begin: SELF_CLOSING_TAG, skip: true }, 'self' ] }, From 168bc682e377abd2dda37c3bbd0e9f760ca93146 Mon Sep 17 00:00:00 2001 From: Josh Goebel Date: Fri, 13 Dec 2019 22:14:14 -0500 Subject: [PATCH 3/5] more fixes --- src/languages/javascript.js | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/src/languages/javascript.js b/src/languages/javascript.js index 0cfa049581..1375f885d9 100644 --- a/src/languages/javascript.js +++ b/src/languages/javascript.js @@ -190,21 +190,17 @@ function(hljs) { }, { // E4X / JSX className: 'jsx', - begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+)>/, + begin: /<[A-Za-z0-9\\._:-]+/, + end: /\/[A-Za-z0-9\\._:-]+>|\/>/, subLanguage: 'xml', contains: [ - { begin: SELF_CLOSING_TAG, skip: true }, - // manually closed tag { begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+)>/, skip: true, contains: [ - { begin: SELF_CLOSING_TAG, skip: true }, + { begin: /<[A-Za-z0-9\\._:-]+\s*/, end: /\/>/, skip: true }, 'self' ] }, - // it's possible our beginning JSX tag is actually self closing tag, - // so we need to allow for that possibility - { begin: /\/>/, skip: true, endsParent: true}, ] } ], From 042479b59e8ff30bdae8a3fac673f6a490c7ba0c Mon Sep 17 00:00:00 2001 From: Josh Goebel Date: Sat, 14 Dec 2019 18:14:25 -0500 Subject: [PATCH 4/5] simply rules, more markup tests --- src/languages/javascript.js | 18 +++++++----------- test/markup/javascript/jsx.expect.txt | 20 ++++++++++++++++++++ test/markup/javascript/jsx.txt | 20 ++++++++++++++++++++ 3 files changed, 47 insertions(+), 11 deletions(-) diff --git a/src/languages/javascript.js b/src/languages/javascript.js index 1375f885d9..701a5b1167 100644 --- a/src/languages/javascript.js +++ b/src/languages/javascript.js @@ -6,7 +6,8 @@ Website: https://developer.mozilla.org/en-US/docs/Web/JavaScript */ function(hljs) { - var SELF_CLOSING_TAG = /<[A-Za-z0-9\\._:-]+\s*\/>/; + 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: @@ -188,19 +189,14 @@ function(hljs) { end: /\s*/, skip: true, }, - { // E4X / JSX - className: 'jsx', - begin: /<[A-Za-z0-9\\._:-]+/, - end: /\/[A-Za-z0-9\\._:-]+>|\/>/, + { // JSX + begin: TAG_START, end: TAG_FINISH, subLanguage: 'xml', contains: [ { - begin: /<[A-Za-z0-9\\._:-]+/, end: /(\/[A-Za-z0-9\\._:-]+)>/, skip: true, - contains: [ - { begin: /<[A-Za-z0-9\\._:-]+\s*/, end: /\/>/, 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 = ; var jsx = ......; var jsx =

; var jsx = ; + var x = 5; + return (); + +const n = () => +const m = () => + +class App extends Component { + render() { + return ( + +
+ + +
+ + ); + } +} + +var x = 5; From 9054af2caa2ac8b9f81b02fe2bac8e4ee87b0a61 Mon Sep 17 00:00:00 2001 From: Josh Goebel Date: Sun, 15 Dec 2019 07:31:15 -0500 Subject: [PATCH 5/5] add changelog --- CHANGES.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) 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