Support ref without initializer

Author: qnighy

CHANGELOG.md

@@ -1,5 +1,8 @@
 ## Unreleased
 
+- Fixed
+  - Don't fail if user-defined class field (e.g. `this.foo`) is assigned without initializing.
+
 ## 0.1.7
 
 - Added

src/analysis/user_defined.ts

@@ -56,7 +56,7 @@ export type UserDefinedRef = {
 export type UserDefinedDirectRef = {
   type: "user_defined_direct_ref";
   localName?: string | undefined;
-  init: NodePath<Expression>;
+  init: NodePath<Expression> | undefined;
   typeAnnotation?: NodePath<TSType> | undefined;
   sites: ClassFieldSite[];
 };
@@ -204,15 +204,13 @@ export function analyzeUserDefined(
         typeAnnotation: refInitType1 ?? refInitType2,
         sites: field.sites,
       });
-    } else if (valInit) {
+    } else {
       fields.set(name, {
         type: "user_defined_direct_ref",
         init: valInit,
         typeAnnotation: valInitType,
         sites: field.sites,
       });
-    } else {
-      throw new AnalysisError(`Cannot transform this.${name}`);
     }
   }
 

src/index.test.ts

@@ -991,6 +991,35 @@ describe("react-declassify", () => {
       expect(transform(input)).toBe(output);
     });
 
+    it("transforms class field without initializer as useRef", () => {
+      const input = dedent`\
+        class C extends React.Component {
+          constructor(props) {
+            super(props);
+          }
+
+          foo() {
+            console.log(this.div);
+          }
+
+          render() {
+            return <div ref={(elem) => this.div = elem} />;
+          }
+        }
+      `;
+      const output = dedent`\
+        const C = () => {
+          function foo() {
+            console.log(div.current);
+          }
+
+          const div = React.useRef(undefined);
+          return <div ref={(elem) => div.current = elem} />;
+        };
+      `;
+      expect(transform(input)).toBe(output);
+    });
+
     it("transforms typed class field as useRef", () => {
       const input = dedent`\
         class C extends React.Component {

src/index.ts

@@ -317,7 +317,11 @@ function transformClass(analysis: AnalysisResult, options: { ts: boolean }, babe
       // const foo = useRef(init);
       const call = t.callExpression(
         getReactImport("useRef", babel, analysis.superClassRef),
-        [field.init.node]
+        [
+          field.init
+          ? field.init.node
+          : t.identifier("undefined")
+        ]
       );
       preamble.push(t.variableDeclaration(
         "const",