add replace-string-ref codemod

Author: dmytro068

bin/cli.js

@@ -227,6 +227,11 @@ const TRANSFORMER_INQUIRER_CHOICES = [
       'replace-act-import: Updates `act` import',
     value: 'replace-act-import'
   },
+  {
+    name:
+      'replace-string-ref: Replaces deprecated string ref with callback ref',
+    value: 'replace-string-ref'
+  },
 ];
 
 const PARSER_INQUIRER_CHOICES = [

transforms/__testfixtures__/replace-string-ref/class-component-custom-import-names.input.js

@@ -0,0 +1,13 @@
+import React1, { PureComponent as PureComponent1 } from "react";
+
+class C extends React1.Component {
+  render() {
+    return <div ref="refName" />;
+  }
+}
+
+class C1 extends PureComponent1 {
+  render() {
+    return <div ref="refName" />;
+  }
+}

transforms/__testfixtures__/replace-string-ref/class-component-custom-import-names.output.js

@@ -0,0 +1,21 @@
+import React1, { PureComponent as PureComponent1 } from "react";
+
+class C extends React1.Component {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}
+
+class C1 extends PureComponent1 {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}

transforms/__testfixtures__/replace-string-ref/class-component-default-import.input.js

@@ -0,0 +1,13 @@
+import React from "react";
+
+class C extends React.Component {
+  render() {
+    return <div ref="refName" />;
+  }
+}
+
+class C1 extends React.PureComponent {
+  render() {
+    return <div ref="refName" />;
+  }
+}

transforms/__testfixtures__/replace-string-ref/class-component-default-import.output.js

@@ -0,0 +1,21 @@
+import React from "react";
+
+class C extends React.Component {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}
+
+class C1 extends React.PureComponent {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}

transforms/__testfixtures__/replace-string-ref/class-component-named-import.input.js

@@ -0,0 +1,13 @@
+import { Component, PureComponent } from "react";
+
+class C extends Component {
+  render() {
+    return <div ref="refName" />;
+  }
+}
+
+class C1 extends PureComponent {
+  render() {
+    return <div ref="refName" />;
+  }
+}

transforms/__testfixtures__/replace-string-ref/class-component-named-import.output.js

@@ -0,0 +1,21 @@
+import { Component, PureComponent } from "react";
+
+class C extends Component {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}
+
+class C1 extends PureComponent {
+  render() {
+    return (
+      <div ref={(ref) => {
+        this.refs.refName = ref;
+      }} />
+    );
+  }
+}

transforms/__testfixtures__/replace-string-ref/function-component.input.js

@@ -0,0 +1,3 @@
+const C = () => {
+  return <div ref="refName" />;
+};

transforms/__testfixtures__/replace-string-ref/function-component.output.js

@@ -0,0 +1,25 @@
+
+
+'use strict';
+
+const tests = [
+  'class-component-custom-import-names',
+  'class-component-default-import', 
+  'class-component-named-import', 
+  'function-component', 
+];
+
+const defineTest = require('jscodeshift/dist/testUtils').defineTest;
+
+describe('replace-string-ref', () => {
+
+  tests.forEach(test =>
+    defineTest(
+      __dirname,
+      'replace-string-ref',
+      null,
+      `replace-string-ref/${ test }`
+    )
+  );
+
+});