Code block with curly braces within JSX causes parsing error

mdx-js / eslint-mdx

ESLint Parser/Plugin for MDX

MIT License

264 stars 30 forks source link

Initial checklist

[X] I read the support docs
[X] I read the contributing guide
[X] I agree to follow the code of conduct
[X] I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

1.9.1-1.16.0

Link to runnable example

https://codesandbox.io/s/dreamy-meitner-i6uki6?file=/pages/index.mdx

Steps to reproduce

When a code block that contains curly braces is nested within a JSX tag, the parser fails and won't continue finding issues on the rest of the document. What seems to be happening is any instance of curly braces within JSX is treated like React curly braces, the contents of which are expected to be some JavaScript.

<div>

```js
function foo() {
  return 123;
}

In the codesandbox link that I added, I set the `start` script to run eslint. To view the output and tweak the input yourself, you'll need to click the "Restart server" button between changes. Alternatively, if you have a local setup with MDX and this eslint plugin, you can do something similar to the above example to see the issue in action. ### Expected behavior The contents of code blocks should always be interpreted as text and the parser shouldn't try to parse them as React. Authoring Markdown as content within JSX components is a common practice in MDX, and curly braces are common in many languages that would appear in Markdown code blocks. ### Actual behavior Eslint fails and doesn't continue linting the file when it encounters a code block with curly braces inside some JSX tags.

# yarn 1 yarn add https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-mdx https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-plugin-mdx # yarn 2, 3 yarn add eslint-mdx@https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-mdx/_pkg.tgz eslint-plugin-mdx@https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-plugin-mdx/_pkg.tgz # npm npm i https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-mdx https://pkg.csb.dev/mdx-js/eslint-mdx/commit/abdc9db9/eslint-plugin-mdx

mdx-js / eslint-mdx