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

Jessidhia · 2019-08-07T02:39:54Z

For now I only quickly went through the changes in the changelog at facebook/react#16254. Will check for more things on the entry points later.

Please fill in this template.

Use a meaningful title for the pull request. Include the name of the package modified.
Test the change in your own code. (Compile and run.)
Add or edit tests to reflect the change. (Run with npm test.)
Follow the advice from the readme.
Avoid common mistakes.
Run npm run lint package-name (or tsc if no tslint.json is present).

Select one of these and delete the others:

If changing an existing definition:

Provide a URL to documentation or source code which provides context for the suggested changes: Changelog for 16.9 facebook/react#16254
If this PR brings the type definitions up to date with a new version of the JS library, update the version number in the header.
If you are making substantial changes, consider adding a tslint.json containing { "extends": "dtslint/dt.json" }.

facebook/react#16254

Jessidhia · 2019-08-07T02:41:30Z

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

+ */
+// 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>;


() => Promise<void> would essentially accept Promise<any>, so it's |ed with undefined to enforce no values are returned. Just Promise<undefined> would reject void functions.

Does this affect the test renderer runtime at all if the Promise resolves to a defined value? I think some developers like to combine early returns with an evaluation (still not caring about the return value)

if (somethingThatMakesMeReturnEarly) { return doSomethingElse() }

What's the problem with Promise<any>?

I'm incurring into an error when trying to do something like this:

await act(() => expect(result.current.validate()).rejects.toEqual({ a: "error" }) );

expect(somePromise).rejects.toEqual() will return the same type returned by somePromise. Test passes, but TypeScript is complaining: Type 'Promise<SomePromiseReturn>' is not assignable to type 'void'.

@diegoazh Please open an issue with the full error message. May also be an issue with the jest typings.

In any case: I would keep it simply an just await result.current.validate() toThrow and wrap it in a callback that's just void. It's not obvious anyway that expect.rejects returns a promise which makes this act harder to read than necessary.

Jessidhia · 2019-08-07T02:42:23Z

types/react/index.d.ts

-        /**
-         * Not implemented yet, requires unstable_ConcurrentMode
-         */
-        // maxDuration?: number;


Both this and unstable_ConcurrentMode were removed. unstable_ConcurrentMode was never added to the types anyway.

Jessidhia · 2019-08-07T02:42:30Z

types/react/index.d.ts

@@ -382,7 +375,7 @@ declare namespace React {
        onRender: ProfilerOnRenderCallback;
    }

-    const unstable_Profiler: ExoticComponent<ProfilerProps>;
+    const Profiler: ExoticComponent<ProfilerProps>;


Just renamed.

Jessidhia · 2019-08-07T02:42:49Z

types/react/index.d.ts

