react-relay 20.1.1 → 21.0.1

package/relay-hooks/QueryResource.js.flow

@@ -41,9 +41,9 @@ export type QueryResource = QueryResourceImpl;
 
 type QueryResourceCache = Cache<QueryResourceCacheEntry>;
 type QueryResourceCacheEntry = {
-  +id: number,
-  +cacheIdentifier: string,
-  +operationAvailability: ?OperationAvailability,
+  readonly id: number,
+  readonly cacheIdentifier: string,
+  readonly operationAvailability: ?OperationAvailability,
   // The number of received payloads for the operation.
   // We want to differentiate the initial graphql response for the operation
   // from the incremental responses, so later we can choose how to handle errors
@@ -58,12 +58,12 @@ type QueryResourceCacheEntry = {
 };
 export opaque type QueryResult: {
   fragmentNode: ReaderFragment,
-  fragmentRef: mixed,
+  fragmentRef: unknown,
   ...
 } = {
   cacheIdentifier: string,
   fragmentNode: ReaderFragment,
-  fragmentRef: mixed,
+  fragmentRef: unknown,
   operation: OperationDescriptor,
 };
 
@@ -206,7 +206,7 @@ class QueryResourceImpl {
     maybeRenderPolicy: ?RenderPolicy,
     observer: ?Observer<Snapshot>,
     cacheBreaker: ?string | ?number,
-    profilerContext: mixed,
+    profilerContext: unknown,
   ): QueryResult {
     const cacheIdentifier = getQueryCacheIdentifier(
       this._environment,
@@ -238,7 +238,7 @@ class QueryResourceImpl {
     maybeFetchPolicy: ?FetchPolicy,
     maybeRenderPolicy: ?RenderPolicy,
     observer: ?Observer<Snapshot>,
-    profilerContext: mixed,
+    profilerContext: unknown,
   ): QueryResult {
     const environment = this._environment;
     const fetchPolicy =
@@ -313,7 +313,7 @@ class QueryResourceImpl {
    * (e.g. inside useEffect), in order to retain the operation in the Relay store
    * and transfer ownership of the operation to the component lifecycle.
    */
-  retain(queryResult: QueryResult, profilerContext: mixed): Disposable {
+  retain(queryResult: QueryResult, profilerContext: unknown): Disposable {
     const environment = this._environment;
     const {cacheIdentifier, operation} = queryResult;
     const cacheEntry = this._getOrCreateCacheEntry(
@@ -393,7 +393,7 @@ class QueryResourceImpl {
     fetchObservable: Observable<GraphQLResponse>,
     fetchPolicy: FetchPolicy,
     renderPolicy: RenderPolicy,
-    profilerContext: mixed,
+    profilerContext: unknown,
     observer: Observer<Snapshot>,
   ): QueryResourceCacheEntry {
     const environment = this._environment;

package/relay-hooks/RelayEnvironmentProvider.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {ProviderProps, ReactElement, ReactNode} from 'react';
+import {IEnvironment, RelayContext} from 'relay-runtime';
+
+export interface Props {
+    children: ReactNode;
+    environment: IEnvironment;
+}
+
+export function RelayEnvironmentProvider(props: Props): ReactElement<ProviderProps<RelayContext>>;

package/relay-hooks/RelayEnvironmentProvider.js.flow

@@ -22,7 +22,7 @@ const React = require('react');
 
 const {useMemo} = React;
 
-type Props<TChildren> = $ReadOnly<{
+type Props<TChildren> = Readonly<{
   children: TChildren,
   environment: IEnvironment,
   getEnvironmentForActor?: ?(
@@ -30,7 +30,7 @@ type Props<TChildren> = $ReadOnly<{
   ) => IActorEnvironment,
 }>;
 
-component RelayEnvironmentProvider<TChildren: React.Node>(
+component RelayEnvironmentProvider<TChildren extends React.Node>(
   ...props: Props<TChildren>
 ) renders TChildren {
   const {children, environment, getEnvironmentForActor} = props;

package/relay-hooks/__flowtests__/EntryPointTypes/EntryPointElementConfig-flowtest.js.flow

@@ -19,7 +19,7 @@ import type {
   EntryPointProps,
 } from '../../EntryPointTypes.flow';
 
-type MyComponentOtherProps = $ReadOnly<{
+type MyComponentOtherProps = Readonly<{
   foo: string,
 }>;
 
@@ -27,7 +27,7 @@ type MyComponentProps = EntryPointProps<{}, {}, MyComponentOtherProps, {}>;
 
 const MyComponent = (_props: MyComponentProps) => null;
 
-type PreloadParams = $ReadOnly<{}>;
+type PreloadParams = Readonly<{}>;
 
 type MyComponentEntryPointType = EntryPoint<PreloadParams, typeof MyComponent>;
 
@@ -42,9 +42,9 @@ type OtherProps = MyComponentProps['props'];
 opaque type __SUBTYPE_CHECK_1__: OtherProps = MyComponentEntryPointProps;
 opaque type __SUBTYPE_CHECK_2__: MyComponentEntryPointProps = OtherProps;
 
-({foo: ''}: OtherProps);
+({foo: ''}) as OtherProps;
 
-({foo: ''}: MyComponentEntryPointProps);
+({foo: ''}) as MyComponentEntryPointProps;
 
-// $FlowExpectedError[incompatible-cast]
-({foo: null}: MyComponentEntryPointProps);
+// $FlowExpectedError[incompatible-type]
+({foo: null}) as MyComponentEntryPointProps;

package/relay-hooks/__flowtests__/EntryPointTypes/ExtractQueryTypes-flowtest.js.flow

@@ -15,12 +15,14 @@ import type {
   EnvironmentProviderOptions,
   ExtractQueryTypes,
   PreloadedQuery,
+  ThinQueryParams,
 } from '../../EntryPointTypes.flow';
+import type {OperationType} from 'relay-runtime';
 
 type Query = {
-  +variables: {foo: string, bar: number},
-  +response: mixed,
-  +rawResponse?: {...},
+  readonly variables: {foo: string, bar: number},
+  readonly response: unknown,
+  readonly rawResponse?: {...},
 };
 
 const _good: ExtractQueryTypes<
@@ -35,9 +37,54 @@ const _bad: ExtractQueryTypes<
   EnvironmentProviderOptions,
   {root: PreloadedQuery<Query>},
   // $FlowExpectedError[prop-missing]
+  // $FlowExpectedError[incompatible-type]
 >['root']['variables'] = {
   memebers_are_checked: true,
   // $FlowExpectedError[incompatible-type]
   foo: 1,
   bar: 3,
 };
+
+declare type RootQuery = OperationType;
+
+type ActualRequiredQueryType = ExtractQueryTypes<
+  EnvironmentProviderOptions,
+  {root: PreloadedQuery<RootQuery>},
+>;
+
+type ExpectedRequiredQueryType = {
+  root: ThinQueryParams<RootQuery, EnvironmentProviderOptions>,
+};
+
+declare const ActualRequiredQuery: ActualRequiredQueryType;
+declare const ExpectedRequiredQuery: ExpectedRequiredQueryType;
+ActualRequiredQuery as ExpectedRequiredQueryType;
+ExpectedRequiredQuery as ActualRequiredQueryType;
+
+type ActualOptionalQueryType = ExtractQueryTypes<
+  EnvironmentProviderOptions,
+  {root: PreloadedQuery<RootQuery> | void},
+>;
+
+type ExpectedOptionalQueryType = {
+  root: ThinQueryParams<RootQuery, EnvironmentProviderOptions> | void,
+};
+
+declare const ActualOptionalQuery: ActualOptionalQueryType;
+declare const ExpectedOptionalQuery: ExpectedOptionalQueryType;
+ActualOptionalQuery as ExpectedOptionalQueryType;
+ExpectedOptionalQuery as ActualOptionalQueryType;
+
+type ActualNullableQueryType = ExtractQueryTypes<
+  EnvironmentProviderOptions,
+  {root: PreloadedQuery<RootQuery> | void},
+>;
+
+type ExpectedNullableQueryType = {
+  root: ThinQueryParams<RootQuery, EnvironmentProviderOptions> | void,
+};
+
+declare const ActualNullableQuery: ActualNullableQueryType;
+declare const ExpectedNullableQuery: ExpectedNullableQueryType;
+ActualNullableQuery as ExpectedNullableQueryType;
+ExpectedNullableQuery as ActualNullableQueryType;

package/relay-hooks/__flowtests__/EntryPointTypes/NestedEntrypoints-flowtest.js.flow

@@ -29,7 +29,7 @@ type NestedEntrypointComponentProps = EntryPointProps<{}>;
 const NestedEntrypointComponent = (_props: NestedEntrypointComponentProps) =>
   null;
 
-type NestedEntrypointPreloadParams = $ReadOnly<{
+type NestedEntrypointPreloadParams = Readonly<{
   subEntrypointPreloadParam: string,
 }>;
 
@@ -38,16 +38,16 @@ type NestedEntryPointType = EntryPoint<
   typeof NestedEntrypointComponent,
 >;
 
-const NestedEntryPoint = ({
+const NestedEntryPoint = {
   getPreloadProps({subEntrypointPreloadParam: _subEntrypointPreloadParam}) {
     return {};
   },
   root: mockJSResource(NestedEntrypointComponent),
-}: NestedEntryPointType);
+} as NestedEntryPointType;
 
 // Define the parent entrypoint's component
 
-type PreloadedEntrypoints = $ReadOnly<{
+type PreloadedEntrypoints = Readonly<{
   nestedComponent: PreloadedEntryPoint<typeof NestedEntrypointComponent>,
 }>;
 
@@ -61,7 +61,7 @@ const ParentEntrypointComponent = (_props: ParentEntrypointComponentProps) =>
  * INCORRECT params passed into the nested entrypoints.
  */
 
-type BadParentEntrypointParams = $ReadOnly<{}>;
+type BadParentEntrypointParams = Readonly<{}>;
 
 ({
   getPreloadProps(_params: BadParentEntrypointParams) {
@@ -69,7 +69,7 @@ type BadParentEntrypointParams = $ReadOnly<{}>;
       entryPoints: {
         nestedComponent: NestedRelayEntryPoint({
           /**
-           $FlowExpectedError The entryPointParams here should be of type
+           $FlowExpectedError[incompatible-type] The entryPointParams here should be of type
             NestedEntrypointPreloadParams, but it does not contain subEntrypointPreloadParam
           */
           entryPoint: NestedEntryPoint,
@@ -79,14 +79,14 @@ type BadParentEntrypointParams = $ReadOnly<{}>;
     };
   },
   root: mockJSResource(ParentEntrypointComponent),
-}: EntryPoint<BadParentEntrypointParams, typeof ParentEntrypointComponent>);
+}) as EntryPoint<BadParentEntrypointParams, typeof ParentEntrypointComponent>;
 
 /**
  * Create a parent entrypoint with the component with
  * CORRECT params passed into the nested entrypoints.
  */
 
-type GoodParentEntrypointParams = $ReadOnly<{}>;
+type GoodParentEntrypointParams = Readonly<{}>;
 
 ({
   getPreloadProps(_params: GoodParentEntrypointParams) {
@@ -103,4 +103,4 @@ type GoodParentEntrypointParams = $ReadOnly<{}>;
     };
   },
   root: mockJSResource(ParentEntrypointComponent),
-}: EntryPoint<GoodParentEntrypointParams, typeof ParentEntrypointComponent>);
+}) as EntryPoint<GoodParentEntrypointParams, typeof ParentEntrypointComponent>;

package/relay-hooks/__flowtests__/__generated__/useFragmentFlowtest_user.graphql.js.flow

@@ -6,10 +6,9 @@
  *
  * @oncall relay
  *
- * @generated SignedSource<<fef9e96f393a59b2e761b70b1c3ddc50>>
+ * @generated SignedSource<<b0435066c8bc918fc030ba8ea4aebfb8>>
  * @flow
  * @lightSyntaxTransform
- * @nogrep
  */
 
 /* eslint-disable */
@@ -50,10 +49,10 @@ var node/*: ReaderFragment*/ = {
 };
 
 if (__DEV__) {
-  (node/*: any*/).hash = "a0eb71a1bbfb0eb3a4c42fb5a69a7f81";
+  (node/*:: as any*/).hash = "a0eb71a1bbfb0eb3a4c42fb5a69a7f81";
 }
 
-module.exports = ((node/*: any*/)/*: Fragment<
+module.exports = ((node/*:: as any*/)/*:: as Fragment<
   useFragmentFlowtest_user$fragmentType,
   useFragmentFlowtest_user$data,
 >*/);

package/relay-hooks/__flowtests__/__generated__/useFragmentFlowtest_users.graphql.js.flow

@@ -6,10 +6,9 @@
  *
  * @oncall relay
  *
- * @generated SignedSource<<1bd343735be9917826ee3203cf6756c4>>
+ * @generated SignedSource<<310a5ea49f6836992f54da76b8f7afae>>
  * @flow
  * @lightSyntaxTransform
- * @nogrep
  */
 
 /* eslint-disable */
@@ -20,11 +19,11 @@
 import type { Fragment, ReaderFragment } from 'relay-runtime';
 import type { FragmentType } from "relay-runtime";
 declare export opaque type useFragmentFlowtest_users$fragmentType: FragmentType;
-export type useFragmentFlowtest_users$data = $ReadOnlyArray<{|
+export type useFragmentFlowtest_users$data = ReadonlyArray<{|
   +id: string,
   +$fragmentType: useFragmentFlowtest_users$fragmentType,
 |}>;
-export type useFragmentFlowtest_users$key = $ReadOnlyArray<{
+export type useFragmentFlowtest_users$key = ReadonlyArray<{
   +$data?: useFragmentFlowtest_users$data,
   +$fragmentSpreads: useFragmentFlowtest_users$fragmentType,
   ...
@@ -52,10 +51,10 @@ var node/*: ReaderFragment*/ = {
 };
 
 if (__DEV__) {
-  (node/*: any*/).hash = "8b9b9b23494aec63a7cb96eed58ebcbc";
+  (node/*:: as any*/).hash = "8b9b9b23494aec63a7cb96eed58ebcbc";
 }
 
-module.exports = ((node/*: any*/)/*: Fragment<
+module.exports = ((node/*:: as any*/)/*:: as Fragment<
   useFragmentFlowtest_users$fragmentType,
   useFragmentFlowtest_users$data,
 >*/);

package/relay-hooks/__flowtests__/useBlockingPaginationFragment-flowtest.js.flow

@@ -30,8 +30,8 @@ import {
 } from './utils';
 
 type ExpectedReturnType<
-  TRefetchVariables: Variables,
-  TLoadMoreVariables: Variables,
+  TRefetchVariables extends Variables,
+  TLoadMoreVariables extends Variables,
   TFragmentData,
 > = {
   data: TFragmentData,
@@ -46,63 +46,58 @@ type ExpectedReturnType<
 
 // Nullability of returned data type is correct
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
+// $FlowFixMe[incompatible-type]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[react-rule-hook]
-(useBlockingPaginationFragment(
+useBlockingPaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
-): ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>;
 
 // $FlowFixMe[react-rule-hook]
-(useBlockingPaginationFragment(
+useBlockingPaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NullableData>;
 
-// $FlowExpectedError: can't cast nullable to non-nullable
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(useBlockingPaginationFragment(
+// $FlowFixMe[incompatible-type] can't cast nullable to non-nullable
+useBlockingPaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>;
 
-// $FlowExpectedError: actual type of returned data is correct
 // $FlowFixMe[react-rule-hook]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
-(useBlockingPaginationFragment(
+// $FlowFixMe[incompatible-type] actual type of returned data is correct
+useBlockingPaginationFragment(
   refetchableFragmentInput,
-  // $FlowExpectedError[incompatible-call]
+  // $FlowExpectedError[incompatible-type]
   keyAnotherNonNullable,
-): ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>;
 
-// $FlowExpectedError[incompatible-call] `Example_user$fragmentType` is incompatible with  `FragmentType`
+// $FlowExpectedError[incompatible-type] `Example_user$fragmentType` is incompatible with  `FragmentType`
 // $FlowFixMe[react-rule-hook]
-(useBlockingPaginationFragment(
+useBlockingPaginationFragment(
   refetchableFragmentInput,
-  // $FlowExpectedError[incompatible-call]
+  // $FlowExpectedError[incompatible-type]
   keyAnotherNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NullableData>;
 
-// $FlowExpectedError: Key should not be a user provided object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be a user provided object
 // $FlowFixMe[cannot-resolve-name]
 useBlockingPaginationFragment(fragmentInput, {abc: 123});
 
-// $FlowExpectedError: Key should not be an empty object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be an empty object
 // $FlowFixMe[cannot-resolve-name]
 useBlockingPaginationFragment(fragmentInput, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
-// $FlowFixMe[cannot-resolve-name]
+// $FlowFixMe[incompatible-type]
+// $FlowFixMe[cannot-resolve-name] Key should be the `<name>$key` type from generated flow
 useBlockingPaginationFragment(fragmentInput, fragmentData);
 
 // Refetch function options:
@@ -114,12 +109,12 @@ const {refetch} = useBlockingPaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
 );
-// $FlowExpectedError: internal option
+// $FlowExpectedError[incompatible-type] : internal option
 refetch(variables, {
   __environment: environment,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 refetch(variables, {
   NON_EXIST: 'NON_EXIST',
 });
@@ -136,17 +131,17 @@ const {loadNext} = useBlockingPaginationFragment(
 // Accepts extraVariables
 loadNext(10, {
   // $FlowFixMe[prop-missing]
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   UNSTABLE_extraVariables: extraVariables,
 });
 
 // $FlowFixMe[prop-missing]
 loadNext(10, {
-  // $FlowExpectedError: doesn't accept variables not available in the Flow type
+  // $FlowExpectedError[incompatible-type] : doesn't accept variables not available in the Flow type
   UNSTABLE_extraVariables: invalidVariables,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 loadNext(10, {
   UNSTABLE_foo: invalidVariables,
 });

package/relay-hooks/__flowtests__/useFragment-flowtest.js.flow

@@ -40,44 +40,44 @@ const usersFragment: useFragmentFlowtest_users$fragment = graphql`
 /* eslint-disable react-hooks/rules-of-hooks */
 
 // Nullability of returned data type is correct
-(useFragment(
+useFragment(
   userFragment,
-  (Any: useFragmentFlowtest_user$key),
-): useFragmentFlowtest_user$data);
-(useFragment(
+  Any as useFragmentFlowtest_user$key,
+) as useFragmentFlowtest_user$data;
+useFragment(
   userFragment,
-  (Any: ?useFragmentFlowtest_user$key),
-): ?useFragmentFlowtest_user$data);
-(useFragment(
+  Any as ?useFragmentFlowtest_user$key,
+) as ?useFragmentFlowtest_user$data;
+useFragment(
   usersFragment,
-  (Any: useFragmentFlowtest_users$key),
-): useFragmentFlowtest_users$data);
-(useFragment(
+  Any as useFragmentFlowtest_users$key,
+) as useFragmentFlowtest_users$data;
+useFragment(
   usersFragment,
-  (Any: ?useFragmentFlowtest_users$key),
-): ?useFragmentFlowtest_users$data);
+  Any as ?useFragmentFlowtest_users$key,
+) as ?useFragmentFlowtest_users$data;
 
-// $FlowExpectedError: can't cast nullable to non-nullable
-(useFragment(
+// $FlowExpectedError[incompatible-type] : can't cast nullable to non-nullable
+useFragment(
   userFragment,
-  (Any: ?useFragmentFlowtest_user$key),
-): useFragmentFlowtest_user$data);
-// $FlowExpectedError: can't cast nullable plural to non-nullable plural
-(useFragment(
+  Any as ?useFragmentFlowtest_user$key,
+) as useFragmentFlowtest_user$data;
+// $FlowExpectedError[incompatible-type] : can't cast nullable plural to non-nullable plural
+useFragment(
   usersFragment,
-  (Any: ?useFragmentFlowtest_users$key),
-): useFragmentFlowtest_users$data);
+  Any as ?useFragmentFlowtest_users$key,
+) as useFragmentFlowtest_users$data;
 
-// $FlowExpectedError: Key should be one of the generated types
+// $FlowExpectedError[incompatible-type] : Key should be one of the generated types
 useFragment(userFragment, 'INVALID_KEY');
 
-// $FlowExpectedError: Key should not be a user provided object
+// $FlowExpectedError[incompatible-type] : Key should not be a user provided object
 useFragment(userFragment, {a: 123});
 
-// $FlowExpectedError: Key should not be an empty object
+// $FlowExpectedError[incompatible-type] : Key should not be an empty object
 useFragment(userFragment, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
-useFragment(userFragment, (Any: useFragmentFlowtest_user$data));
+// $FlowExpectedError[incompatible-type] : Key should be the `<name>$key` type from generated flow
+useFragment(userFragment, Any as useFragmentFlowtest_user$data);
 
 /* eslint-enable react-hooks/rules-of-hooks */

package/relay-hooks/__flowtests__/usePaginationFragment-flowtest.js.flow

@@ -30,8 +30,8 @@ import {
 } from './utils';
 
 type ExpectedReturnType<
-  TRefetchVariables: Variables,
-  TLoadMoreVariables: Variables,
+  TRefetchVariables extends Variables,
+  TLoadMoreVariables extends Variables,
   TFragmentData,
 > = {
   data: TFragmentData,
@@ -48,60 +48,54 @@ type ExpectedReturnType<
 
 // Nullability of returned data type is correct
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
+// $FlowFixMe[incompatible-type]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[react-rule-hook]
-(usePaginationFragment(
+usePaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
-): ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>;
 
 // $FlowFixMe[react-rule-hook]
-(usePaginationFragment(
+usePaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NullableData>;
 
-// $FlowExpectedError: can't cast nullable to non-nullable
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type] can't cast nullable to non-nullable
+usePaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>;
 
-// $FlowExpectedError: actual type of returned data is correct
 // $FlowFixMe[react-rule-hook]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type] actual type of returned data is correct
+usePaginationFragment(
   refetchableFragmentInput,
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   keyAnotherNonNullable,
-): ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>);
-// $FlowExpectedError
+) as ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>;
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type]
+usePaginationFragment(
   refetchableFragmentInput,
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   keyAnotherNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>;
 
-// $FlowExpectedError: Key should not be a user provided object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be a user provided object
 usePaginationFragment(refetchableFragmentInput, {abc: 123});
 
-// $FlowExpectedError: Key should not be an empty object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be an empty object
 usePaginationFragment(refetchableFragmentInput, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should be the `<name>$key` type from generated flow
 usePaginationFragment(refetchableFragmentInput, fragmentData);
 
 // Refetch function options:
@@ -113,12 +107,12 @@ const {refetch} = usePaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
 );
-// $FlowExpectedError: internal option
+// $FlowExpectedError[incompatible-type] : internal option
 refetch(variables, {
   __environment: environment,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 refetch(variables, {
   NON_EXIST: 'NON_EXIST',
 });
@@ -135,17 +129,17 @@ const {loadNext} = usePaginationFragment(
 // Accepts extraVariables
 loadNext(10, {
   // $FlowFixMe[prop-missing]
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   UNSTABLE_extraVariables: extraVariables,
 });
 
 // $FlowFixMe[prop-missing]
 loadNext(10, {
-  // $FlowExpectedError: doesn't accept variables not available in the Flow type
+  // $FlowExpectedError[incompatible-type] : doesn't accept variables not available in the Flow type
   UNSTABLE_extraVariables: invalidVariables,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 loadNext(10, {
   UNSTABLE_foo: invalidVariables,
 });