[Fix] no-typos: fix crash on private methods

Fixes #3043.

Author: ljharb

CHANGELOG.md

@@ -19,6 +19,7 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel
 * [`destructuring-assignment`]: get the contextName correctly ([#3025][] @ohhoney1)
 * [`no-typos`]: prevent crash on styled components and forwardRefs ([#3036][] @ljharb)
 * [`destructuring-assignment`], component detection: handle default exports edge case ([#3038][] @vedadeepta)
+* [`no-typos`]: fix crash on private methods ([#3043][] @ljharb)
 
 ### Changed
 * [Docs] [`jsx-no-bind`]: updates discussion of refs ([#2998][] @dimitropoulos)
@@ -27,6 +28,7 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel
 * [Docs] [`require-default-props`]: fix small typo ([#2994][] @evsasse)
 * [Tests] add weekly scheduled smoke tests ([#2963][] @AriPerkkio)
 
+[#3043]: https://github.com/yannickcr/eslint-plugin-react/issues/3043
 [#3039]: https://github.com/yannickcr/eslint-plugin-react/pull/3039
 [#3038]: https://github.com/yannickcr/eslint-plugin-react/pull/3038
 [#3036]: https://github.com/yannickcr/eslint-plugin-react/issues/3036

lib/rules/no-typos.js

@@ -157,11 +157,12 @@ module.exports = {
     }
 
     function reportErrorIfLifecycleMethodCasingTypo(node) {
-      let nodeKeyName = node.key.name;
-      if (node.key.type === 'Literal') {
-        nodeKeyName = node.key.value;
+      const key = node.key;
+      let nodeKeyName = key.name;
+      if (key.type === 'Literal') {
+        nodeKeyName = key.value;
       }
-      if (node.computed && typeof nodeKeyName !== 'string') {
+      if (key.type === 'PrivateName' || (node.computed && typeof nodeKeyName !== 'string')) {
         return;
       }
 

tests/lib/rules/no-typos.js

@@ -8,7 +8,10 @@
 // Requirements
 // -----------------------------------------------------------------------------
 
+const babelEslintVersion = require('babel-eslint/package.json').version;
+const semver = require('semver');
 const RuleTester = require('eslint').RuleTester;
+
 const rule = require('../../../lib/rules/no-typos');
 
 const parsers = require('../../helpers/parsers');
@@ -656,7 +659,32 @@ ruleTester.run('no-typos', rule, {
     MyComponent.defaultProps = { value: "" };
     `,
     parserOptions
-  }),
+  }, semver.satisfies(babelEslintVersion, '>= 9') ? {
+    code: `
+      class Editor extends React.Component {
+          #somethingPrivate() {
+            // ...
+          }
+      
+          render() {
+          const { value = '' } = this.props;
+      
+          return (
+            <textarea>
+              {value}
+            </textarea>
+          );
+        }
+      }
+    `,
+    parser: require.resolve('babel-eslint'),
+    parserOptions: {
+      babelOptions: {
+        classPrivateMethods: true
+      },
+      shippedProposals: true
+    }
+  } : []),
 
   invalid: [].concat({
     code: `