react, react-test-renderer: Update React types for 16.9.0 (#37426)

https://github.com/facebook/react/pull/16254

types/react-test-renderer/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for react-test-renderer 16.8
+// Type definitions for react-test-renderer 16.9
 // Project: https://facebook.github.io/react/
 // Definitions by: Arvitaly <https://github.com/arvitaly>
 //                 Lochbrunner <https://github.com/lochbrunner>
@@ -53,6 +53,20 @@ export interface TestRendererOptions {
 }
 export function create(nextElement: ReactElement, options?: TestRendererOptions): ReactTestRenderer;
 
+/**
+ * Wrap any code rendering and triggering updates to your components into `act()` calls.
+ *
+ * Ensures that the behavior in your tests matches what happens in the browser
+ * more closely by executing pending `useEffect`s before returning. This also
+ * reduces the amount of re-renders done.
+ *
+ * @param callback An asynchronous, void callback that will execute as a single, complete React commit.
+ *
+ * @see https://reactjs.org/blog/2019/02/06/react-v16.8.0.html#testing-hooks
+ */
+// the "void | undefined" is here to forbid any sneaky return values
+// tslint:disable-next-line: void-return
+export function act(callback: () => Promise<void | undefined>): Promise<undefined>;
 /**
  * Wrap any code rendering and triggering updates to your components into `act()` calls.
  *
@@ -71,6 +85,9 @@ export function act(callback: () => void | undefined): DebugPromiseLike;
 // Intentionally doesn't extend PromiseLike<never>.
 // Ideally this should be as hard to accidentally use as possible.
 export interface DebugPromiseLike {
-    // the actual then() in here is 0-ary, but that doesn't count as a PromiseLike.
-    then(onfulfilled: (value: never) => never, onrejected: (reason: never) => never): never;
+  // the actual then() in here is 1-ary, but that doesn't count as a PromiseLike.
+  then(
+    onfulfilled: (value: never) => never,
+    onrejected: (reason: never) => never,
+  ): never;
 }

types/react-test-renderer/react-test-renderer-tests.ts

@@ -70,8 +70,19 @@ shallowRenderer.getMountedInstance();
 // Only synchronous, void callbacks are acceptable for act()
 act(() => {});
 // $ExpectError
-act(async () => {});
-// $ExpectError
 act(() => null);
 // $ExpectError
 Promise.resolve(act(() => {}));
+
+// async act is now acceptable in React 16.9,
+// but the result must be void or undefined
+Promise.resolve(act(async () => {}));
+
+void (async () => {
+    act(() => {});
+
+    await act(async () => {});
+    await act(async () => undefined);
+    // $ExpectError
+    await act(async () => null);
+})();

types/react/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for React 16.8
+// Type definitions for React 16.9
 // Project: http://facebook.github.io/react/
 // Definitions by: Asana <https://asana.com>
 //                 AssureSign <http://www.assuresign.com>
@@ -349,13 +349,6 @@ declare namespace React {
 
         /** A fallback react tree to show when a Suspense child (like React.lazy) suspends */
         fallback: NonNullable<ReactNode>|null;
-
-        // I tried looking at the code but I have no idea what it does.
-        // https://github.com/facebook/react/issues/13206#issuecomment-432489986
-        /**
-         * Not implemented yet, requires unstable_ConcurrentMode
-         */
-        // maxDuration?: number;
     }
     /**
      * This feature is not yet available for server-side rendering.
@@ -382,7 +375,7 @@ declare namespace React {
         onRender: ProfilerOnRenderCallback;
     }
 
-    const unstable_Profiler: ExoticComponent<ProfilerProps>;
+    const Profiler: ExoticComponent<ProfilerProps>;
 
     //
     // Component API
@@ -2200,6 +2193,7 @@ declare namespace React {
         playsInline?: boolean;
         poster?: string;
         width?: number | string;
+        disablePictureInPicture?: boolean;
     }
 
     // this list is "complete" in that it contains every SVG attribute

types/react/test/tsx.tsx

@@ -321,7 +321,7 @@ const ForwardRef3 = React.forwardRef(
 <ForwardRef3 ref={divFnRef}/>;
 <ForwardRef3 ref={divRef}/>;
 
-const Profiler = React.unstable_Profiler;
+const { Profiler } = React;
 
 // 'id' is missing
 <Profiler />; // $ExpectError
@@ -357,8 +357,14 @@ const Profiler = React.unstable_Profiler;
 </Profiler>;
 
 type ImgProps = React.ComponentProps<'img'>;
-// $ExpectType "async" | "auto" | "sync" | undefined
-type ImgPropsDecoding = ImgProps['decoding'];
+const imgProps: ImgProps = {};
+// the order of the strings in the union seems to vary
+// with the typescript version, so test assignment instead
+imgProps.decoding = 'async';
+imgProps.decoding = 'auto';
+imgProps.decoding = 'sync';
+// $ExpectError
+imgProps.decoding = 'nonsense';
 type ImgPropsWithRef = React.ComponentPropsWithRef<'img'>;
 // $ExpectType ((instance: HTMLImageElement | null) => void) | RefObject<HTMLImageElement> | null | undefined
 type ImgPropsWithRefRef = ImgPropsWithRef['ref'];