Add TypeScript Support

[skovy]

Note: this is a branch off #227 and it must be merged first.

Motivation

Now that jscodeshift supports TypeScript (added in v0.6.0) the react-codemod scripts can also support TypeScript without any custom logic.

Resolves #206.

Changes

• Upgrade to the latest version of jscodeshift to get parser support for TypeScript
• Update the defineTest helper in jscodeshift
  • The current helper doesn't allow a way to dynamically define the parser
  • The current helper assumes the file is always .js (not true for TypeScript)
• Fix tests to define the parser for those that need it (some flow tests that now break with the newer version of jscodeshift)
• Add basic tests for a TypeScript scenario for renaming deprecated lifecycle methods
• Update the rename-unsafe-lifecycles to also replace ClassMethod for TypeScript classes

Testing

• Tested against a TypeScript React public codebase: Rename unsafe React lifecycle methods codesandbox/codesandbox-client#2159
• Upgrade Jest and Babel dependencies #227 and Support different parsers in the test utils facebook/jscodeshift#332 changes must first be merged, until then
  • Clone jscodeshift locally and checkout the branch with the necessary changes
  • In the jscodeshift directory yarn link
  • In this directory, yarn link jscodeshift
• yarn test

[threepointone]

Sorry I missed this. I have another PR I'm trying to land today that updates jscodeshift as well #229 I'm trying to land this asap so we can do a react alpha release.

[skovy]

Hey @threepointone, thanks for the heads up 👍 let me know if there are any changes I can make to help add TS support. Looks like you mostly have it in that PR and maybe the only thing left in this one are the tests and the one addition to the transform for renaming unsafe lifecycles?

The tests I added to require a change to jscodeshift test utils to allow testing things other than js.

[threepointone]

I don't expect the jscodeshift PR to land any time soon, so I'd recommend using the Object.assign hack https://github.com/reactjs/react-codemod/blob/master/transforms/__tests__/rename-unsafe-lifecycles-test.js#L13-L17 I'm not sure of a workaround for the extension.

To simplify, I'm happy to accept a PR with just this

root
    .find(j.ClassMethod)
    .forEach(renameDeprecatedApis);

in rename-unsafe-lifecycles.js, since that seems to be the core change.

[threepointone]

I made a separate PR for the same here #234 so I can publish an update this weekend. Thank you for the effort!

[threepointone]

closing this since #234 landed.

[skovy]

@threepointone thanks for getting that merged. Should I pull out this test and use the Object.assign hack to prevent potential regressions?

[threepointone]

Ideally so, but I’m not sure how you’ll run the tests in tsx files. Or is that not necessary?