relay-runtime 10.0.1 → 10.1.0

package/store/RelayModernStore.js.flow

@@ -18,12 +18,14 @@ const RelayOptimisticRecordSource = require('./RelayOptimisticRecordSource');
 const RelayProfiler = require('../util/RelayProfiler');
 const RelayReader = require('./RelayReader');
 const RelayReferenceMarker = require('./RelayReferenceMarker');
+const RelayStoreReactFlightUtils = require('./RelayStoreReactFlightUtils');
 const RelayStoreUtils = require('./RelayStoreUtils');
 
 const deepFreeze = require('../util/deepFreeze');
 const defaultGetDataID = require('./defaultGetDataID');
 const hasOverlappingIDs = require('./hasOverlappingIDs');
 const invariant = require('invariant');
+const isEmptyObject = require('../util/isEmptyObject');
 const recycleNodesInto = require('../util/recycleNodesInto');
 const resolveImmediate = require('../util/resolveImmediate');
 
@@ -53,13 +55,12 @@ export opaque type InvalidationState = {|
   invalidations: Map<DataID, ?number>,
 |};
 
-type Subscription = {
+type Subscription = {|
   callback: (snapshot: Snapshot) => void,
   snapshot: Snapshot,
   stale: boolean,
   backup: ?Snapshot,
-  ...
-};
+|};
 
 type InvalidationSubscription = {|
   callback: () => void,
@@ -232,7 +233,7 @@ class RelayModernStore implements Store {
 
         if (rootEntryIsStale) {
           this._roots.delete(id);
-          this._scheduleGC();
+          this.scheduleGC();
         } else {
           this._releaseBuffer.push(id);
 
@@ -242,7 +243,7 @@ class RelayModernStore implements Store {
           if (this._releaseBuffer.length > this._gcReleaseBufferSize) {
             const _id = this._releaseBuffer.shift();
             this._roots.delete(_id);
-            this._scheduleGC();
+            this.scheduleGC();
           }
         }
       }
@@ -302,8 +303,13 @@ class RelayModernStore implements Store {
 
     const source = this.getSource();
     const updatedOwners = [];
+    const hasUpdatedRecords = !isEmptyObject(this._updatedRecordIDs);
     this._subscriptions.forEach(subscription => {
-      const owner = this._updateSubscription(source, subscription);
+      const owner = this._updateSubscription(
+        source,
+        subscription,
+        hasUpdatedRecords,
+      );
       if (owner != null) {
         updatedOwners.push(owner);
       }
@@ -407,7 +413,7 @@ class RelayModernStore implements Store {
       if (this._gcHoldCounter > 0) {
         this._gcHoldCounter--;
         if (this._gcHoldCounter === 0 && this._shouldScheduleGC) {
-          this._scheduleGC();
+          this.scheduleGC();
           this._shouldScheduleGC = false;
         }
       }
@@ -429,12 +435,12 @@ class RelayModernStore implements Store {
   _updateSubscription(
     source: RecordSource,
     subscription: Subscription,
+    hasUpdatedRecords: boolean,
   ): ?RequestDescriptor {
     const {backup, callback, snapshot, stale} = subscription;
-    const hasOverlappingUpdates = hasOverlappingIDs(
-      snapshot.seenRecords,
-      this._updatedRecordIDs,
-    );
+    const hasOverlappingUpdates =
+      hasUpdatedRecords &&
+      hasOverlappingIDs(snapshot.seenRecords, this._updatedRecordIDs);
     if (!stale && !hasOverlappingUpdates) {
       return;
     }
@@ -448,6 +454,7 @@ class RelayModernStore implements Store {
       isMissingData: nextSnapshot.isMissingData,
       seenRecords: nextSnapshot.seenRecords,
       selector: nextSnapshot.selector,
+      missingRequiredFields: nextSnapshot.missingRequiredFields,
     }: Snapshot);
     if (__DEV__) {
       deepFreeze(nextSnapshot);
@@ -585,7 +592,7 @@ class RelayModernStore implements Store {
     }
     this._optimisticSource = null;
     if (this._shouldScheduleGC) {
-      this._scheduleGC();
+      this.scheduleGC();
     }
     this._subscriptions.forEach(subscription => {
       const backup = subscription.backup;
@@ -599,6 +606,7 @@ class RelayModernStore implements Store {
           isMissingData: backup.isMissingData,
           seenRecords: backup.seenRecords,
           selector: backup.selector,
+          missingRequiredFields: backup.missingRequiredFields,
         };
       } else {
         subscription.stale = true;
@@ -606,7 +614,7 @@ class RelayModernStore implements Store {
     });
   }
 
-  _scheduleGC() {
+  scheduleGC() {
     if (this._gcHoldCounter > 0) {
       this._shouldScheduleGC = true;
       return;
@@ -701,7 +709,7 @@ function initializeRecordSource(target: MutableRecordSource) {
 /**
  * Updates the target with information from source, also updating a mapping of
  * which records in the target were changed as a result.
- * Additionally, will marc records as invalidated at the current write epoch
+ * Additionally, will mark records as invalidated at the current write epoch
  * given the set of record ids marked as stale in this update.
  */
 function updateTargetFromSource(
@@ -770,7 +778,15 @@ function updateTargetFromSource(
       }
     }
     if (sourceRecord && targetRecord) {
-      const nextRecord = RelayModernRecord.update(targetRecord, sourceRecord);
+      // ReactFlightClientResponses are lazy and only materialize when readRoot
+      // is called when we read the field, so if the record is a Flight field
+      // we always use the new record's data regardless of whether
+      // it actually changed. Let React take care of reconciliation instead.
+      const nextRecord =
+        RelayModernRecord.getType(targetRecord) ===
+        RelayStoreReactFlightUtils.REACT_FLIGHT_TYPE_NAME
+          ? sourceRecord
+          : RelayModernRecord.update(targetRecord, sourceRecord);
       if (nextRecord !== targetRecord) {
         // Prevent mutation of a record from outside the store.
         if (__DEV__) {

package/store/RelayPublishQueue.js.flow

@@ -186,7 +186,7 @@ class RelayPublishQueue implements PublishQueue {
       warning(
         this._isRunning !== true,
         'A store update was detected within another store update. Please ' +
-          'make sure new store updates aren’t being executed within an ' +
+          "make sure new store updates aren't being executed within an " +
           'updater function for a different update.',
       );
       this._isRunning = true;

package/store/RelayReader.js.flow

@@ -21,14 +21,17 @@ const {
   CLIENT_EXTENSION,
   CONDITION,
   DEFER,
+  FLIGHT_FIELD,
   FRAGMENT_SPREAD,
   INLINE_DATA_FRAGMENT_SPREAD,
   INLINE_FRAGMENT,
   LINKED_FIELD,
   MODULE_IMPORT,
+  REQUIRED_FIELD,
   SCALAR_FIELD,
   STREAM,
 } = require('../util/RelayConcreteNode');
+const {getReactFlightClientResponse} = require('./RelayStoreReactFlightUtils');
 const {
   FRAGMENTS_KEY,
   FRAGMENT_OWNER_KEY,
@@ -44,11 +47,13 @@ const {
 const {generateTypeID} = require('./TypeID');
 
 import type {
+  ReaderFlightField,
   ReaderFragmentSpread,
   ReaderInlineDataFragmentSpread,
   ReaderLinkedField,
   ReaderModuleImport,
   ReaderNode,
+  ReaderRequiredField,
   ReaderScalarField,
   ReaderSelection,
 } from '../util/ReaderNode';
@@ -60,6 +65,7 @@ import type {
   SelectorData,
   SingularReaderSelector,
   Snapshot,
+  MissingRequiredFields,
 } from './RelayStoreTypes';
 
 function read(
@@ -76,6 +82,7 @@ function read(
 class RelayReader {
   _isMissingData: boolean;
   _isWithinUnmatchedTypeRefinement: boolean;
+  _missingRequiredFields: ?MissingRequiredFields;
   _owner: RequestDescriptor;
   _recordSource: RecordSource;
   _seenRecords: {[dataID: DataID]: ?Record, ...};
@@ -85,6 +92,7 @@ class RelayReader {
   constructor(recordSource: RecordSource, selector: SingularReaderSelector) {
     this._isMissingData = false;
     this._isWithinUnmatchedTypeRefinement = false;
+    this._missingRequiredFields = null;
     this._owner = selector.owner;
     this._recordSource = recordSource;
     this._seenRecords = {};
@@ -151,6 +159,7 @@ class RelayReader {
       isMissingData: this._isMissingData && isDataExpectedToBePresent,
       seenRecords: this._seenRecords,
       selector: this._selector,
+      missingRequiredFields: this._missingRequiredFields,
     };
   }
 
@@ -168,8 +177,12 @@ class RelayReader {
       return record;
     }
     const data = prevData || {};
-    this._traverseSelections(node.selections, record, data);
-    return data;
+    const hadRequiredData = this._traverseSelections(
+      node.selections,
+      record,
+      data,
+    );
+    return hadRequiredData ? data : null;
   }
 
   _getVariableValue(name: string): mixed {
@@ -181,14 +194,62 @@ class RelayReader {
     return this._variables[name];
   }
 
+  _maybeReportUnexpectedNull(
+    fieldPath: string,
+    action: 'LOG' | 'THROW',
+    record: Record,
+  ) {
+    if (this._missingRequiredFields?.action === 'THROW') {
+      // Chained @required directives may cause a parent `@required(action:
+      // THROW)` field to become null, so the first missing field we
+      // encounter is likely to be the root cause of the error.
+      return;
+    }
+    const owner = this._selector.node.name;
+
+    switch (action) {
+      case 'THROW':
+        this._missingRequiredFields = {action, field: {path: fieldPath, owner}};
+        return;
+      case 'LOG':
+        if (this._missingRequiredFields == null) {
+          this._missingRequiredFields = {action, fields: []};
+        }
+        this._missingRequiredFields.fields.push({path: fieldPath, owner});
+        return;
+      default:
+        (action: empty);
+    }
+  }
+
   _traverseSelections(
     selections: $ReadOnlyArray<ReaderSelection>,
     record: Record,
     data: SelectorData,
-  ): void {
+  ): boolean /* had all expected data */ {
     for (let i = 0; i < selections.length; i++) {
       const selection = selections[i];
       switch (selection.kind) {
+        case REQUIRED_FIELD:
+          invariant(
+            RelayFeatureFlags.ENABLE_REQUIRED_DIRECTIVES,
+            'RelayReader(): Encountered a `@required` directive at path "%s" in `%s` without the `ENABLE_REQUIRED_DIRECTIVES` feature flag enabled.',
+            selection.path,
+            this._selector.node.name,
+          );
+
+          const fieldValue = this._readRequiredField(selection, record, data);
+          if (fieldValue == null) {
+            const {action} = selection;
+            if (action !== 'NONE') {
+              this._maybeReportUnexpectedNull(selection.path, action, record);
+            }
+            // We are going to throw, or our parent is going to get nulled out.
+            // Either way, sibling values are going to be ignored, so we can
+            // bail early here as an optimization.
+            return false;
+          }
+          break;
         case SCALAR_FIELD:
           this._readScalar(selection, record, data);
           break;
@@ -202,7 +263,14 @@ class RelayReader {
         case CONDITION:
           const conditionValue = this._getVariableValue(selection.condition);
           if (conditionValue === selection.passingValue) {
-            this._traverseSelections(selection.selections, record, data);
+            const hasExpectedData = this._traverseSelections(
+              selection.selections,
+              record,
+              data,
+            );
+            if (!hasExpectedData) {
+              return false;
+            }
           }
           break;
         case INLINE_FRAGMENT: {
@@ -211,7 +279,14 @@ class RelayReader {
             // concrete type refinement: only read data if the type exactly matches
             const typeName = RelayModernRecord.getType(record);
             if (typeName != null && typeName === selection.type) {
-              this._traverseSelections(selection.selections, record, data);
+              const hasExpectedData = this._traverseSelections(
+                selection.selections,
+                record,
+                data,
+              );
+              if (!hasExpectedData) {
+                return false;
+              }
             }
           } else if (RelayFeatureFlags.ENABLE_PRECISE_TYPE_REFINEMENT) {
             // Similar to the logic in read(): data is only expected to be present
@@ -260,13 +335,36 @@ class RelayReader {
           this._createInlineDataFragmentPointer(selection, record, data);
           break;
         case DEFER:
-        case CLIENT_EXTENSION:
+        case CLIENT_EXTENSION: {
           const isMissingData = this._isMissingData;
-          this._traverseSelections(selection.selections, record, data);
+          const hasExpectedData = this._traverseSelections(
+            selection.selections,
+            record,
+            data,
+          );
           this._isMissingData = isMissingData;
+          if (!hasExpectedData) {
+            return false;
+          }
           break;
-        case STREAM:
-          this._traverseSelections(selection.selections, record, data);
+        }
+        case STREAM: {
+          const hasExpectedData = this._traverseSelections(
+            selection.selections,
+            record,
+            data,
+          );
+          if (!hasExpectedData) {
+            return false;
+          }
+          break;
+        }
+        case FLIGHT_FIELD:
+          if (RelayFeatureFlags.ENABLE_REACT_FLIGHT_COMPONENT_FIELD) {
+            this._readFlightField(selection, record, data);
+          } else {
+            throw new Error('Flight fields are not yet supported.');
+          }
           break;
         default:
           (selection: empty);
@@ -277,13 +375,76 @@ class RelayReader {
           );
       }
     }
+    return true;
+  }
+
+  _readRequiredField(
+    selection: ReaderRequiredField,
+    record: Record,
+    data: SelectorData,
+  ): ?mixed {
+    switch (selection.field.kind) {
+      case SCALAR_FIELD:
+        return this._readScalar(selection.field, record, data);
+      case LINKED_FIELD:
+        if (selection.field.plural) {
+          return this._readPluralLink(selection.field, record, data);
+        } else {
+          return this._readLink(selection.field, record, data);
+        }
+      default:
+        (selection.field.kind: empty);
+        invariant(
+          false,
+          'RelayReader(): Unexpected ast kind `%s`.',
+          selection.kind,
+        );
+    }
+  }
+
+  _readFlightField(
+    field: ReaderFlightField,
+    record: Record,
+    data: SelectorData,
+  ): ?mixed {
+    const applicationName = field.alias ?? field.name;
+    const storageKey = getStorageKey(field, this._variables);
+    const reactFlightClientResponseRecordID = RelayModernRecord.getLinkedRecordID(
+      record,
+      storageKey,
+    );
+    if (reactFlightClientResponseRecordID == null) {
+      data[applicationName] = reactFlightClientResponseRecordID;
+      if (reactFlightClientResponseRecordID === undefined) {
+        this._isMissingData = true;
+      }
+      return reactFlightClientResponseRecordID;
+    }
+    const reactFlightClientResponseRecord = this._recordSource.get(
+      reactFlightClientResponseRecordID,
+    );
+    this._seenRecords[
+      reactFlightClientResponseRecordID
+    ] = reactFlightClientResponseRecord;
+    if (reactFlightClientResponseRecord == null) {
+      data[applicationName] = reactFlightClientResponseRecord;
+      if (reactFlightClientResponseRecord === undefined) {
+        this._isMissingData = true;
+      }
+      return reactFlightClientResponseRecord;
+    }
+    const clientResponse = getReactFlightClientResponse(
+      reactFlightClientResponseRecord,
+    );
+    data[applicationName] = clientResponse;
+    return clientResponse;
   }
 
   _readScalar(
     field: ReaderScalarField,
     record: Record,
     data: SelectorData,
-  ): void {
+  ): ?mixed {
     const applicationName = field.alias ?? field.name;
     const storageKey = getStorageKey(field, this._variables);
     const value = RelayModernRecord.getValue(record, storageKey);
@@ -291,13 +452,14 @@ class RelayReader {
       this._isMissingData = true;
     }
     data[applicationName] = value;
+    return value;
   }
 
   _readLink(
     field: ReaderLinkedField,
     record: Record,
     data: SelectorData,
-  ): void {
+  ): ?mixed {
     const applicationName = field.alias ?? field.name;
     const storageKey = getStorageKey(field, this._variables);
     const linkedID = RelayModernRecord.getLinkedRecordID(record, storageKey);
@@ -306,7 +468,7 @@ class RelayReader {
       if (linkedID === undefined) {
         this._isMissingData = true;
       }
-      return;
+      return linkedID;
     }
 
     const prevData = data[applicationName];
@@ -319,14 +481,16 @@ class RelayReader {
       prevData,
     );
     // $FlowFixMe[incompatible-variance]
-    data[applicationName] = this._traverse(field, linkedID, prevData);
+    const value = this._traverse(field, linkedID, prevData);
+    data[applicationName] = value;
+    return value;
   }
 
   _readPluralLink(
     field: ReaderLinkedField,
     record: Record,
     data: SelectorData,
-  ): void {
+  ): ?mixed {
     const applicationName = field.alias ?? field.name;
     const storageKey = getStorageKey(field, this._variables);
     const linkedIDs = RelayModernRecord.getLinkedRecordIDs(record, storageKey);
@@ -336,7 +500,7 @@ class RelayReader {
       if (linkedIDs === undefined) {
         this._isMissingData = true;
       }
-      return;
+      return linkedIDs;
     }
 
     const prevData = data[applicationName];
@@ -372,6 +536,7 @@ class RelayReader {
       linkedArray[nextIndex] = this._traverse(field, linkedID, prevItem);
     });
     data[applicationName] = linkedArray;
+    return linkedArray;
   }
 
   /**

package/store/RelayReferenceMarker.js.flow

@@ -15,14 +15,18 @@
 const RelayConcreteNode = require('../util/RelayConcreteNode');
 const RelayFeatureFlags = require('../util/RelayFeatureFlags');
 const RelayModernRecord = require('./RelayModernRecord');
+const RelayStoreReactFlightUtils = require('./RelayStoreReactFlightUtils');
 const RelayStoreUtils = require('./RelayStoreUtils');
 
 const cloneRelayHandleSourceField = require('./cloneRelayHandleSourceField');
+const getOperation = require('../util/getOperation');
 const invariant = require('invariant');
 
 const {generateTypeID} = require('./TypeID');
 
+import type {ReactFlightPayloadQuery} from '../network/RelayNetworkTypes';
 import type {
+  NormalizationFlightField,
   NormalizationLinkedField,
   NormalizationModuleImport,
   NormalizationNode,
@@ -40,6 +44,7 @@ const {
   CONDITION,
   CLIENT_EXTENSION,
   DEFER,
+  FLIGHT_FIELD,
   FRAGMENT_SPREAD,
   INLINE_FRAGMENT,
   LINKED_FIELD,
@@ -50,7 +55,7 @@ const {
   STREAM,
   TYPE_DISCRIMINATOR,
 } = RelayConcreteNode;
-const {getStorageKey, getModuleOperationKey} = RelayStoreUtils;
+const {ROOT_ID, getStorageKey, getModuleOperationKey} = RelayStoreUtils;
 
 function mark(
   recordSource: RecordSource,
@@ -73,6 +78,7 @@ function mark(
  */
 class RelayReferenceMarker {
   _operationLoader: OperationLoader | null;
+  _operationName: ?string;
   _recordSource: RecordSource;
   _references: Set<DataID>;
   _variables: Variables;
@@ -84,12 +90,16 @@ class RelayReferenceMarker {
     operationLoader: ?OperationLoader,
   ) {
     this._operationLoader = operationLoader ?? null;
+    this._operationName = null;
     this._recordSource = recordSource;
     this._references = references;
     this._variables = variables;
   }
 
   mark(node: NormalizationNode, dataID: DataID): void {
+    if (node.kind === 'Operation' || node.kind === 'SplitOperation') {
+      this._operationName = node.name;
+    }
     this._traverse(node, dataID);
   }
 
@@ -146,6 +156,7 @@ class RelayReferenceMarker {
             this._traverseSelections(selection.selections, record);
           }
           break;
+        // $FlowFixMe[incompatible-type]
         case FRAGMENT_SPREAD:
           invariant(
             false,
@@ -195,6 +206,13 @@ class RelayReferenceMarker {
         case CLIENT_EXTENSION:
           this._traverseSelections(selection.selections, record);
           break;
+        case FLIGHT_FIELD:
+          if (RelayFeatureFlags.ENABLE_REACT_FLIGHT_COMPONENT_FIELD) {
+            this._traverseFlightField(selection, record);
+          } else {
+            throw new Error('Flight fields are not yet supported.');
+          }
+          break;
         default:
           (selection: empty);
           invariant(
@@ -213,16 +231,20 @@ class RelayReferenceMarker {
     const operationLoader = this._operationLoader;
     invariant(
       operationLoader !== null,
-      'RelayReferenceMarker: Expected an operationLoader to be configured when using `@module`.',
+      'RelayReferenceMarker: Expected an operationLoader to be configured when using `@module`. ' +
+        'Could not load fragment `%s` in operation `%s`.',
+      moduleImport.fragmentName,
+      this._operationName ?? '(unknown)',
     );
     const operationKey = getModuleOperationKey(moduleImport.documentName);
     const operationReference = RelayModernRecord.getValue(record, operationKey);
     if (operationReference == null) {
       return;
     }
-    const operation = operationLoader.get(operationReference);
-    if (operation != null) {
-      this._traverseSelections(operation.selections, record);
+    const normalizationRootNode = operationLoader.get(operationReference);
+    if (normalizationRootNode != null) {
+      const selections = getOperation(normalizationRootNode).selections;
+      this._traverseSelections(selections, record);
     }
     // Otherwise, if the operation is not available, we assume that the data
     // cannot have been processed yet and therefore isn't in the store to
@@ -252,6 +274,51 @@ class RelayReferenceMarker {
       }
     });
   }
+
+  _traverseFlightField(field: NormalizationFlightField, record: Record): void {
+    const storageKey = getStorageKey(field, this._variables);
+    const linkedID = RelayModernRecord.getLinkedRecordID(record, storageKey);
+    if (linkedID == null) {
+      return;
+    }
+    this._references.add(linkedID);
+
+    const reactFlightClientResponseRecord = this._recordSource.get(linkedID);
+
+    if (reactFlightClientResponseRecord == null) {
+      return;
+    }
+
+    const reachableQueries = RelayModernRecord.getValue(
+      reactFlightClientResponseRecord,
+      RelayStoreReactFlightUtils.REACT_FLIGHT_QUERIES_STORAGE_KEY,
+    );
+
+    if (!Array.isArray(reachableQueries)) {
+      return;
+    }
+
+    const operationLoader = this._operationLoader;
+    invariant(
+      operationLoader !== null,
+      'DataChecker: Expected an operationLoader to be configured when using ' +
+        'React Flight',
+    );
+    // In Flight, the variables that are in scope for reachable queries aren't
+    // the same as what's in scope for the outer query.
+    const prevVariables = this._variables;
+    // $FlowFixMe[incompatible-cast]
+    for (const query of (reachableQueries: Array<ReactFlightPayloadQuery>)) {
+      this._variables = query.variables;
+      const operationReference = query.module;
+      const normalizationRootNode = operationLoader.get(operationReference);
+      if (normalizationRootNode != null) {
+        const operation = getOperation(normalizationRootNode);
+        this._traverse(operation, ROOT_ID);
+      }
+    }
+    this._variables = prevVariables;
+  }
 }
 
 module.exports = {mark};