@@ -2199,6 +2192,7 @@ declare namespace React {
        playsInline?: boolean;
        poster?: string;
        width?: number | string;
+        disablePictureInPicture?: boolean;


https://github.com/facebook/react/pull/15334/files#diff-e19827754462ba391be5fc99b7a3ca09R297

Added as a boolean property.

Jessidhia · 2019-08-07T02:43:54Z

types/react/test/tsx.tsx

-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


typescript-bot · 2019-08-07T03:22:34Z

@Jessidhia Thank you for submitting this PR!

🔔 @johnnyreilly @bbenezech @pzavolinsky @digiguru @ericanderson @DovydasNavickas @onigoetz @theruther4d @guilhermehubner @ferdaber @jrakotoharisoa @pascaloliv @Hotell @franklixuefei @saranshkataria @lukyth @eps1lon @arvitaly @lochbrunner @jgoz - please review this PR in the next few days. Be sure to explicitly select Approve or Request Changes in the GitHub UI so I know what's going on.

If no reviewer appears after a week, a DefinitelyTyped maintainer will review the PR instead.

typescript-bot · 2019-08-07T03:22:36Z

Since you're a listed owner and the build passed, this PR is fast-tracked. A maintainer will merge shortly. If it shouldn't be merged yet, please leave a comment saying so and we'll wait. Thank you for your contribution to DefinitelyTyped!

Jessidhia · 2019-08-07T05:54:53Z

I thought of adding this as an additional file inside the project, but I couldn't find any way that works well. dtslint doesn't like module augmentation within the same module, and when I get something that does appear to work with @next, it breaks with certain versions of typescript.

// Definitions for unstable APIs present in React
// Current to 16.9.0-rc.0

declare namespace React {
    //#region unflagged features
    export interface UnstableSuspenseListPropsCommon {
        // ReactFiberSuspenseComponent:SuspenseListTailMode
        // ReactFiberBeginWork:validateTailOptions
        tail?: 'collapsed' | 'hidden';
    }
    export interface UnstableSuspenseListPropsUnordered extends UnstableSuspenseListPropsCommon {
        // ReactFiberBeginWork:validateRevealOrder
        revealOrder?: 'together';
        // ReactFiberBeginWork:validateSuspenseListChildren
        children?: ReactNode;
    }
    export interface UnstableSuspenseListPropsOrdered extends UnstableSuspenseListPropsCommon {
        // children are only validated when the revealOrder is either of these values

        // ReactFiberBeginWork:validateRevealOrder
        // ReactFiberBeginWork:validateSuspenseListChildren
        revealOrder: 'forwards' | 'backwards';
        // ReactFiberBeginWork:validateSuspenseListChildren
        // Array works too but this accepts any Iterable, including Array
        children?: Iterable<ReactChild | undefined | null | false> | null | false;
    }

    export type UnstableSuspenseListProps = UnstableSuspenseListPropsOrdered | UnstableSuspenseListPropsUnordered;

    export const unstable_SuspenseList: ExoticComponent<UnstableSuspenseListProps>;

    export interface UnstableSuspenseConfig {
        timeoutMs: number;
        busyDelayMs?: number;
        busyMinDurationMs?: number;
    }

    // https://github.com/facebook/react/pull/15593
    export function unstable_withSuspenseConfig(
        scope: () => void | undefined,
        config?: UnstableSuspenseConfig | null,
    ): void;
    //#endregion

    //#region enableFlareAPI
    // https://github.com/facebook/react/blob/v16.9.0-rc.0/packages/shared/forks/ReactFeatureFlags.www.js#L73
    // NOTE: the actual internal implementations are on the reconciler,
    // so this uses the react-dom reconciler as the reference right now.
    // only HostComponent (i.e. DOM nodes) can receive listeners
    // TODO: requires declaring react-events package
    //#endregion

    //#region enableFundamentalAPI
    // https://github.com/facebook/react/blob/v16.9.0-rc.0/packages/shared/forks/ReactFeatureFlags.www.js#L75
    // https://github.com/facebook/react/pull/16049
    // "Note: this is a completely private API for internal experimentation use only",
    // and its flag is turned off, so not defined.
    //#endregion

    //#region enableJSXTransformAPI
    // https://github.com/facebook/react/blob/v16.9.0-rc.0/packages/shared/forks/ReactFeatureFlags.www.js#L77
    // implementation of https://github.com/reactjs/rfcs/pull/107
    export function jsx<C extends ElementType>(
        type: C,
        config: JSX.LibraryManagedAttributes<C, ComponentPropsWithRef<C>>,
        maybeKey?: Key,
    ): ReactElement<ComponentPropsWithRef<C>, C>;
    // TODO: implement the difference between jsx and jsxs
    // (there isn't one, really, but jsxs is more optimized when multiple children are passed)
    export { jsx as jsxs };
    /**
     * NOTE: undefined in production builds
     */
    export function jsxDEV<C extends ElementType>(
        type: C,
        config: JSX.LibraryManagedAttributes<C, ComponentPropsWithRef<C>>,
        maybeKey?: Key,
        source?: { fileName: string; lineNumber: number },
        self?: C,
    ): ReactElement<ComponentPropsWithRef<C>, C>;
    //#endregion

    //#region enableSuspenseCallback
    // https://github.com/facebook/react/blob/v16.9.0-rc.0/packages/shared/forks/ReactFeatureFlags.www.js#L81
    export interface SuspenseProps {
        callback?(queuedUpdates: ReadonlySet<PromiseLike<any>>): void;
    }
    //#endregion
}

Jessidhia · 2019-08-07T06:22:56Z

It looks like npm run test just fails everywhere because of a race condition within npm.

sandersn · 2019-08-07T21:22:05Z

I restarted the build for now, but I probably need to ship the make-npm-install-single-threaded fix from dtslint-runner to types-publisher as well.

Jessidhia · 2019-08-09T01:44:34Z

16.9.0 is released so releasing this 🎉

typescript-bot · 2019-08-09T01:48:37Z

I just published @types/react@16.9.0 to npm.

typescript-bot · 2019-08-09T01:48:56Z

I just published @types/react-test-renderer@16.9.0 to npm.

…Typed#37426) facebook/react#16254

react: Update types for changes declared in the CHANGELOG

b7ba850

facebook/react#16254

Jessidhia requested a review from johnnyreilly as a code owner August 7, 2019 02:39

Jessidhia commented Aug 7, 2019

View reviewed changes

typescript-bot added this to Check and Merge in Pull Request Status Board Aug 7, 2019

typescript-bot added Popular package This PR affects a popular package (as counted by NPM download counts). Awaiting reviewer feedback Author is Owner The author of this PR is a listed owner of the package. labels Aug 7, 2019

Jessidhia merged commit bcd1302 into DefinitelyTyped:master Aug 9, 2019

Pull Request Status Board automation moved this from Check and Merge to Done Aug 9, 2019

Jessidhia deleted the react-16-9-update branch August 9, 2019 01:44

typescript-bot removed this from Done in Pull Request Status Board Aug 9, 2019

eps1lon mentioned this pull request Aug 12, 2019

feat(react-dom): Add async act #37554

Merged

8 tasks

iRON5 pushed a commit to iRON5/DefinitelyTyped that referenced this pull request Aug 13, 2019

react, react-test-renderer: Update React types for 16.9.0 (Definitely…

f7319fe

…Typed#37426) facebook/react#16254

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

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

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

Jessidhia commented Aug 7, 2019

Jessidhia Aug 7, 2019

ferdaber Aug 7, 2019

diegohaz Aug 10, 2019

eps1lon Aug 12, 2019

Jessidhia Aug 7, 2019

Jessidhia Aug 7, 2019

Jessidhia Aug 7, 2019

Jessidhia Aug 7, 2019

typescript-bot commented Aug 7, 2019 •

edited

typescript-bot commented Aug 7, 2019

Jessidhia commented Aug 7, 2019

Jessidhia commented Aug 7, 2019

sandersn commented Aug 7, 2019

Jessidhia commented Aug 9, 2019

typescript-bot commented Aug 9, 2019

typescript-bot commented Aug 9, 2019

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

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

Conversation

Jessidhia commented Aug 7, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

typescript-bot commented Aug 7, 2019 • edited

typescript-bot commented Aug 7, 2019

Jessidhia commented Aug 7, 2019

Jessidhia commented Aug 7, 2019

sandersn commented Aug 7, 2019

Jessidhia commented Aug 9, 2019

typescript-bot commented Aug 9, 2019

typescript-bot commented Aug 9, 2019

typescript-bot commented Aug 7, 2019 •

edited