mdx-js / eslint-mdx

ESLint Parser/Plugin for MDX
https://npmjs.org/eslint-plugin-mdx
MIT License
258 stars 29 forks source link

mdx/code-blocks doesn't respect eslint-disable from outside of the block #534

Open rainecheck opened 3 months ago

rainecheck commented 3 months ago

Initial checklist

Affected packages and versions

eslint-plugin-mdx-3.1.5

Link to runnable example

No response

Steps to reproduce

The following contents report

:2 warning Unused eslint-disable directive (no problems were reported) :7 error 'deployProjectCommand' is never reassigned. Use 'const' instead prefer-const


{/* eslint-disable prefer-const */}
```ts

import { CommandRegister } from "@foo";
export function registerCommands(commandRegister: CommandRegister) {
  let deployProjectCommand: DeployProjectCommand = new DeployProjectCommand();
  commandRegister.addCommand(deployProjectCommand);
}

{/ eslint-enable prefer-const /}


Whereas this is correctly ignoring the linting error.
{/* eslint-disable prefer-const */}
import { CommandRegister } from "@foo";
export function registerCommands(commandRegister: CommandRegister) {
  let deployProjectCommand: DeployProjectCommand = new DeployProjectCommand();
  commandRegister.addCommand(deployProjectCommand);
}
{/* eslint-enable prefer-const */}


### Expected behavior

Both should correctly suppress the linting error.

### Actual behavior

Only `eslint-disable`s inside the block suppress the error. This means that the `eslint-disable` comment is visible inside the codeblock.

I've searched through issues and haven't found anything directly related to this, but given the response [here](https://github.com/mdx-js/eslint-mdx/issues/470#issuecomment-1765896654) this might be something from a dependency - if someone can confirm this, I'm happy to raise it there alternatively.

### Runtime

Node v20

### Package manager

yarn v1

### OS

macOS

### Build and bundle tools

Docusaurus
JounQin commented 3 months ago

I can imagine that's because eslint-plugin-markdown only supports html like comments.

https://github.com/eslint/eslint-plugin-markdown/blob/bb5c3d4d9b0283bbb44fd75d1c04a3ec7e789fe1/lib/processor.js#L71

@btmills Is that possible to support jsx style comments for .mdx files? Otherwise I have to copy-paste eslint-plugin-markdown's source codes instead which I'd like to avoid.

rainecheck commented 3 months ago

MDXv2 moved away from HTML comments, so anything that's using MDX as it's backing (e.g. Docusaurus) would need to support JSX comments. I'd suggest extending this to .md files too, but there are probably other stacks out there that might need it too.

EDIT: Also, it doesn't work in overrides. This doesn't work:

  overrides: [
    {
      files: ["**/<filename>.mdx"],
      rules: {
        "prefer-const": "off",
      },
    }
  ]

but this does:

  overrides: [
    {
      files: ["**"],
      rules: {
        "prefer-const": "off",
      },
    }
  ]

AFAICT the code block isn't being treated as part of the md/mdx file it's in.

JounQin commented 3 months ago

Code blocks are matched via **/*.mdx/*.{js,jsx,ts} (as virtual filename).