diff --git a/README.md b/README.md index 2ce3b184..997f9433 100644 --- a/README.md +++ b/README.md @@ -24,6 +24,14 @@ Converts calls to `React.createElement` into JSX elements. jscodeshift -t react-codemod/transforms/create-element-to-jsx.js ``` +#### `error-boundaries` + +Renames the experimental `unstable_handleError` lifecycle hook to `componentDidCatch`. + +```sh +jscodeshift -t react-codemod/transforms/error-boundaries.js +``` + #### `findDOMNode` Updates `this.getDOMNode()` or `this.refs.foo.getDOMNode()` calls inside of diff --git a/transforms/__testfixtures__/error-boundaries/class-component.input.js b/transforms/__testfixtures__/error-boundaries/class-component.input.js new file mode 100644 index 00000000..15ae076d --- /dev/null +++ b/transforms/__testfixtures__/error-boundaries/class-component.input.js @@ -0,0 +1,15 @@ +import React from "react"; + +export class ComponentOne extends React.Component { + unstable_handleError(error) {} + render() { + return
; + } +} + +export class ComponentTwo extends React.Component { + unstable_handleError = error => {}; + render() { + return
; + } +} diff --git a/transforms/__testfixtures__/error-boundaries/class-component.output.js b/transforms/__testfixtures__/error-boundaries/class-component.output.js new file mode 100644 index 00000000..f097836d --- /dev/null +++ b/transforms/__testfixtures__/error-boundaries/class-component.output.js @@ -0,0 +1,15 @@ +import React from "react"; + +export class ComponentOne extends React.Component { + componentDidCatch(error) {} + render() { + return
; + } +} + +export class ComponentTwo extends React.Component { + componentDidCatch = error => {}; + render() { + return
; + } +} diff --git a/transforms/__testfixtures__/error-boundaries/create-class-component.input.js b/transforms/__testfixtures__/error-boundaries/create-class-component.input.js new file mode 100644 index 00000000..e83da59e --- /dev/null +++ b/transforms/__testfixtures__/error-boundaries/create-class-component.input.js @@ -0,0 +1,18 @@ +var React = require("react"); +var createClass = require("create-react-class"); + +var ComponentOne = createClass({ + render: function() { + return
; + }, + unstable_handleError: function(error) {} +}); + +var ComponentTwo = createClass({ + render() { + return
; + }, + unstable_handleError(error) {} +}); + +module.exports = { ComponentOne, ComponentTwo }; diff --git a/transforms/__testfixtures__/error-boundaries/create-class-component.output.js b/transforms/__testfixtures__/error-boundaries/create-class-component.output.js new file mode 100644 index 00000000..4e0261e9 --- /dev/null +++ b/transforms/__testfixtures__/error-boundaries/create-class-component.output.js @@ -0,0 +1,18 @@ +var React = require("react"); +var createClass = require("create-react-class"); + +var ComponentOne = createClass({ + render: function() { + return
; + }, + componentDidCatch: function(error) {} +}); + +var ComponentTwo = createClass({ + render() { + return
; + }, + componentDidCatch(error) {} +}); + +module.exports = { ComponentOne, ComponentTwo }; diff --git a/transforms/__tests__/error-boundaries.js b/transforms/__tests__/error-boundaries.js new file mode 100644 index 00000000..49470560 --- /dev/null +++ b/transforms/__tests__/error-boundaries.js @@ -0,0 +1,19 @@ +/** + * Copyright 2013-2015, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + * + */ + +"use strict"; + +const tests = ["class-component", "create-class-component"]; + +const defineTest = require("jscodeshift/dist/testUtils").defineTest; + +tests.forEach(test => { + defineTest(__dirname, "error-boundaries", null, `error-boundaries/${test}`); +}); diff --git a/transforms/error-boundaries.js b/transforms/error-boundaries.js new file mode 100644 index 00000000..c9e56283 --- /dev/null +++ b/transforms/error-boundaries.js @@ -0,0 +1,12 @@ +module.exports = function(file, api, options) { + const j = api.jscodeshift; + + return j(file.source) + .find(j.Identifier) + .forEach(path => { + if (path.node.name === "unstable_handleError") { + j(path).replaceWith(j.identifier("componentDidCatch")); + } + }) + .toSource(); +};