feat: fix incorrect node loc (#288)

JounQin · web-flow · commit c52039c566c9 · 2021-03-18T01:48:45.000+08:00
* feat: fix incorrect node loc this causes issue with `react/no-unescaped-entities` before so now `mdx/no-unescaped-entities` and `eslint-plugin-react` dep can be removed! fix #287 * ci: try codesandbox for releasing testing versions
diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
@@ -0,0 +1,6 @@
+{
+  "packages": [
+    "packages/*"
+  ],
+  "sandboxes": []
+}
diff --git a/README.md b/README.md
@@ -36,7 +36,6 @@
 - [Parser Options](#parser-options)
 - [Rules](#rules)
   - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
-  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
   - [mdx/no-unused-expressions](#mdxno-unused-expressions)
   - [mdx/remark](#mdxremark)
 - [Prettier Integration](#prettier-integration)
@@ -183,10 +182,6 @@ npm i -D eslint-plugin-mdx
 
 _Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
-### mdx/no-unescaped-entities
-
-Inline JSX like `Inline <Component />` is supported by [MDX][], but rule `react/no-unescaped-entities` from [eslint-plugin-react][] is incompatible with it, `mdx/no-unescaped-entities` is the replacement, so make sure that you've turned off the original `no-unescaped-entities` rule.
-
 ### mdx/no-unused-expressions
 
 [MDX][] can render `jsx` block automatically without exporting them, but [ESLint][] will report `no-unused-expressions` issue which could be unexpected, this rule is the replacement, so make sure that you've turned off the original `no-unused-expressions` rule.
diff --git a/packages/eslint-mdx/README.md b/packages/eslint-mdx/README.md
@@ -36,7 +36,6 @@
 - [Parser Options](#parser-options)
 - [Rules](#rules)
   - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
-  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
   - [mdx/no-unused-expressions](#mdxno-unused-expressions)
   - [mdx/remark](#mdxremark)
 - [Prettier Integration](#prettier-integration)
@@ -183,10 +182,6 @@ npm i -D eslint-plugin-mdx
 
 _Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
-### mdx/no-unescaped-entities
-
-Inline JSX like `Inline <Component />` is supported by [MDX][], but rule `react/no-unescaped-entities` from [eslint-plugin-react][] is incompatible with it, `mdx/no-unescaped-entities` is the replacement, so make sure that you've turned off the original `no-unescaped-entities` rule.
-
 ### mdx/no-unused-expressions
 
 [MDX][] can render `jsx` block automatically without exporting them, but [ESLint][] will report `no-unused-expressions` issue which could be unexpected, this rule is the replacement, so make sure that you've turned off the original `no-unused-expressions` rule.
diff --git a/packages/eslint-mdx/src/helpers.ts b/packages/eslint-mdx/src/helpers.ts
@@ -112,23 +112,34 @@ export const restoreNodeLocation = <T>(
   const start = range[0] + offset
   const end = range[1] + offset
 
+  const restoredStartLine = startLine + startLoc.line
+  const restoredEndLine = startLine + endLoc.line
+
   return Object.assign(node, {
     start,
     end,
     range: [start, end],
     loc: {
       start: {
-        line: startLine + startLoc.line,
-        column: startLoc.column,
+        line: restoredStartLine,
+        column: startLoc.column + (restoredStartLine === 1 ? offset : 0),
       },
       end: {
-        line: startLine + endLoc.line,
-        column: endLoc.column,
+        line: restoredEndLine,
+        column: endLoc.column + (restoredEndLine === 1 ? offset : 0),
       },
     },
   })
 }
 
+export const arrayify = <T, R = T extends Array<infer S> ? S : T>(
+  ...args: T[]
+) =>
+  args.reduce<R[]>((arr, curr) => {
+    arr.push(...(Array.isArray(curr) ? curr : curr == null ? [] : [curr]))
+    return arr
+  }, [])
+
 export const first = <T>(items: T[] | readonly T[]) => items && items[0]
 
 export const last = <T>(items: T[] | readonly T[]) =>
diff --git a/packages/eslint-mdx/src/parser.ts b/packages/eslint-mdx/src/parser.ts
@@ -8,6 +8,7 @@ import unified from 'unified'
 import type { Node, Parent } from 'unist'
 
 import {
+  arrayify,
   hasProperties,
   isJsxNode,
   last,
@@ -154,7 +155,6 @@ export class Parser {
     return this.parseForESLint(code, options).ast
   }
 
-  // eslint-disable-next-line sonarjs/cognitive-complexity
   parseForESLint(code: string, options: ParserOptions) {
     const extname = path.extname(options.filePath)
     const isMdx = DEFAULT_EXTENSIONS.concat(options.extensions || []).includes(
@@ -190,9 +190,9 @@ export class Parser {
             return
           }
 
-          let normalized = this.normalizeJsxNode(node, parent, options)
-          normalized = Array.isArray(normalized) ? normalized : [normalized]
-          for (const normalizedNode of normalized) {
+          for (const normalizedNode of arrayify(
+            this.normalizeJsxNode(node, parent, options),
+          )) {
             this._nodeToAst(normalizedNode, options)
           }
         },
diff --git a/packages/eslint-mdx/src/traverse.ts b/packages/eslint-mdx/src/traverse.ts
@@ -1,6 +1,6 @@
 import type { Node, Parent } from 'unist'
 
-import { last } from './helpers'
+import { arrayify, last } from './helpers'
 import { parser } from './parser'
 import {
   isCloseTag,
@@ -75,8 +75,7 @@ export class Traverse {
             }
             try {
               // fix #138
-              const nodes = parser.normalizeJsxNode(node, parent)
-              jsxNodes.push(...(Array.isArray(nodes) ? nodes : [nodes]))
+              jsxNodes.push(...arrayify(parser.normalizeJsxNode(node, parent)))
             } catch {
               // #272 related
               /* istanbul ignore else */
diff --git a/packages/eslint-plugin-mdx/README.md b/packages/eslint-plugin-mdx/README.md
@@ -36,7 +36,6 @@
 - [Parser Options](#parser-options)
 - [Rules](#rules)
   - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
-  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
   - [mdx/no-unused-expressions](#mdxno-unused-expressions)
   - [mdx/remark](#mdxremark)
 - [Prettier Integration](#prettier-integration)
@@ -183,10 +182,6 @@ npm i -D eslint-plugin-mdx
 
 _Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
-### mdx/no-unescaped-entities
-
-Inline JSX like `Inline <Component />` is supported by [MDX][], but rule `react/no-unescaped-entities` from [eslint-plugin-react][] is incompatible with it, `mdx/no-unescaped-entities` is the replacement, so make sure that you've turned off the original `no-unescaped-entities` rule.
-
 ### mdx/no-unused-expressions
 
 [MDX][] can render `jsx` block automatically without exporting them, but [ESLint][] will report `no-unused-expressions` issue which could be unexpected, this rule is the replacement, so make sure that you've turned off the original `no-unused-expressions` rule.
diff --git a/packages/eslint-plugin-mdx/package.json b/packages/eslint-plugin-mdx/package.json
@@ -35,7 +35,6 @@
   "dependencies": {
     "cosmiconfig": "^7.0.0",
     "eslint-mdx": "^1.10.0",
-    "eslint-plugin-react": "^7.22.0",
     "remark-mdx": "^1.6.22",
     "remark-parse": "^8.0.3",
     "remark-stringify": "^8.1.1",
diff --git a/packages/eslint-plugin-mdx/src/configs/recommended.ts b/packages/eslint-plugin-mdx/src/configs/recommended.ts
@@ -9,11 +9,9 @@ export const recommended: Linter.Config = {
   ...base,
   rules: {
     'mdx/no-jsx-html-comments': 2,
-    'mdx/no-unescaped-entities': 1,
     'mdx/no-unused-expressions': 2,
     'mdx/remark': 1,
     'no-unused-expressions': 0,
-    'react/no-unescaped-entities': 0,
   },
 }
 
diff --git a/packages/eslint-plugin-mdx/src/rules/helpers.ts b/packages/eslint-plugin-mdx/src/rules/helpers.ts
@@ -2,12 +2,13 @@ import path from 'path'
 
 import { cosmiconfigSync } from 'cosmiconfig'
 import type { CosmiconfigResult } from 'cosmiconfig/dist/types'
+import { arrayify } from 'eslint-mdx'
 import remarkMdx from 'remark-mdx'
 import remarkParse from 'remark-parse'
 import remarkStringify from 'remark-stringify'
 import unified from 'unified'
 
-import type { RemarkConfig } from './types'
+import type { RemarkConfig, RemarkPlugin } from './types'
 
 export const requirePkg = <T>(
   plugin: string,
@@ -90,9 +91,10 @@ export const getRemarkProcessor = (searchFrom: string, isMdx: boolean) => {
 
   return plugins
     .reduce((processor, pluginWithSettings) => {
-      const [plugin, ...pluginSettings] = Array.isArray(pluginWithSettings)
-        ? pluginWithSettings
-        : [pluginWithSettings]
+      const [plugin, ...pluginSettings] = arrayify(pluginWithSettings) as [
+        RemarkPlugin,
+        ...unknown[]
+      ]
       return processor.use(
         /* istanbul ignore next */
         typeof plugin === 'string'
diff --git a/packages/eslint-plugin-mdx/src/rules/index.ts b/packages/eslint-plugin-mdx/src/rules/index.ts
@@ -1,21 +1,18 @@
 /* istanbul ignore file */
 
 import { noJsxHtmlComments } from './no-jsx-html-comments'
-import { noUnescapedEntities } from './no-unescaped-entities'
 import { noUnusedExpressions } from './no-unused-expressions'
 import { remark } from './remark'
 
 export * from './helpers'
 export * from './types'
 
-export { noJsxHtmlComments, noUnescapedEntities, noUnusedExpressions, remark }
+export { noJsxHtmlComments, noUnusedExpressions, remark }
 
 export const rules = {
   'no-jsx-html-comments': noJsxHtmlComments,
-  'no-unescaped-entities': noUnescapedEntities,
   'no-unused-expressions': noUnusedExpressions,
   noJsxHtmlComments,
-  noUnescapedEntities,
   noUnusedExpressions,
   remark,
 }
diff --git a/packages/eslint-plugin-mdx/src/rules/no-unescaped-entities.ts b/packages/eslint-plugin-mdx/src/rules/no-unescaped-entities.ts
diff --git a/packages/eslint-plugin-mdx/typings.d.ts b/packages/eslint-plugin-mdx/typings.d.ts
@@ -4,12 +4,6 @@ declare module 'eslint/lib/rules/no-unused-expressions' {
   export = esLintNoUnusedExpressions
 }
 
-declare module 'eslint-plugin-react/lib/rules/no-unescaped-entities' {
-  import type { Rule } from 'eslint'
-  const reactNoUnescapedEntities: Rule.RuleModule
-  export = reactNoUnescapedEntities
-}
-
 declare module 'remark-mdx' {
   import type * as unified from 'unified'
   const mdx: unified.Attacher
diff --git a/test/__snapshots__/fixtures.test.ts.snap b/test/__snapshots__/fixtures.test.ts.snap
diff --git a/test/fixtures/287.mdx b/test/fixtures/287.mdx
diff --git a/test/helpers.test.ts b/test/helpers.test.ts
diff --git a/test/no-unescaped-entities.test.ts b/test/no-unescaped-entities.test.ts
diff --git a/test/parser.test.ts b/test/parser.test.ts
