From a33e7fb1417d98f06df859e48b1a99ab697dbf6a Mon Sep 17 00:00:00 2001 From: Seokmin Hong Date: Mon, 2 Nov 2020 19:59:14 +0900 Subject: [PATCH] fix(gatsby-remark-prismjs): Handle diff-language styling issue (#27659) * Fix test to fail for PrismJS diff-highlight * Handle diff-language for PrismJS plugin * Restore checking the existence of PrismJS language early --- .../__snapshots__/highlight-code.js.snap | 8 ++++---- .../src/__tests__/highlight-code.js | 4 ++-- .../gatsby-remark-prismjs/src/highlight-code.js | 17 +++++++++++++++++ 3 files changed, 23 insertions(+), 6 deletions(-) diff --git a/packages/gatsby-remark-prismjs/src/__tests__/__snapshots__/highlight-code.js.snap b/packages/gatsby-remark-prismjs/src/__tests__/__snapshots__/highlight-code.js.snap index 1d61a73d49923..0ef4be8a968e6 100644 --- a/packages/gatsby-remark-prismjs/src/__tests__/__snapshots__/highlight-code.js.snap +++ b/packages/gatsby-remark-prismjs/src/__tests__/__snapshots__/highlight-code.js.snap @@ -6,12 +6,12 @@ exports[`highlight code and lines with PrismJS for language cpp 1`] = ` " `; -exports[`highlight code and lines with PrismJS for language diff-js 1`] = ` +exports[`highlight code and lines with PrismJS for language diff-typescript 1`] = ` " -- let foo = bar.baz([1, 2, 3]); +- let foo = bar.baz([1, 2, 3]); - foo = foo + 1; -+ const foo = bar.baz([1, 2, 3]) + 1; - console.log(foo); ++ const foo = bar.baz([1, 2, 3]) + 1; + console.log(foo); " `; diff --git a/packages/gatsby-remark-prismjs/src/__tests__/highlight-code.js b/packages/gatsby-remark-prismjs/src/__tests__/highlight-code.js index c7ac70bc44cdb..11a8d61c6f505 100644 --- a/packages/gatsby-remark-prismjs/src/__tests__/highlight-code.js +++ b/packages/gatsby-remark-prismjs/src/__tests__/highlight-code.js @@ -55,10 +55,10 @@ export default Counter expect(/]*>[^<]*\n[^<]*<\/span>/g.exec(processed)).not.toBeTruthy() }) - it(`for language diff-js`, () => { + it(`for language diff-typescript`, () => { const highlightCode = require(`../highlight-code`) const language = `diff` - const diffLanguage = `js` + const diffLanguage = `typescript` const lineNumbersHighlight = [] const code = ` - let foo = bar.baz([1, 2, 3]); diff --git a/packages/gatsby-remark-prismjs/src/highlight-code.js b/packages/gatsby-remark-prismjs/src/highlight-code.js index 1d5ada1914f91..9b54ec43e88b3 100644 --- a/packages/gatsby-remark-prismjs/src/highlight-code.js +++ b/packages/gatsby-remark-prismjs/src/highlight-code.js @@ -43,6 +43,23 @@ module.exports = ( } } + // (Try to) load diffLanguage on demand. + if (diffLanguage && !Prism.languages[diffLanguage]) { + try { + loadPrismLanguage(diffLanguage) + } catch (e) { + let message = `unable to find prism language '${diffLanguage}' for highlighting.` + + const lang = diffLanguage.toLowerCase() + if (!unsupportedLanguages.has(lang)) { + console.warn(message, `applying generic code block`) + unsupportedLanguages.add(lang) + } + // Ignore diffLanguage when it does not exist. + diffLanguage = null + } + } + const grammar = Prism.languages[language] const highlighted = Prism.highlight( code,