fix(gatsby-plugin-mdx): don't allow JS frontmatter by default

[pieh]

Description

Currently gatsby-plugin-mdx by default supports the "JS engine" for frontmatter. The example syntax for it is:

---js
{
  foo: require(`fs`).readFileSync('something', 'utf-8')
}
---

Your regular MDX body

This was never intended default behavior because in some cases it can open up an attack vector for remote code execution (on the build server). As long as sourced content is secure and actually owned by same party as site owner, this doesn't cause problems, but we should be explicit with this, so we disable it by default with option to re-enable it (if someone actually relied on this unintended "feature")

In new default mode ( JS frontmatter engine disabled), we will show warning if there is any content that use JS frontmatter that this will not be processed/executed:

Because this is security risk we will continously show warning as reminder that it might not be safe to use it (it's not guaranteed it's not safe - context matter a lot):

Documentation

Small stub added to README.md about new plugin option referencing not yet published advisory with some details - this could likely be made nicer, but for the sake if getting fix out, this will have to do for now.

[mosesoak]

@pieh @mlgualtieri Thanks for this addition. Wanted to let you know that the link to the security issue is a Github 404.

GHSA-mj46-r4gr-5x83

It appears 3 times in this PR.

[mlgualtieri]

Thanks @mosesoak! It was not an oversight, but we were waiting on GitHub to assign a CVE to the issue before publishing the advisory. But, it doesn't appear that this will happen today so I went ahead and published the advisory. The link should work for you now.

[karlhorky]

@pieh after upgrading from gatsby-plugin-mdx@3.15.1 to gatsby-plugin-mdx@3.15.2, we're seeing our Frontmatter code show up in the content of the page 😱

This appears regardless of whether we have the JSFrontmatterEngine set to true or unconfigured...

[karlhorky]

Edit: this only works for gatsby develop, see below for a solution for gatsby build

It seems like commenting out line 187 with options prevents this from happening:

gatsby/packages/gatsby-plugin-mdx/loaders/mdx-loader.js

Lines 180 to 196 in 7dfd52d

	let code = content
	// after running mdx, the code *always* has a default export, so this
	// check needs to happen first.
	if (!hasDefaultExport(content, options) && !!defaultLayout) {
	debug(`inserting default layout`, defaultLayout)
	const { content: contentWithoutFrontmatter, matter } = grayMatter(
	content,
	options
	)
	code = `${matter ? matter : ``}
	import DefaultLayout from "${slash(defaultLayout)}"
	export default DefaultLayout
	${contentWithoutFrontmatter}`

Also, it seems like the options being passed to gray-matter on this line don't match the valid gray-matter options at all... They are Gatsby config options.

---

Edit: Apparently commenting out the above line only works in gatsby develop.

A solution for gatsby build (SSG) requires:

1. Commenting out passing all options to gray-matter in the mdx-loader.js, utils/mdx.js, utils/gen-mdx.js files (using patch-package)
2. And then ALSO enabling the JSFrontmatterEngine option

Super strange, wonder what's causing this Frontmatter to show up in the content.

---

@pieh have any idea what's happening here? Or do you think that I should open a new issue?