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

bencmbrook commented 2 years ago

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:

https://github.com/mdx-js/eslint-mdx/blob/6c8e3bed59d94fc2111bd0338b98895c1ce15ee6/packages/eslint-mdx/src/parser.ts#L243

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 commented 2 years ago

Please provide a minimal and runnable reproduction.

bencmbrook commented 2 years ago

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 commented 2 years ago

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 commented 2 years ago

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

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

bencmbrook commented 2 years ago

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 commented 2 years ago

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 commented 2 years ago

# 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.

mdx-js / eslint-mdx