ESLintのプラグインの修正

# はじめに

こんにちは、エンジニアのkeitaMaxです。

以前作成したプラグインを今回は修正しようと思います。

https://qiita.com/keitaMax/items/6337fb82e222b66894fe

# やりたいこと

mapを使用している時にpushを使用してはいけないルールを作成したのですが、以下のような場合の時にエラーにならないのでエラーにできるように作成していこうと思います。

```ts
    const a = [1, 2, 3]
    const b = []
    a.map(i => { 
      if(true){
        b.push(i) 
      }
    })
```

# 修正したコード

```ts
import { TSESTree } from '@typescript-eslint/utils'
import { RuleModule } from '@typescript-eslint/utils/dist/eslint-utils'

type Options = {
  include?: string[],
  exclude?: string[]
}

export const notUsePushInMapRule: RuleModule<'notUsePushInMap', [Options]> = {
  meta: {
    type: 'suggestion',
    docs: {
      description: 'Disallow the use of push inside map method',
    },
    messages: {
      notUsePushInMap: "Do not use push inside a map method."
    },
    schema: [
      {
        type: "object",
        additionalProperties: false,
        properties: {
          include: {
            type: "array",
            items: {
              type: "string"
            },
            minItems: 0
          },
          exclude: {
            type: "array",
            items: {
              type: "string"
            },
            minItems: 0
          }
        }
      }
    ]
  },
  defaultOptions: [{
    include: ["./src/**/*.js", "./src/**/*.ts", "./src/**/*.jsx", "./src/**/*.tsx"],
    exclude: [],
  }],
  create(context) {
    const options = context.options[0] || {}
    const filename = context.filename
    const includePatterns = options.include?.map((pattern: string) => new RegExp(pattern.replace(/\*\*/g, '.*')))
    const excludePatterns = options.exclude?.map((pattern: string) => new RegExp(pattern.replace(/\*\*/g, '.*')))
    // ファイルが対象外かどうかを判定
    const isFileExcluded = () => {
      const isIncluded = includePatterns?.some((regex) => regex.test(filename)) ?? true
      const isExcluded = excludePatterns?.some((regex) => regex.test(filename)) ?? false
      return !isIncluded || isExcluded;
    };
    // ファイルが対象外であればルールをスキップ
    if (isFileExcluded()) {
      return {}
    }

    return {
      CallExpression(node: TSESTree.CallExpression) {
        const callee = node.callee
        if (callee.type !== 'MemberExpression' ||
          callee.property.type !== 'Identifier' ||
          callee.property.name !== 'map') {
          // mapを使用していない場合はチェックしない
          return
        }

        const callback = node.arguments[0]
        if (!callback || (callback.type !== 'FunctionExpression' && callback.type !== 'ArrowFunctionExpression')) {
          // .map() か .map(function()) の場合でないときはチェックしない
          return
        }
        const body = callback.body

        // 実際にPushを使用しているかどうかのチェック
        const checkPushCall = (expression: TSESTree.Expression) => {
          if (expression.type !== 'CallExpression') return
          const innerCall = expression.callee
          if (
            innerCall.type === 'MemberExpression' &&
            innerCall.property.type === 'Identifier' &&
            innerCall.property.name === 'push'
          ) {
            // map 内で push を使用している場合に報告
            context.report({
              node: innerCall,
              messageId: 'notUsePushInMap',
            });
          }
        }
        
        // 追加⬇︎
        
        //　再帰的に検知する  
        const checkIfState = (statement: TSESTree.Statement) => {
          if (statement.type !== "IfStatement") return
          const consequent = statement.consequent
          if (consequent.type === "BlockStatement") {
            consequent.body.forEach((innerStatement: TSESTree.Statement) => {
              if (innerStatement.type === "ExpressionStatement") {
                checkPushCall(innerStatement.expression)
              } else {
                checkIfState(innerStatement)
              }
            })
          }
          if (consequent.type === "ExpressionStatement") {
            checkPushCall(consequent.expression)
          }
        }

        if (body.type === 'BlockStatement') {
          // map(i=> {}) のかたちのもの
          body.body.forEach(statement => {
            if (statement.type === 'ExpressionStatement') {
              checkPushCall(statement.expression)
            } else {
        　　　　// 追加⬇︎
              checkIfState(statement)
            }
          });
        } else {
          // map(i=> {}) のかたち以外のもの
          checkPushCall(body)
        }

      }
    }
  }
}

module.exports = notUsePushInMapRule

```

このように修正しました。

```ts
        // 実際にPushを使用しているかどうかのチェック
        const checkPushCall = (expression: TSESTree.Expression) => {
          if (expression.type !== 'CallExpression') return
          const innerCall = expression.callee
          if (
            innerCall.type === 'MemberExpression' &&
            innerCall.property.type === 'Identifier' &&
            innerCall.property.name === 'push'
          ) {
            // map 内で push を使用している場合に報告
            context.report({
              node: innerCall,
              messageId: 'notUsePushInMap',
            });
          }
        }
```

ここはif文のネストが深くても検知したかったのでこのように再帰的に検知するようにしました。

# テスト

テストを以下のように追加しました。

```ts
const { RuleTester } = require("eslint")
const rule = require("../lib/rules/notUsePushInMap")

const tester = new RuleTester()

tester.run("rule", rule, {
  valid: [
    { code: "const a = [1, 2, 3];const b = [];a.foreach(i => b.push(i))" },
    { code: "const a = [1, 2, 3];const b = [];a.foreach(i => {if(true){b.push(i)}})" }
  ],
  invalid: [
    { code: "const a = [1, 2, 3];const b = [];a.map(i => b.push(i))", errors: [{ message: "Do not use push inside a map method." }] },
    { code: "const a = [1, 2, 3];const b = [];a.map(i => {if(true){b.push(i)}})", errors: [{ message: "Do not use push inside a map method." }] }
  ]
})
```
あらたしくif分を含んだものを増やしています。

これで以下のコマンドで実行すると

```
npm run test
```

```
% npm run test
> eslint-plugin-hitasura-system-develop@0.0.5 test
> jest test/*.ts

 PASS  test/notUsePushInMap.test.ts
  rule
    valid
      ✓ const a = [1, 2, 3];const b = [];a.foreach(i => b.push(i)) (17 ms)
      ✓ const a = [1, 2, 3];const b = [];a.foreach(i => {if(true){b.push(i)}}) (4 ms)
    invalid
      ✓ const a = [1, 2, 3];const b = [];a.map(i => b.push(i)) (2 ms)
      ✓ const a = [1, 2, 3];const b = [];a.map(i => {if(true){b.push(i)}}) (2 ms)

Test Suites: 1 passed, 1 total
Tests:       4 passed, 4 total
Snapshots:   0 total
Time:        1.141 s
Ran all test suites matching /test\/notUsePushInMap.test.ts/i.

```

テストが成功しました。

# おわりに

この記事での質問や、間違っている、もっといい方法があるといったご意見などありましたらご指摘していただけると幸いです。

最後まで読んでいただきありがとうございました！

# 次の記事

https://qiita.com/keitaMax/private/3feb1a43c24917a6ee69