fix(gatsby-transformer-remark): Activate footnotes by default & remove included options with remark v13 (#31019) (#31080)

* fix footnotes in gatsby-transformer-remark

* fix tests

* fix example

* allow any value for deprecated parameters

(cherry picked from commit a35d615)

Co-authored-by: Frank Showalter <[email protected]>

Author: GatsbyJS Bot

examples/using-remark/gatsby-config.js

@@ -27,9 +27,7 @@ module.exports = {
       resolve: `gatsby-transformer-remark`,
       options: {
         gfm: true,
-        commonmark: true,
         footnotes: true,
-        pedantic: true,
         // blocks: ["h2"], Blocks option value can be provided here as an array.
         excerpt_separator: `<!-- end -->`,
         plugins: [

packages/gatsby-transformer-remark/README.md

@@ -14,12 +14,8 @@ plugins: [
   {
     resolve: `gatsby-transformer-remark`,
     options: {
-      // CommonMark mode (default: true)
-      commonmark: true,
       // Footnotes mode (default: true)
       footnotes: true,
-      // Pedantic mode (default: true)
-      pedantic: true,
       // GitHub Flavored Markdown mode (default: true)
       gfm: true,
       // Plugins configs
@@ -29,15 +25,12 @@ plugins: [
 ],
 ```
 
-The following parts of `options` are passed down to Remark as options:
+The following parts of `options` enable the `remark-footnotes` and `remark-gfm`
+plugins:
 
-- `options.commonmark`
 - `options.footnotes`
-- `options.pedantic`
 - `options.gfm`
 
-The details of the Remark options above could be found in [`remark-parse`'s documentation](https://github.com/remarkjs/remark/tree/main/packages/remark-parse#processoruseparse-options)
-
 A full explanation of how to use markdown in Gatsby can be found here:
 [Creating a Blog with Gatsby](https://www.gatsbyjs.org/blog/2017-07-19-creating-a-blog-with-gatsby/)
 

packages/gatsby-transformer-remark/package.json

@@ -17,6 +17,7 @@
     "mdast-util-to-string": "^2.0.0",
     "mdast-util-toc": "^5.1.0",
     "remark": "^13.0.0",
+    "remark-footnotes": "^3.0.0",
     "remark-gfm": "^1.0.0",
     "remark-parse": "^9.0.0",
     "remark-retext": "^4.0.0",

packages/gatsby-transformer-remark/src/__tests__/gatsby-node.js

@@ -4,17 +4,13 @@ import { pluginOptionsSchema } from "../gatsby-node"
 describe(`gatsby-node.js`, () => {
   it(`should provide meaningful errors when fields are invalid`, async () => {
     const expectedErrors = [
-      `"commonmark" must be a boolean`,
       `"footnotes" must be a boolean`,
-      `"pedantic" must be a boolean`,
       `"gfm" must be a boolean`,
       `"plugins" must be an array`,
     ]
 
     const { errors } = await testPluginOptionsSchema(pluginOptionsSchema, {
-      commonmark: `this should be a boolean`,
       footnotes: `this should be a boolean`,
-      pedantic: `this should be a boolean`,
       gfm: `this should be a boolean`,
       plugins: `this should be an array`,
     })
@@ -24,9 +20,7 @@ describe(`gatsby-node.js`, () => {
 
   it(`should validate the schema`, async () => {
     const { isValid } = await testPluginOptionsSchema(pluginOptionsSchema, {
-      commonmark: false,
       footnotes: false,
-      pedantic: false,
       gfm: false,
       plugins: [
         `gatsby-remark-copy-linked-files`,

packages/gatsby-transformer-remark/src/extend-node-type.js

@@ -9,6 +9,7 @@ const mdastToString = require(`mdast-util-to-string`)
 const unified = require(`unified`)
 const parse = require(`remark-parse`)
 const remarkGfm = require(`remark-gfm`)
+const remarkFootnotes = require(`remark-footnotes`)
 const stringify = require(`remark-stringify`)
 const english = require(`retext-english`)
 const remark2retext = require(`remark-retext`)
@@ -95,31 +96,32 @@ module.exports = function remarkExtendNodeType(
     // Setup Remark.
     const {
       blocks,
-      commonmark = true,
       footnotes = true,
       gfm = true,
-      pedantic = true,
       tableOfContents = {
         heading: null,
         maxDepth: 6,
       },
     } = pluginOptions
     const tocOptions = tableOfContents
-    const remarkOptions = {
-      commonmark,
-      footnotes,
-      pedantic,
-    }
+    const remarkOptions = {}
+
     if (_.isArray(blocks)) {
       remarkOptions.blocks = blocks
     }
+
     let remark = new Remark().data(`settings`, remarkOptions)
 
     if (gfm) {
       // TODO: deprecate `gfm` option in favor of explicit remark-gfm as a plugin?
       remark = remark.use(remarkGfm)
     }
 
+    if (footnotes) {
+      // TODO: deprecate `footnotes` option in favor of explicit remark-footnotes as a plugin?
+      remark = remark.use(remarkFootnotes, { inlineNotes: true })
+    }
+
     for (const plugin of pluginOptions.plugins) {
       const requiredPlugin = require(plugin.resolve)
       if (_.isFunction(requiredPlugin.setParserPlugins)) {

packages/gatsby-transformer-remark/src/gatsby-node.js

@@ -9,15 +9,13 @@ exports.setFieldsOnGraphQLNodeType = require(`./extend-node-type`)
 
 exports.pluginOptionsSchema = function ({ Joi }) {
   return Joi.object({
-    commonmark: Joi.boolean().description(
-      `Activates CommonMark mode (default: true)`
-    ),
+    // Options `commonmark` and `pedantic` have no effect since [email protected]
+    // TODO: remove in v5
+    commonmark: Joi.any(),
+    pedantic: Joi.any(),
     footnotes: Joi.boolean().description(
       `Activates Footnotes mode (default: true)`
     ),
-    pedantic: Joi.boolean().description(
-      `Activates pedantic mode (default: true)`
-    ),
     gfm: Joi.boolean().description(
       `Activates GitHub Flavored Markdown mode (default: true)`
     ),

yarn.lock

@@ -18088,6 +18088,14 @@ mdast-util-find-and-replace@^1.1.0:
     unist-util-is "^4.0.0"
     unist-util-visit-parents "^3.0.0"
 
+mdast-util-footnote@^0.1.0:
+  version "0.1.7"
+  resolved "https://registry.yarnpkg.com/mdast-util-footnote/-/mdast-util-footnote-0.1.7.tgz#4b226caeab4613a3362c144c94af0fdd6f7e0ef0"
+  integrity sha512-QxNdO8qSxqbO2e3m09KwDKfWiLgqyCurdWTQ198NpbZ2hxntdc+VKS4fDJCmNWbAroUdYnSthu+XbZ8ovh8C3w==
+  dependencies:
+    mdast-util-to-markdown "^0.6.0"
+    micromark "~2.11.0"
+
 mdast-util-from-markdown@^0.8.0:
   version "0.8.5"
   resolved "https://registry.yarnpkg.com/mdast-util-from-markdown/-/mdast-util-from-markdown-0.8.5.tgz#d1ef2ca42bc377ecb0463a987910dae89bd9a28c"
@@ -18515,6 +18523,13 @@ microevent.ts@~0.1.1:
   resolved "https://registry.yarnpkg.com/microevent.ts/-/microevent.ts-0.1.1.tgz#70b09b83f43df5172d0205a63025bce0f7357fa0"
   integrity sha512-jo1OfR4TaEwd5HOrt5+tAZ9mqT4jmpNAusXtyfNzqVm9uiSYFZlKM1wYL4oU7azZW/PxQW53wM0S6OR1JHNa2g==
 
+micromark-extension-footnote@^0.3.0:
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/micromark-extension-footnote/-/micromark-extension-footnote-0.3.2.tgz#129b74ef4920ce96719b2c06102ee7abb2b88a20"
+  integrity sha512-gr/BeIxbIWQoUm02cIfK7mdMZ/fbroRpLsck4kvFtjbzP4yi+OPVbnukTc/zy0i7spC2xYE/dbX1Sur8BEDJsQ==
+  dependencies:
+    micromark "~2.11.0"
+
 micromark-extension-frontmatter@^0.2.0:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/micromark-extension-frontmatter/-/micromark-extension-frontmatter-0.2.2.tgz#61b8e92e9213e1d3c13f5a59e7862f5ca98dfa53"
@@ -22681,6 +22696,14 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/remark-footnotes/-/remark-footnotes-1.0.0.tgz#9c7a97f9a89397858a50033373020b1ea2aad011"
   integrity sha512-X9Ncj4cj3/CIvLI2Z9IobHtVi8FVdUrdJkCNaL9kdX8ohfsi18DXHsCVd/A7ssARBdccdDb5ODnt62WuEWaM/g==
 
+remark-footnotes@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/remark-footnotes/-/remark-footnotes-3.0.0.tgz#5756b56f8464fa7ed80dbba0c966136305d8cb8d"
+  integrity sha512-ZssAvH9FjGYlJ/PBVKdSmfyPc3Cz4rTWgZLI4iE/SX8Nt5l3o3oEjv3wwG5VD7xOjktzdwp5coac+kJV9l4jgg==
+  dependencies:
+    mdast-util-footnote "^0.1.0"
+    micromark-extension-footnote "^0.3.0"
+
 remark-frontmatter@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/remark-frontmatter/-/remark-frontmatter-3.0.0.tgz#ca5d996361765c859bd944505f377d6b186a6ec6"