relay-runtime 11.0.0 → 13.0.0-rc.0

package/subscription/requestSubscription.js.flow

@@ -12,15 +12,6 @@
 
 'use strict';
 
-const RelayDeclarativeMutationConfig = require('../mutations/RelayDeclarativeMutationConfig');
-
-const warning = require('warning');
-
-const {getRequest} = require('../query/GraphQLTag');
-const {
-  createOperationDescriptor,
-} = require('../store/RelayModernOperationDescriptor');
-
 import type {DeclarativeMutationConfig} from '../mutations/RelayDeclarativeMutationConfig';
 import type {GraphQLTaggedNode} from '../query/GraphQLTag';
 import type {
@@ -33,7 +24,33 @@ import type {
   Variables,
 } from '../util/RelayRuntimeTypes';
 
-export type GraphQLSubscriptionConfig<TSubscriptionPayload> = {|
+const RelayDeclarativeMutationConfig = require('../mutations/RelayDeclarativeMutationConfig');
+const {getRequest} = require('../query/GraphQLTag');
+const {
+  createOperationDescriptor,
+} = require('../store/RelayModernOperationDescriptor');
+const {createReaderSelector} = require('../store/RelayModernSelector');
+const RelayFeatureFlags = require('../util/RelayFeatureFlags');
+const warning = require('warning');
+
+export type SubscriptionParameters = {|
+  +response: {...},
+  +variables: interface {},
+  +rawResponse?: {...},
+|};
+
+export type GraphQLSubscriptionConfig<T: SubscriptionParameters> = {|
+  configs?: Array<DeclarativeMutationConfig>,
+  cacheConfig?: CacheConfig,
+  subscription: GraphQLTaggedNode,
+  variables: T['variables'],
+  onCompleted?: ?() => void,
+  onError?: ?(error: Error) => void,
+  onNext?: ?(response: ?T['response']) => void,
+  updater?: ?SelectorStoreUpdater<T['response']>,
+|};
+
+export type DEPRECATED_GraphQLSubscriptionConfig<TSubscriptionPayload> = {|
   configs?: Array<DeclarativeMutationConfig>,
   cacheConfig?: CacheConfig,
   subscription: GraphQLTaggedNode,
@@ -41,25 +58,19 @@ export type GraphQLSubscriptionConfig<TSubscriptionPayload> = {|
   onCompleted?: ?() => void,
   onError?: ?(error: Error) => void,
   onNext?: ?(response: ?TSubscriptionPayload) => void,
-  updater?: ?SelectorStoreUpdater,
+  updater?: ?SelectorStoreUpdater<TSubscriptionPayload>,
 |};
 
 function requestSubscription<TSubscriptionPayload>(
   environment: IEnvironment,
-  config: GraphQLSubscriptionConfig<TSubscriptionPayload>,
+  config: DEPRECATED_GraphQLSubscriptionConfig<TSubscriptionPayload>,
 ): Disposable {
   const subscription = getRequest(config.subscription);
   if (subscription.params.operationKind !== 'subscription') {
     throw new Error('requestSubscription: Must use Subscription operation');
   }
-  const {
-    configs,
-    onCompleted,
-    onError,
-    onNext,
-    variables,
-    cacheConfig,
-  } = config;
+  const {configs, onCompleted, onError, onNext, variables, cacheConfig} =
+    config;
   const operation = createOperationDescriptor(
     subscription,
     variables,
@@ -81,17 +92,33 @@ function requestSubscription<TSubscriptionPayload>(
     : config;
 
   const sub = environment
-    .execute({
+    .executeSubscription({
       operation,
       updater,
     })
-    .map(() => {
-      const data = environment.lookup(operation.fragment).data;
-      // $FlowFixMe[incompatible-cast]
-      return (data: TSubscriptionPayload);
-    })
     .subscribe({
-      next: onNext,
+      next: responses => {
+        if (onNext != null) {
+          let selector = operation.fragment;
+          let nextID;
+          if (Array.isArray(responses)) {
+            nextID = responses[0]?.extensions?.__relay_subscription_root_id;
+          } else {
+            nextID = responses.extensions?.__relay_subscription_root_id;
+          }
+          if (typeof nextID === 'string') {
+            selector = createReaderSelector(
+              selector.node,
+              nextID,
+              selector.variables,
+              selector.owner,
+            );
+          }
+          const data = environment.lookup(selector).data;
+          // $FlowFixMe[incompatible-cast]
+          onNext((data: TSubscriptionPayload));
+        }
+      },
       error: onError,
       complete: onCompleted,
     });

package/util/NormalizationNode.js.flow

@@ -87,7 +87,7 @@ export type NormalizationInlineFragment = {|
 
 export type NormalizationFragmentSpread = {|
   +kind: 'FragmentSpread',
-  +fragment: NormalizationNode,
+  +fragment: NormalizationSplitOperation,
   +args: ?$ReadOnlyArray<NormalizationArgument>,
 |};
 
@@ -102,7 +102,13 @@ export type NormalizationLinkedField = {|
   +selections: $ReadOnlyArray<NormalizationSelection>,
 |};
 
+export type NormalizationActorChange = {|
+  +kind: 'ActorChange',
+  +linkedField: NormalizationLinkedField,
+|};
+
 export type NormalizationModuleImport = {|
+  +args: ?$ReadOnlyArray<NormalizationArgument>,
   +kind: 'ModuleImport',
   +documentName: string,
   +fragmentPropName: string,
@@ -154,6 +160,12 @@ export type NormalizationFlightField = {|
   +storageKey: ?string,
 |};
 
+export type NormalizationClientComponent = {|
+  +args?: ?$ReadOnlyArray<NormalizationArgument>,
+  +kind: 'ClientComponent',
+  +fragment: NormalizationNode,
+|};
+
 export type NormalizationTypeDiscriminator = {|
   +kind: 'TypeDiscriminator',
   +abstractKey: string,
@@ -161,6 +173,7 @@ export type NormalizationTypeDiscriminator = {|
 
 export type NormalizationSelection =
   | NormalizationCondition
+  | NormalizationClientComponent
   | NormalizationClientExtension
   | NormalizationDefer
   | NormalizationField
@@ -170,9 +183,11 @@ export type NormalizationSelection =
   | NormalizationInlineFragment
   | NormalizationModuleImport
   | NormalizationStream
+  | NormalizationActorChange
   | NormalizationTypeDiscriminator;
 
 export type NormalizationSplitOperation = {|
+  +argumentDefinitions?: $ReadOnlyArray<NormalizationLocalArgumentDefinition>,
   +kind: 'SplitOperation',
   +name: string,
   +metadata: ?{+[key: string]: mixed, ...},
@@ -183,8 +198,6 @@ export type NormalizationStream = {|
   +if: string | null,
   +kind: 'Stream',
   +label: string,
-  +useCustomizedBatch: string | null,
-  +metadata: ?{+[key: string]: mixed, ...},
   +selections: $ReadOnlyArray<NormalizationSelection>,
 |};
 

package/util/ReaderNode.js.flow

@@ -108,7 +108,10 @@ export type ReaderClientExtension = {|
   +selections: $ReadOnlyArray<ReaderSelection>,
 |};
 
-export type ReaderField = ReaderScalarField | ReaderLinkedField;
+export type ReaderField =
+  | ReaderScalarField
+  | ReaderLinkedField
+  | ReaderRelayResolver;
 
 export type ReaderRootArgument = {|
   +kind: 'RootArgument',
@@ -133,7 +136,17 @@ export type ReaderLinkedField = {|
   +selections: $ReadOnlyArray<ReaderSelection>,
 |};
 
+export type ReaderActorChange = {|
+  +kind: 'ActorChange',
+  +alias: ?string,
+  +name: string,
+  +storageKey: ?string,
+  +args: ?$ReadOnlyArray<ReaderArgument>,
+  +fragmentSpread: ReaderFragmentSpread,
+|};
+
 export type ReaderModuleImport = {|
+  +args?: ?$ReadOnlyArray<ReaderArgument>,
   +kind: 'ModuleImport',
   +documentName: string,
   +fragmentPropName: string,
@@ -206,18 +219,41 @@ export type ReaderRequiredField = {|
   +path: string,
 |};
 
+export type ReaderRelayResolver = {|
+  +kind: 'RelayResolver',
+  +alias: ?string,
+  +name: string,
+  +fragment: ReaderFragmentSpread,
+  +resolverModule: (rootKey: {
+    +$data?: any, // flowlint-line unclear-type:off
+    +$fragmentSpreads: any, // flowlint-line unclear-type:off
+    +$fragmentRefs: any, // flowlint-line unclear-type:off
+    ...
+  }) => mixed,
+|};
+
+export type ReaderClientEdge = {|
+  +kind: 'ClientEdge',
+  +linkedField: ReaderLinkedField,
+  +operation: ConcreteRequest,
+  +backingField: ReaderRelayResolver | ReaderClientExtension,
+|};
+
 export type ReaderSelection =
   | ReaderCondition
+  | ReaderClientEdge
   | ReaderClientExtension
   | ReaderDefer
   | ReaderField
+  | ReaderActorChange
   | ReaderFlightField
   | ReaderFragmentSpread
   | ReaderInlineDataFragmentSpread
   | ReaderInlineFragment
   | ReaderModuleImport
   | ReaderStream
-  | ReaderRequiredField;
+  | ReaderRequiredField
+  | ReaderRelayResolver;
 
 export type ReaderVariableArgument = {|
   +kind: 'Variable',

package/util/RelayConcreteNode.js.flow

@@ -67,7 +67,10 @@ export type GeneratedNode =
   | NormalizationSplitOperation;
 
 const RelayConcreteNode = {
+  ACTOR_CHANGE: 'ActorChange',
   CONDITION: 'Condition',
+  CLIENT_COMPONENT: 'ClientComponent',
+  CLIENT_EDGE: 'ClientEdge',
   CLIENT_EXTENSION: 'ClientExtension',
   DEFER: 'Defer',
   CONNECTION: 'Connection',
@@ -83,6 +86,7 @@ const RelayConcreteNode = {
   LIST_VALUE: 'ListValue',
   LOCAL_ARGUMENT: 'LocalArgument',
   MODULE_IMPORT: 'ModuleImport',
+  RELAY_RESOLVER: 'RelayResolver',
   REQUIRED_FIELD: 'RequiredField',
   OBJECT_VALUE: 'ObjectValue',
   OPERATION: 'Operation',

package/util/RelayFeatureFlags.js.flow

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow strict
+ * @flow strict-local
  * @format
  */
 
@@ -12,34 +12,50 @@
 
 'use strict';
 
-type FeatureFlags = {|
+import type {Disposable} from '../util/RelayRuntimeTypes';
+
+export type FeatureFlags = {|
+  DELAY_CLEANUP_OF_PENDING_PRELOAD_QUERIES: boolean,
+  ENABLE_CLIENT_EDGES: boolean,
   ENABLE_VARIABLE_CONNECTION_KEY: boolean,
   ENABLE_PARTIAL_RENDERING_DEFAULT: boolean,
-  ENABLE_RELAY_CONTAINERS_SUSPENSE: boolean,
-  ENABLE_PRECISE_TYPE_REFINEMENT: boolean,
   ENABLE_REACT_FLIGHT_COMPONENT_FIELD: boolean,
   ENABLE_REQUIRED_DIRECTIVES: boolean | string,
+  ENABLE_RELAY_RESOLVERS: boolean,
   ENABLE_GETFRAGMENTIDENTIFIER_OPTIMIZATION: boolean,
   ENABLE_FRIENDLY_QUERY_NAME_GQL_URL: boolean,
-  ENABLE_STORE_SUBSCRIPTIONS_REFACTOR: boolean,
   ENABLE_LOAD_QUERY_REQUEST_DEDUPING: boolean,
   ENABLE_DO_NOT_WRAP_LIVE_QUERY: boolean,
   ENABLE_NOTIFY_SUBSCRIPTION: boolean,
+  BATCH_ASYNC_MODULE_UPDATES_FN: ?(() => void) => Disposable,
+  ENABLE_CONTAINERS_SUBSCRIBE_ON_COMMIT: boolean,
+  ENABLE_QUERY_RENDERER_OFFSCREEN_SUPPORT: boolean,
+  MAX_DATA_ID_LENGTH: ?number,
+  REFACTOR_SUSPENSE_RESOURCE: boolean,
+  STRING_INTERN_LEVEL: number,
+  USE_REACT_CACHE: boolean,
 |};
 
 const RelayFeatureFlags: FeatureFlags = {
+  DELAY_CLEANUP_OF_PENDING_PRELOAD_QUERIES: false,
+  ENABLE_CLIENT_EDGES: false,
   ENABLE_VARIABLE_CONNECTION_KEY: false,
   ENABLE_PARTIAL_RENDERING_DEFAULT: true,
-  ENABLE_RELAY_CONTAINERS_SUSPENSE: true,
-  ENABLE_PRECISE_TYPE_REFINEMENT: false,
   ENABLE_REACT_FLIGHT_COMPONENT_FIELD: false,
   ENABLE_REQUIRED_DIRECTIVES: false,
+  ENABLE_RELAY_RESOLVERS: false,
   ENABLE_GETFRAGMENTIDENTIFIER_OPTIMIZATION: false,
   ENABLE_FRIENDLY_QUERY_NAME_GQL_URL: false,
-  ENABLE_STORE_SUBSCRIPTIONS_REFACTOR: false,
   ENABLE_LOAD_QUERY_REQUEST_DEDUPING: true,
   ENABLE_DO_NOT_WRAP_LIVE_QUERY: false,
   ENABLE_NOTIFY_SUBSCRIPTION: false,
+  BATCH_ASYNC_MODULE_UPDATES_FN: null,
+  ENABLE_CONTAINERS_SUBSCRIBE_ON_COMMIT: false,
+  ENABLE_QUERY_RENDERER_OFFSCREEN_SUPPORT: false,
+  MAX_DATA_ID_LENGTH: null,
+  REFACTOR_SUSPENSE_RESOURCE: true,
+  STRING_INTERN_LEVEL: 0,
+  USE_REACT_CACHE: false,
 };
 
 module.exports = RelayFeatureFlags;

package/util/RelayProfiler.js.flow

@@ -12,25 +12,15 @@
 
 'use strict';
 
-type Handler = (name: string, callback: () => void) => void;
-type ProfileHandler = (name: string, state?: any) => (error?: Error) => void;
+type EventName = 'fetchRelayQuery';
+type ProfileHandler = (name: EventName, state?: any) => (error?: Error) => void;
 
-function emptyFunction() {}
+const profileHandlersByName: {|
+  [name: EventName]: Array<ProfileHandler>,
+|} = {};
 
-const aggregateHandlersByName: {[name: string]: Array<Handler>, ...} = {
-  '*': [],
-};
-const profileHandlersByName: {[name: string]: Array<ProfileHandler>, ...} = {
-  '*': [],
-};
-
-const NOT_INVOKED = {};
-const defaultProfiler = {stop: emptyFunction};
-const shouldInstrument = name => {
-  if (__DEV__) {
-    return true;
-  }
-  return name.charAt(0) !== '@';
+const defaultProfiler = {
+  stop() {},
 };
 
 /**
@@ -60,154 +50,8 @@ const shouldInstrument = name => {
  *       console.log(`Duration (${name})`, performance.now() - start);
  *     }
  *   });
- *
- * In order to reduce the impact on performance in production, instrumented
- * methods and profilers with names that begin with `@` will only be measured
- * if `__DEV__` is true. This should be used for very hot functions.
  */
 const RelayProfiler = {
-  /**
-   * Instruments methods on a class or object. This re-assigns the method in
-   * order to preserve function names in stack traces (which are detected by
-   * modern debuggers via heuristics). Example usage:
-   *
-   *   const RelayStore = { primeCache: function() {...} };
-   *   RelayProfiler.instrumentMethods(RelayStore, {
-   *     primeCache: 'RelayStore.primeCache'
-   *   });
-   *
-   *   RelayStore.primeCache.attachHandler(...);
-   *
-   * As a result, the methods will be replaced by wrappers that provide the
-   * `attachHandler` and `detachHandler` methods.
-   */
-  instrumentMethods(
-    object: Function | Object,
-    names: {[key: string]: string, ...},
-  ): void {
-    for (const key in names) {
-      if (names.hasOwnProperty(key)) {
-        if (typeof object[key] === 'function') {
-          object[key] = RelayProfiler.instrument(names[key], object[key]);
-        }
-      }
-    }
-  },
-
-  /**
-   * Wraps the supplied function with one that provides the `attachHandler` and
-   * `detachHandler` methods. Example usage:
-   *
-   *   const printRelayQuery =
-   *     RelayProfiler.instrument('printRelayQuery', printRelayQuery);
-   *
-   *   printRelayQuery.attachHandler(...);
-   *
-   * NOTE: The instrumentation assumes that no handlers are attached or detached
-   * in the course of executing another handler.
-   */
-  instrument<T: Function>(name: string, originalFunction: T): T {
-    if (!shouldInstrument(name)) {
-      originalFunction.attachHandler = emptyFunction;
-      originalFunction.detachHandler = emptyFunction;
-      return originalFunction;
-    }
-    if (!aggregateHandlersByName.hasOwnProperty(name)) {
-      aggregateHandlersByName[name] = [];
-    }
-    const catchallHandlers = aggregateHandlersByName['*'];
-    const aggregateHandlers = aggregateHandlersByName[name];
-    const handlers: Array<Handler> = [];
-    const contexts: Array<[number, number, number, any, any, any]> = [];
-    const invokeHandlers = function() {
-      const context = contexts[contexts.length - 1];
-      if (context[0]) {
-        context[0]--;
-        catchallHandlers[context[0]](name, invokeHandlers);
-      } else if (context[1]) {
-        context[1]--;
-        aggregateHandlers[context[1]](name, invokeHandlers);
-      } else if (context[2]) {
-        context[2]--;
-        handlers[context[2]](name, invokeHandlers);
-      } else {
-        context[5] = originalFunction.apply(context[3], context[4]);
-      }
-    };
-    const instrumentedCallback = function() {
-      let returnValue;
-      if (
-        aggregateHandlers.length === 0 &&
-        handlers.length === 0 &&
-        catchallHandlers.length === 0
-      ) {
-        returnValue = originalFunction.apply(this, arguments);
-      } else {
-        contexts.push([
-          catchallHandlers.length,
-          aggregateHandlers.length,
-          handlers.length,
-          this,
-          arguments,
-          NOT_INVOKED,
-        ]);
-        invokeHandlers();
-        const context = contexts.pop();
-        returnValue = context[5];
-        if (returnValue === NOT_INVOKED) {
-          throw new Error(
-            'RelayProfiler: Handler did not invoke original function.',
-          );
-        }
-      }
-      return returnValue;
-    };
-    instrumentedCallback.attachHandler = function(handler: Handler): void {
-      handlers.push(handler);
-    };
-    instrumentedCallback.detachHandler = function(handler: Handler): void {
-      removeFromArray(handlers, handler);
-    };
-    instrumentedCallback.displayName = '(instrumented ' + name + ')';
-    return (instrumentedCallback: any);
-  },
-
-  /**
-   * Attaches a handler to all methods instrumented with the supplied name.
-   *
-   *   function createRenderer() {
-   *     return RelayProfiler.instrument('render', function() {...});
-   *   }
-   *   const renderA = createRenderer();
-   *   const renderB = createRenderer();
-   *
-   *   // Only profiles `renderA`.
-   *   renderA.attachHandler(...);
-   *
-   *   // Profiles both `renderA` and `renderB`.
-   *   RelayProfiler.attachAggregateHandler('render', ...);
-   *
-   */
-  attachAggregateHandler(name: string, handler: Handler): void {
-    if (shouldInstrument(name)) {
-      if (!aggregateHandlersByName.hasOwnProperty(name)) {
-        aggregateHandlersByName[name] = [];
-      }
-      aggregateHandlersByName[name].push(handler);
-    }
-  },
-
-  /**
-   * Detaches a handler attached via `attachAggregateHandler`.
-   */
-  detachAggregateHandler(name: string, handler: Handler): void {
-    if (shouldInstrument(name)) {
-      if (aggregateHandlersByName.hasOwnProperty(name)) {
-        removeFromArray(aggregateHandlersByName[name], handler);
-      }
-    }
-  },
-
   /**
    * Instruments profiling for arbitrarily asynchronous code by a name.
    *
@@ -221,28 +65,17 @@ const RelayProfiler = {
    * Arbitrary state can also be passed into `profile` as a second argument. The
    * attached profile handlers will receive this as the second argument.
    */
-  profile(name: string, state?: any): {stop: (error?: Error) => void, ...} {
-    const hasCatchAllHandlers = profileHandlersByName['*'].length > 0;
-    const hasNamedHandlers = profileHandlersByName.hasOwnProperty(name);
-    if (hasNamedHandlers || hasCatchAllHandlers) {
-      const profileHandlers =
-        hasNamedHandlers && hasCatchAllHandlers
-          ? profileHandlersByName[name].concat(profileHandlersByName['*'])
-          : hasNamedHandlers
-          ? profileHandlersByName[name]
-          : profileHandlersByName['*'];
-      let stopHandlers;
-      for (let ii = profileHandlers.length - 1; ii >= 0; ii--) {
-        const profileHandler = profileHandlers[ii];
-        const stopHandler = profileHandler(name, state);
-        stopHandlers = stopHandlers || [];
+  profile(name: EventName, state?: any): {stop: (error?: Error) => void, ...} {
+    const handlers = profileHandlersByName[name];
+    if (handlers && handlers.length > 0) {
+      const stopHandlers = [];
+      for (let ii = handlers.length - 1; ii >= 0; ii--) {
+        const stopHandler = handlers[ii](name, state);
         stopHandlers.unshift(stopHandler);
       }
       return {
         stop(error?: Error): void {
-          if (stopHandlers) {
-            stopHandlers.forEach(stopHandler => stopHandler(error));
-          }
+          stopHandlers.forEach(stopHandler => stopHandler(error));
         },
       };
     }
@@ -250,26 +83,21 @@ const RelayProfiler = {
   },
 
   /**
-   * Attaches a handler to profiles with the supplied name. You can also
-   * attach to the special name '*' which is a catch all.
+   * Attaches a handler to profiles with the supplied name.
    */
-  attachProfileHandler(name: string, handler: ProfileHandler): void {
-    if (shouldInstrument(name)) {
-      if (!profileHandlersByName.hasOwnProperty(name)) {
-        profileHandlersByName[name] = [];
-      }
-      profileHandlersByName[name].push(handler);
+  attachProfileHandler(name: EventName, handler: ProfileHandler): void {
+    if (!profileHandlersByName.hasOwnProperty(name)) {
+      profileHandlersByName[name] = [];
     }
+    profileHandlersByName[name].push(handler);
   },
 
   /**
    * Detaches a handler attached via `attachProfileHandler`.
    */
-  detachProfileHandler(name: string, handler: ProfileHandler): void {
-    if (shouldInstrument(name)) {
-      if (profileHandlersByName.hasOwnProperty(name)) {
-        removeFromArray(profileHandlersByName[name], handler);
-      }
+  detachProfileHandler(name: EventName, handler: ProfileHandler): void {
+    if (profileHandlersByName.hasOwnProperty(name)) {
+      removeFromArray(profileHandlersByName[name], handler);
     }
   },
 };

package/util/RelayReplaySubject.js.flow

@@ -12,12 +12,11 @@
 
 'use strict';
 
-const RelayObservable = require('../network/RelayObservable');
+import type {Observer, Sink, Subscription} from '../network/RelayObservable';
 
+const RelayObservable = require('../network/RelayObservable');
 const invariant = require('invariant');
 
-import type {Observer, Sink, Subscription} from '../network/RelayObservable';
-
 type Event<T> =
   | {
       kind: 'next',
@@ -42,7 +41,7 @@ class RelayReplaySubject<T> {
   _events: Array<Event<T>> = [];
   _sinks: Set<Sink<T>> = new Set();
   _observable: RelayObservable<T>;
-  _subscription: ?Subscription = null;
+  _subscription: Array<Subscription> = [];
 
   constructor() {
     this._observable = RelayObservable.create(sink => {
@@ -116,15 +115,16 @@ class RelayReplaySubject<T> {
   }
 
   subscribe(observer: Observer<T> | Sink<T>): Subscription {
-    this._subscription = this._observable.subscribe(observer);
-    return this._subscription;
+    const subscription = this._observable.subscribe(observer);
+    this._subscription.push(subscription);
+    return subscription;
   }
 
   unsubscribe() {
-    if (this._subscription) {
-      this._subscription.unsubscribe();
-      this._subscription = null;
+    for (const subscription of this._subscription) {
+      subscription.unsubscribe();
     }
+    this._subscription = [];
   }
 
   getObserverCount(): number {