Parsing error: Cannot use 'in' operator to search for 'ast' in undefined

[bencmbrook]

Subject of the issue

When using eslint-mdx, I get the following error (full stack trace collapsed below):

`eslint --debug` full stack trace

  eslint:cli-engine Lint /Workspace/pages/docs/example.mdx +8ms
  eslint:linter Linting code for /Workspace/pages/docs/example.mdx (pass 1) +2ms
  eslint:linter Verify +0ms
  eslint:linter With ConfigArray: /Workspace/pages/docs/example.mdx +0ms
  eslint:linter Apply the processor: 'mdx/remark' +0ms
  eslint:linter A code block was found: '(unnamed)' +9ms
  eslint:linter Parsing error: Cannot use 'in' operator to search for 'ast' in undefined
  eslint:linter TypeError: Cannot use 'in' operator to search for 'ast' in undefined
    at Parser._eslintParse (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/parser.js:150:23)
    at Parser._nodeToAst (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/parser.js:239:28)
    at Traverse.enter [as _enter] (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/parser.js:114:30)
    at Traverse.traverse (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/traverse.js:126:14)
    at Traverse.traverse (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/traverse.js:123:22)
    at traverse (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/traverse.js:130:59)
    at Parser.parseForESLint (/Workspace/.yarn/__virtual__/eslint-mdx-virtual-c88a66ab37/0/cache/eslint-mdx-npm-1.16.0-17f0646dc1-1aaa3ec016.zip/node_modules/eslint-mdx/lib/parser.js:107:37)
    at parse (/Workspace/.yarn/cache/eslint-npm-7.32.0-e15cc6682f-cc85af9985.zip/node_modules/eslint/lib/linter/linter.js:659:22)
    at Linter._verifyWithoutProcessors (/Workspace/.yarn/cache/eslint-npm-7.32.0-e15cc6682f-cc85af9985.zip/node_modules/eslint/lib/linter/linter.js:1135:33)
    at /Workspace/.yarn/cache/eslint-npm-7.32.0-e15cc6682f-cc85af9985.zip/node_modules/eslint/lib/linter/linter.js:1309:29 +104ms

This points to program being undefined on this line:

eslint-mdx/packages/eslint-mdx/src/parser.ts

Line 243 in 6c8e3be

'ast' in program && program.ast ? program : { ast: program }

Your environment

• OS: macOS 11.6
• Packages:

    "@mdx-js/loader": "^1.6.22",
    "@next/mdx": "^12.0.2",
    "next": "^12.0.2",
    ...
    "eslint": "^7.32.0",
    "eslint-config-next": "^12.0.1",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-mdx": "^1.16.0",

• Env:

Node v14.17.3
Yarn v3.0.2

Steps to reproduce

Tell us how to reproduce this issue. Please provide a working and simplified example.

eslintrc.json:

{
  "root": true,
  "extends": ["next/core-web-vitals", "prettier"],
  "overrides": [
    {
      "files": ["*.mdx"],
      "extends": ["plugin:mdx/recommended"],
      "settings": {
        "mdx/code-blocks": true,
        "mdx/language-mapper": {}
      }
    }
  ]
}

.vscode/settings.json:

  "eslint.options": {
    "extensions": [
      ".js",
      ".jsx",
      ".mdx",
      ".ts",
      ".tsx"
    ]
  },
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "mdx",
    "typescript",
    "typescriptreact"
  ]

Expected behaviour

mdx files successfully lint.

Actual behaviour

All .mdx files get the same Parsing error on line 1.

[JounQin]

Please provide a minimal and runnable reproduction.

[bencmbrook]

here's the repro. it starts throwing this error when Yarn PnP is used.

https://github.com/bencmbrook/mdx-bug

yarn set version berry

yarn

yarn lint

0:0 error Parsing error: Cannot use 'in' operator to search for 'ast' in undefined

✖ 1 problem (1 error, 0 warnings)

[JounQin]

Sorry, I'm not familiar with yarn pnp and don't know how to debug original node_modules inside. And reference how to debug your error?

[JounQin]

After yarn unplug, I found:

This is caused by tried to access espree, but it isn't declared in your dependencies; this makes the require call ambiguous and unsound.

The current workaround is yarn add -D espree (or @babel/eslint-parser, etc, else)

And use .eslintrc.js like

module.exports = {
  parserOptions: {
    parser: require('espree'),
  },
}

Why? ES syntaxes like import require a correct parser

@typescript-eslint/parser or @babel/eslint-parser or babel-eslint will be detected automatically what means you actually do not need to do this

See also https://github.com/mdx-js/eslint-mdx#parser-options

But for yarn pnp, it seems broken, maybe peerDependencies and peerDependenciesMeta can fix this.

[bencmbrook]

Thank you @JounQin - that's helpful. What's odd is I'm using typescript and imports are working outside of MDX, but I'll try out espree!

As for debugging PnP, VSCode ZipFS can be helpful to explore the node modules (which are under .yarn/cache/{package}.zip)

[JounQin]

What's odd is I'm using typescript and imports are working outside of MDX

https://github.com/bencmbrook/mdx-bug/blob/main/test.mdx?plain=1#L1

This is ES syntax in .mdx (import statement).

[JounQin]

# 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

Please help us to test the fresh new version.