Fix TypeScript decorator support (#5783)

* Fix TypeScript decorator support

* Update babel flow override

* WIP

Author: ianschmitz

packages/babel-preset-react-app/create.js

@@ -113,8 +113,13 @@ module.exports = function(api, opts, env) {
       // Strip flow types before any other transform, emulating the behavior
       // order as-if the browser supported all of the succeeding features
       // https://github.com/facebook/create-react-app/pull/5182
-      isFlowEnabled &&
+      // We will conditionally enable this plugin below in overrides as it clashes with
+      // @babel/plugin-proposal-decorators when using TypeScript.
+      // https://github.com/facebook/create-react-app/issues/5741
+      isFlowEnabled && [
         require('@babel/plugin-transform-flow-strip-types').default,
+        false,
+      ],
       // Experimental macros support. Will be documented after it's had some time
       // in the wild.
       require('babel-plugin-macros'),
@@ -177,6 +182,10 @@ module.exports = function(api, opts, env) {
         require('babel-plugin-dynamic-import-node'),
     ].filter(Boolean),
     overrides: [
+      isFlowEnabled && {
+        exclude: /\.tsx?$/,
+        plugins: [require('@babel/plugin-transform-flow-strip-types').default],
+      },
       isTypeScriptEnabled && {
         test: /\.tsx?$/,
         plugins: [

test/fixtures/typescript/src/App.test.ts

@@ -6,3 +6,9 @@ it('reads a typescript file with no syntax error', () => {
   expect(App.foo.baz!.n).toBe(123);
   expect(app.n).toBe(123);
 });
+
+it('supports decorators', () => {
+  const app = new App();
+  expect((app as any).annotated).toBe(true);
+  expect(app.decorated).toBe(42);
+});

test/fixtures/typescript/src/App.ts

@@ -10,10 +10,23 @@ type MyObject = Pick<MyType, 'bar' | 'baz'>;
 class App {
   static foo: MyObject = { bar: true, baz: { n: 123 } };
   n = App.foo.baz!.n;
+  @propertyDecorator
+  decorated;
 }
 
 function annotation(target: any) {
   target.annotated = true;
 }
 
+function propertyDecorator(target: any, key: string) {
+  if (delete target[key]) {
+    Object.defineProperty(target, key, {
+      get() {
+        return 42;
+      },
+      enumerable: true,
+    });
+  }
+}
+
 export default App;