react-server-dom-webpack 19.0.0-rc-99da76f23a-20240606 → 19.0.0-rc-cc1ec60d0d-20240607

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11,6 +11,30 @@
11
11
  "use strict";
12
12
  var ReactDOM = require("react-dom"),
13
13
  React = require("react"),
14
+ channel = new MessageChannel(),
15
+ taskQueue = [];
16
+ channel.port1.onmessage = function () {
17
+ var task = taskQueue.shift();
18
+ task && task();
19
+ };
20
+ function scheduleWork(callback) {
21
+ taskQueue.push(callback);
22
+ channel.port2.postMessage(null);
23
+ }
24
+ function handleErrorInNextTick(error) {
25
+ setTimeout(function () {
26
+ throw error;
27
+ });
28
+ }
29
+ var LocalPromise = Promise,
30
+ scheduleMicrotask =
31
+ "function" === typeof queueMicrotask
32
+ ? queueMicrotask
33
+ : function (callback) {
34
+ LocalPromise.resolve(null)
35
+ .then(callback)
36
+ .catch(handleErrorInNextTick);
37
+ },
14
38
  currentView = null,
15
39
  writtenBytes = 0;
16
40
  function writeChunkAndReturn(destination, chunk) {
@@ -670,7 +694,8 @@ if (!ReactSharedInternalsServer)
670
694
  'The "react" package in this environment is not configured correctly. The "react-server" condition must be enabled in any environment that runs React Server Components.'
671
695
  );
672
696
  var ObjectPrototype = Object.prototype,
673
- stringify = JSON.stringify;
697
+ stringify = JSON.stringify,
698
+ AbortSigil = {};
674
699
  function defaultErrorHandler(error) {
675
700
  console.error(error);
676
701
  }
@@ -746,6 +771,14 @@ function serializeThenable(request, task, thenable) {
746
771
  newTask.id
747
772
  );
748
773
  default:
774
+ if (1 === request.status)
775
+ return (
776
+ (newTask.status = 3),
777
+ (task = stringify(serializeByValueID(request.fatalError))),
778
+ emitModelChunk(request, newTask.id, task),
779
+ request.abortableTasks.delete(newTask),
780
+ newTask.id
781
+ );
749
782
  "string" !== typeof thenable.status &&
750
783
  ((thenable.status = "pending"),
751
784
  thenable.then(
@@ -932,6 +965,7 @@ function renderFunctionComponent(request, task, key, Component, props) {
932
965
  thenableIndexCounter = 0;
933
966
  thenableState = prevThenableState;
934
967
  Component = Component(props, void 0);
968
+ if (1 === request.status) throw AbortSigil;
935
969
  if (
936
970
  "object" === typeof Component &&
937
971
  null !== Component &&
@@ -1029,6 +1063,7 @@ function renderElement(request, task, type, key, ref, props) {
1029
1063
  case REACT_LAZY_TYPE:
1030
1064
  var init = type._init;
1031
1065
  type = init(type._payload);
1066
+ if (1 === request.status) throw AbortSigil;
1032
1067
  return renderElement(request, task, type, key, ref, props);
1033
1068
  case REACT_FORWARD_REF_TYPE:
1034
1069
  return renderFunctionComponent(request, task, key, type.render, props);
@@ -1045,7 +1080,9 @@ function pingTask(request, task) {
1045
1080
  pingedTasks.push(task);
1046
1081
  1 === pingedTasks.length &&
1047
1082
  ((request.flushScheduled = null !== request.destination),
1048
- performWork(request));
1083
+ scheduleMicrotask(function () {
1084
+ return performWork(request);
1085
+ }));
1049
1086
  }
1050
1087
  function createTask(request, model, keyPath, implicitSlot, abortSet) {
1051
1088
  request.pendingChunks++;
@@ -1077,50 +1114,61 @@ function createTask(request, model, keyPath, implicitSlot, abortSet) {
1077
1114
  );
1078
1115
  } catch (thrownValue) {
1079
1116
  if (
1080
- ((parentPropertyName =
1117
+ ((parentPropertyName = task.model),
1118
+ (parentPropertyName =
1119
+ "object" === typeof parentPropertyName &&
1120
+ null !== parentPropertyName &&
1121
+ (parentPropertyName.$$typeof === REACT_ELEMENT_TYPE ||
1122
+ parentPropertyName.$$typeof === REACT_LAZY_TYPE)),
1123
+ (value =
1081
1124
  thrownValue === SuspenseException
1082
1125
  ? getSuspendedThenable()
1083
1126
  : thrownValue),
1084
- (value = task.model),
1085
- (value =
1086
- "object" === typeof value &&
1127
+ "object" === typeof value &&
1087
1128
  null !== value &&
1088
- (value.$$typeof === REACT_ELEMENT_TYPE ||
1089
- value.$$typeof === REACT_LAZY_TYPE)),
1090
- "object" === typeof parentPropertyName &&
1091
- null !== parentPropertyName &&
1092
- "function" === typeof parentPropertyName.then)
1093
- ) {
1094
- JSCompiler_inline_result = createTask(
1095
- request,
1096
- task.model,
1097
- task.keyPath,
1098
- task.implicitSlot,
1099
- request.abortableTasks
1100
- );
1101
- var ping = JSCompiler_inline_result.ping;
1102
- parentPropertyName.then(ping, ping);
1103
- JSCompiler_inline_result.thenableState =
1104
- getThenableStateAfterSuspending();
1105
- task.keyPath = prevKeyPath;
1106
- task.implicitSlot = prevImplicitSlot;
1107
- JSCompiler_inline_result = value
1108
- ? "$L" + JSCompiler_inline_result.id.toString(16)
1109
- : serializeByValueID(JSCompiler_inline_result.id);
1110
- } else if (
1129
+ "function" === typeof value.then)
1130
+ )
1131
+ if (1 === request.status)
1132
+ (task.status = 3),
1133
+ (prevKeyPath = request.fatalError),
1134
+ (JSCompiler_inline_result = parentPropertyName
1135
+ ? "$L" + prevKeyPath.toString(16)
1136
+ : serializeByValueID(prevKeyPath));
1137
+ else {
1138
+ JSCompiler_inline_result = createTask(
1139
+ request,
1140
+ task.model,
1141
+ task.keyPath,
1142
+ task.implicitSlot,
1143
+ request.abortableTasks
1144
+ );
1145
+ var ping = JSCompiler_inline_result.ping;
1146
+ value.then(ping, ping);
1147
+ JSCompiler_inline_result.thenableState =
1148
+ getThenableStateAfterSuspending();
1149
+ task.keyPath = prevKeyPath;
1150
+ task.implicitSlot = prevImplicitSlot;
1151
+ JSCompiler_inline_result = parentPropertyName
1152
+ ? "$L" + JSCompiler_inline_result.id.toString(16)
1153
+ : serializeByValueID(JSCompiler_inline_result.id);
1154
+ }
1155
+ else if (thrownValue === AbortSigil)
1156
+ (task.status = 3),
1157
+ (prevKeyPath = request.fatalError),
1158
+ (JSCompiler_inline_result = parentPropertyName
1159
+ ? "$L" + prevKeyPath.toString(16)
1160
+ : serializeByValueID(prevKeyPath));
1161
+ else if (
1111
1162
  ((task.keyPath = prevKeyPath),
1112
1163
  (task.implicitSlot = prevImplicitSlot),
1113
- value)
1164
+ parentPropertyName)
1114
1165
  )
1115
1166
  request.pendingChunks++,
1116
1167
  (prevKeyPath = request.nextChunkId++),
1117
- (prevImplicitSlot = logRecoverableError(
1118
- request,
1119
- parentPropertyName
1120
- )),
1168
+ (prevImplicitSlot = logRecoverableError(request, value)),
1121
1169
  emitErrorChunk(request, prevKeyPath, prevImplicitSlot),
1122
1170
  (JSCompiler_inline_result = "$L" + prevKeyPath.toString(16));
1123
- else throw parentPropertyName;
1171
+ else throw value;
1124
1172
  }
1125
1173
  return JSCompiler_inline_result;
1126
1174
  },
@@ -1273,12 +1321,11 @@ function renderModelDestructive(
1273
1321
  parentPropertyName
1274
1322
  );
1275
1323
  case REACT_LAZY_TYPE:
1276
- return (
1277
- (task.thenableState = null),
1278
- (parentPropertyName = value._init),
1279
- (value = parentPropertyName(value._payload)),
1280
- renderModelDestructive(request, task, emptyRoot, "", value)
1281
- );
1324
+ task.thenableState = null;
1325
+ parentPropertyName = value._init;
1326
+ value = parentPropertyName(value._payload);
1327
+ if (1 === request.status) throw AbortSigil;
1328
+ return renderModelDestructive(request, task, emptyRoot, "", value);
1282
1329
  case REACT_LEGACY_ELEMENT_TYPE:
1283
1330
  throw Error(
1284
1331
  'A React Element from an older version of React was rendered. This is not supported. It can happen if:\n- Multiple copies of the "react" package is used.\n- A library pre-bundled an old copy of "react" or "react/jsx-runtime".\n- A compiler tries to "inline" JSX instead of using the runtime.'
@@ -1539,8 +1586,8 @@ function logRecoverableError(request, error) {
1539
1586
  }
1540
1587
  function fatalError(request, error) {
1541
1588
  null !== request.destination
1542
- ? ((request.status = 2), closeWithError(request.destination, error))
1543
- : ((request.status = 1), (request.fatalError = error));
1589
+ ? ((request.status = 3), closeWithError(request.destination, error))
1590
+ : ((request.status = 2), (request.fatalError = error));
1544
1591
  }
1545
1592
  function emitErrorChunk(request, id, digest) {
1546
1593
  digest = { digest: digest };
@@ -1609,7 +1656,8 @@ function emitChunk(request, task, value) {
1609
1656
  }
1610
1657
  var emptyRoot = {};
1611
1658
  function retryTask(request, task) {
1612
- if (0 === task.status)
1659
+ if (0 === task.status) {
1660
+ task.status = 5;
1613
1661
  try {
1614
1662
  modelRoot = task.model;
1615
1663
  var resolvedModel = renderModelDestructive(
@@ -1636,10 +1684,23 @@ function retryTask(request, task) {
1636
1684
  thrownValue === SuspenseException
1637
1685
  ? getSuspendedThenable()
1638
1686
  : thrownValue;
1639
- if ("object" === typeof x && null !== x && "function" === typeof x.then) {
1640
- var ping = task.ping;
1641
- x.then(ping, ping);
1642
- task.thenableState = getThenableStateAfterSuspending();
1687
+ if ("object" === typeof x && null !== x && "function" === typeof x.then)
1688
+ if (1 === request.status) {
1689
+ request.abortableTasks.delete(task);
1690
+ task.status = 3;
1691
+ var model = stringify(serializeByValueID(request.fatalError));
1692
+ emitModelChunk(request, task.id, model);
1693
+ } else {
1694
+ task.status = 0;
1695
+ task.thenableState = getThenableStateAfterSuspending();
1696
+ var ping = task.ping;
1697
+ x.then(ping, ping);
1698
+ }
1699
+ else if (x === AbortSigil) {
1700
+ request.abortableTasks.delete(task);
1701
+ task.status = 3;
1702
+ var model$19 = stringify(serializeByValueID(request.fatalError));
1703
+ emitModelChunk(request, task.id, model$19);
1643
1704
  } else {
1644
1705
  request.abortableTasks.delete(task);
1645
1706
  task.status = 4;
@@ -1648,6 +1709,7 @@ function retryTask(request, task) {
1648
1709
  }
1649
1710
  } finally {
1650
1711
  }
1712
+ }
1651
1713
  }
1652
1714
  function performWork(request) {
1653
1715
  var prevDispatcher = ReactSharedInternalsServer.H;
@@ -1705,54 +1767,72 @@ function flushCompletedChunks(request, destination) {
1705
1767
  (writtenBytes = 0));
1706
1768
  }
1707
1769
  0 === request.pendingChunks &&
1708
- (destination.close(), (request.destination = null));
1770
+ ((request.status = 3), destination.close(), (request.destination = null));
1771
+ }
1772
+ function startWork(request) {
1773
+ request.flushScheduled = null !== request.destination;
1774
+ scheduleWork(function () {
1775
+ return performWork(request);
1776
+ });
1709
1777
  }
1710
1778
  function enqueueFlush(request) {
1711
- if (
1712
- !1 === request.flushScheduled &&
1779
+ !1 === request.flushScheduled &&
1713
1780
  0 === request.pingedTasks.length &&
1714
- null !== request.destination
1715
- ) {
1716
- var destination = request.destination;
1717
- request.flushScheduled = !0;
1718
- flushCompletedChunks(request, destination);
1719
- }
1781
+ null !== request.destination &&
1782
+ ((request.flushScheduled = !0),
1783
+ scheduleWork(function () {
1784
+ request.flushScheduled = !1;
1785
+ var destination = request.destination;
1786
+ destination && flushCompletedChunks(request, destination);
1787
+ }));
1720
1788
  }
1721
1789
  function abort(request, reason) {
1722
1790
  try {
1791
+ request.status = 1;
1723
1792
  var abortableTasks = request.abortableTasks;
1724
1793
  if (0 < abortableTasks.size) {
1725
1794
  request.pendingChunks++;
1726
- var errorId = request.nextChunkId++,
1727
- error =
1795
+ var errorId = request.nextChunkId++;
1796
+ request.fatalError = errorId;
1797
+ var error =
1728
1798
  void 0 === reason
1729
1799
  ? Error("The render was aborted by the server without a reason.")
1800
+ : "object" === typeof reason &&
1801
+ null !== reason &&
1802
+ "function" === typeof reason.then
1803
+ ? Error("The render was aborted by the server with a promise.")
1730
1804
  : reason,
1731
1805
  digest = logRecoverableError(request, error);
1732
1806
  emitErrorChunk(request, errorId, digest, error);
1733
1807
  abortableTasks.forEach(function (task) {
1734
- task.status = 3;
1735
- var ref = serializeByValueID(errorId);
1736
- task = encodeReferenceChunk(request, task.id, ref);
1737
- request.completedErrorChunks.push(task);
1808
+ if (5 !== task.status) {
1809
+ task.status = 3;
1810
+ var ref = serializeByValueID(errorId);
1811
+ task = encodeReferenceChunk(request, task.id, ref);
1812
+ request.completedErrorChunks.push(task);
1813
+ }
1738
1814
  });
1739
1815
  abortableTasks.clear();
1740
1816
  }
1741
1817
  var abortListeners = request.abortListeners;
1742
1818
  if (0 < abortListeners.size) {
1743
- var error$22 =
1819
+ var error$26 =
1744
1820
  void 0 === reason
1745
1821
  ? Error("The render was aborted by the server without a reason.")
1822
+ : "object" === typeof reason &&
1823
+ null !== reason &&
1824
+ "function" === typeof reason.then
1825
+ ? Error("The render was aborted by the server with a promise.")
1746
1826
  : reason;
1747
1827
  abortListeners.forEach(function (callback) {
1748
- return callback(error$22);
1828
+ return callback(error$26);
1749
1829
  });
1750
1830
  abortListeners.clear();
1751
1831
  }
1752
1832
  null !== request.destination &&
1753
1833
  flushCompletedChunks(request, request.destination);
1754
- } catch (error$23) {
1755
- logRecoverableError(request, error$23), fatalError(request, error$23);
1834
+ } catch (error$27) {
1835
+ logRecoverableError(request, error$27), fatalError(request, error$27);
1756
1836
  }
1757
1837
  }
1758
1838
  function resolveServerReference(bundlerConfig, id) {
@@ -2204,8 +2284,8 @@ function parseReadableStream(response, reference, type) {
2204
2284
  (previousBlockedChunk = chunk));
2205
2285
  } else {
2206
2286
  chunk = previousBlockedChunk;
2207
- var chunk$26 = createPendingChunk(response);
2208
- chunk$26.then(
2287
+ var chunk$30 = createPendingChunk(response);
2288
+ chunk$30.then(
2209
2289
  function (v) {
2210
2290
  return controller.enqueue(v);
2211
2291
  },
@@ -2213,10 +2293,10 @@ function parseReadableStream(response, reference, type) {
2213
2293
  return controller.error(e);
2214
2294
  }
2215
2295
  );
2216
- previousBlockedChunk = chunk$26;
2296
+ previousBlockedChunk = chunk$30;
2217
2297
  chunk.then(function () {
2218
- previousBlockedChunk === chunk$26 && (previousBlockedChunk = null);
2219
- resolveModelChunk(chunk$26, json, -1);
2298
+ previousBlockedChunk === chunk$30 && (previousBlockedChunk = null);
2299
+ resolveModelChunk(chunk$30, json, -1);
2220
2300
  });
2221
2301
  }
2222
2302
  },
@@ -2581,13 +2661,12 @@ exports.renderToReadableStream = function (model, webpackMap, options) {
2581
2661
  {
2582
2662
  type: "bytes",
2583
2663
  start: function () {
2584
- request.flushScheduled = null !== request.destination;
2585
- performWork(request);
2664
+ startWork(request);
2586
2665
  },
2587
2666
  pull: function (controller) {
2588
- if (1 === request.status)
2589
- (request.status = 2), closeWithError(controller, request.fatalError);
2590
- else if (2 !== request.status && null === request.destination) {
2667
+ if (2 === request.status)
2668
+ (request.status = 3), closeWithError(controller, request.fatalError);
2669
+ else if (3 !== request.status && null === request.destination) {
2591
2670
  request.destination = controller;
2592
2671
  try {
2593
2672
  flushCompletedChunks(request, controller);
@@ -94,6 +94,16 @@ function printWarning(level, format, args, currentStack) {
94
94
  }
95
95
  }
96
96
 
97
+ function handleErrorInNextTick(error) {
98
+ setTimeout(function () {
99
+ throw error;
100
+ });
101
+ }
102
+
103
+ var LocalPromise = Promise;
104
+ var scheduleMicrotask = typeof queueMicrotask === 'function' ? queueMicrotask : function (callback) {
105
+ LocalPromise.resolve(null).then(callback).catch(handleErrorInNextTick);
106
+ };
97
107
  function scheduleWork(callback) {
98
108
  setTimeout(callback, 0);
99
109
  }
@@ -1579,6 +1589,8 @@ var PENDING$1 = 0;
1579
1589
  var COMPLETED = 1;
1580
1590
  var ABORTED = 3;
1581
1591
  var ERRORED$1 = 4;
1592
+ var RENDERING = 5;
1593
+ var AbortSigil = {};
1582
1594
 
1583
1595
  function defaultErrorHandler(error) {
1584
1596
  console['error'](error); // Don't transform to our wrapper
@@ -1588,8 +1600,9 @@ function defaultPostponeHandler(reason) {// Noop
1588
1600
  }
1589
1601
 
1590
1602
  var OPEN = 0;
1591
- var CLOSING = 1;
1592
- var CLOSED = 2;
1603
+ var ABORTING = 1;
1604
+ var CLOSING = 2;
1605
+ var CLOSED = 3;
1593
1606
  function createRequest(model, bundlerConfig, onError, identifierPrefix, onPostpone, environmentName, temporaryReferences) {
1594
1607
  if (ReactSharedInternals.A !== null && ReactSharedInternals.A !== DefaultAsyncDispatcher) {
1595
1608
  throw new Error('Currently React only supports one RSC renderer at a time.');
@@ -1687,6 +1700,16 @@ function serializeThenable(request, task, thenable) {
1687
1700
 
1688
1701
  default:
1689
1702
  {
1703
+ if (request.status === ABORTING) {
1704
+ // We can no longer accept any resolved values
1705
+ newTask.status = ABORTED;
1706
+ var errorId = request.fatalError;
1707
+ var model = stringify(serializeByValueID(errorId));
1708
+ emitModelChunk(request, newTask.id, model);
1709
+ request.abortableTasks.delete(newTask);
1710
+ return newTask.id;
1711
+ }
1712
+
1690
1713
  if (typeof thenable.status === 'string') {
1691
1714
  // Only instrument the thenable if the status if not defined. If
1692
1715
  // it's defined, but an unknown value, assume it's been instrumented by
@@ -2063,6 +2086,13 @@ validated) // DEV-only
2063
2086
  result = callComponentInDEV(Component, props, componentDebugInfo);
2064
2087
  }
2065
2088
 
2089
+ if (request.status === ABORTING) {
2090
+ // If we aborted during rendering we should interrupt the render but
2091
+ // we don't need to provide an error because the renderer will encode
2092
+ // the abort error as the reason.
2093
+ throw AbortSigil;
2094
+ }
2095
+
2066
2096
  if (typeof result === 'object' && result !== null && !isClientReference(result)) {
2067
2097
  if (typeof result.then === 'function') {
2068
2098
  // When the return value is in children position we can resolve it immediately,
@@ -2404,6 +2434,13 @@ validated) // DEV only
2404
2434
  wrappedType = callLazyInitInDEV(type);
2405
2435
  }
2406
2436
 
2437
+ if (request.status === ABORTING) {
2438
+ // lazy initializers are user code and could abort during render
2439
+ // we don't wan to return any value resolved from the lazy initializer
2440
+ // if it aborts so we interrupt rendering here
2441
+ throw AbortSigil;
2442
+ }
2443
+
2407
2444
  return renderElement(request, task, wrappedType, key, ref, props, owner);
2408
2445
  }
2409
2446
 
@@ -2428,7 +2465,7 @@ function pingTask(request, task) {
2428
2465
 
2429
2466
  if (pingedTasks.length === 1) {
2430
2467
  request.flushScheduled = request.destination !== null;
2431
- scheduleWork(function () {
2468
+ scheduleMicrotask(function () {
2432
2469
  return performWork(request);
2433
2470
  });
2434
2471
  }
@@ -2726,21 +2763,32 @@ function renderModel(request, task, parent, key, value) {
2726
2763
  try {
2727
2764
  return renderModelDestructive(request, task, parent, key, value);
2728
2765
  } catch (thrownValue) {
2766
+ // If the suspended/errored value was an element or lazy it can be reduced
2767
+ // to a lazy reference, so that it doesn't error the parent.
2768
+ var model = task.model;
2769
+ var wasReactNode = typeof model === 'object' && model !== null && (model.$$typeof === REACT_ELEMENT_TYPE || model.$$typeof === REACT_LAZY_TYPE);
2729
2770
  var x = thrownValue === SuspenseException ? // This is a special type of exception used for Suspense. For historical
2730
2771
  // reasons, the rest of the Suspense implementation expects the thrown
2731
2772
  // value to be a thenable, because before `use` existed that was the
2732
2773
  // (unstable) API for suspending. This implementation detail can change
2733
2774
  // later, once we deprecate the old API in favor of `use`.
2734
- getSuspendedThenable() : thrownValue; // If the suspended/errored value was an element or lazy it can be reduced
2735
- // to a lazy reference, so that it doesn't error the parent.
2736
-
2737
- var model = task.model;
2738
- var wasReactNode = typeof model === 'object' && model !== null && (model.$$typeof === REACT_ELEMENT_TYPE || model.$$typeof === REACT_LAZY_TYPE);
2775
+ getSuspendedThenable() : thrownValue;
2739
2776
 
2740
2777
  if (typeof x === 'object' && x !== null) {
2741
2778
  // $FlowFixMe[method-unbinding]
2742
2779
  if (typeof x.then === 'function') {
2743
- // Something suspended, we'll need to create a new task and resolve it later.
2780
+ if (request.status === ABORTING) {
2781
+ task.status = ABORTED;
2782
+ var errorId = request.fatalError;
2783
+
2784
+ if (wasReactNode) {
2785
+ return serializeLazyID(errorId);
2786
+ }
2787
+
2788
+ return serializeByValueID(errorId);
2789
+ } // Something suspended, we'll need to create a new task and resolve it later.
2790
+
2791
+
2744
2792
  var newTask = createTask(request, task.model, task.keyPath, task.implicitSlot, request.abortableTasks);
2745
2793
  var ping = newTask.ping;
2746
2794
  x.then(ping, ping);
@@ -2756,6 +2804,17 @@ function renderModel(request, task, parent, key, value) {
2756
2804
 
2757
2805
  return serializeByValueID(newTask.id);
2758
2806
  }
2807
+ }
2808
+
2809
+ if (thrownValue === AbortSigil) {
2810
+ task.status = ABORTED;
2811
+ var _errorId = request.fatalError;
2812
+
2813
+ if (wasReactNode) {
2814
+ return serializeLazyID(_errorId);
2815
+ }
2816
+
2817
+ return serializeByValueID(_errorId);
2759
2818
  } // Restore the context. We assume that this will be restored by the inner
2760
2819
  // functions in case nothing throws so we don't use "finally" here.
2761
2820
 
@@ -2768,10 +2827,12 @@ function renderModel(request, task, parent, key, value) {
2768
2827
  // We'll replace this element with a lazy reference that throws on the client
2769
2828
  // once it gets rendered.
2770
2829
  request.pendingChunks++;
2771
- var errorId = request.nextChunkId++;
2830
+
2831
+ var _errorId2 = request.nextChunkId++;
2832
+
2772
2833
  var digest = logRecoverableError(request, x);
2773
- emitErrorChunk(request, errorId, digest, x);
2774
- return serializeLazyID(errorId);
2834
+ emitErrorChunk(request, _errorId2, digest, x);
2835
+ return serializeLazyID(_errorId2);
2775
2836
  } // Something errored but it was not in a React Node. There's no need to serialize
2776
2837
  // it by value because it'll just error the whole parent row anyway so we can
2777
2838
  // just stop any siblings and error the whole parent row.
@@ -2875,6 +2936,13 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
2875
2936
  resolvedModel = callLazyInitInDEV(lazy);
2876
2937
  }
2877
2938
 
2939
+ if (request.status === ABORTING) {
2940
+ // lazy initializers are user code and could abort during render
2941
+ // we don't wan to return any value resolved from the lazy initializer
2942
+ // if it aborts so we interrupt rendering here
2943
+ throw AbortSigil;
2944
+ }
2945
+
2878
2946
  {
2879
2947
  var _debugInfo = lazy._debugInfo;
2880
2948
 
@@ -3789,6 +3857,7 @@ function retryTask(request, task) {
3789
3857
  }
3790
3858
 
3791
3859
  var prevDebugID = debugID;
3860
+ task.status = RENDERING;
3792
3861
 
3793
3862
  try {
3794
3863
  // Track the root so we know that we have to emit this object even though it
@@ -3845,14 +3914,35 @@ function retryTask(request, task) {
3845
3914
  if (typeof x === 'object' && x !== null) {
3846
3915
  // $FlowFixMe[method-unbinding]
3847
3916
  if (typeof x.then === 'function') {
3848
- // Something suspended again, let's pick it back up later.
3917
+ if (request.status === ABORTING) {
3918
+ request.abortableTasks.delete(task);
3919
+ task.status = ABORTED;
3920
+ var errorId = request.fatalError;
3921
+ var model = stringify(serializeByValueID(errorId));
3922
+ emitModelChunk(request, task.id, model);
3923
+ return;
3924
+ } // Something suspended again, let's pick it back up later.
3925
+
3926
+
3927
+ task.status = PENDING$1;
3928
+ task.thenableState = getThenableStateAfterSuspending();
3849
3929
  var ping = task.ping;
3850
3930
  x.then(ping, ping);
3851
- task.thenableState = getThenableStateAfterSuspending();
3852
3931
  return;
3853
3932
  }
3854
3933
  }
3855
3934
 
3935
+ if (x === AbortSigil) {
3936
+ request.abortableTasks.delete(task);
3937
+ task.status = ABORTED;
3938
+ var _errorId3 = request.fatalError;
3939
+
3940
+ var _model = stringify(serializeByValueID(_errorId3));
3941
+
3942
+ emitModelChunk(request, task.id, _model);
3943
+ return;
3944
+ }
3945
+
3856
3946
  request.abortableTasks.delete(task);
3857
3947
  task.status = ERRORED$1;
3858
3948
  var digest = logRecoverableError(request, x);
@@ -3914,6 +4004,11 @@ function performWork(request) {
3914
4004
  }
3915
4005
 
3916
4006
  function abortTask(task, request, errorId) {
4007
+ if (task.status === RENDERING) {
4008
+ // This task will be aborted by the render
4009
+ return;
4010
+ }
4011
+
3917
4012
  task.status = ABORTED; // Instead of emitting an error per task.id, we emit a model that only
3918
4013
  // has a single value referencing the error.
3919
4014
 
@@ -4006,6 +4101,7 @@ function flushCompletedChunks(request, destination) {
4006
4101
 
4007
4102
  if (request.pendingChunks === 0) {
4008
4103
 
4104
+ request.status = CLOSED;
4009
4105
  close$1(destination);
4010
4106
  request.destination = null;
4011
4107
  }
@@ -4030,10 +4126,14 @@ function enqueueFlush(request) {
4030
4126
  request.pingedTasks.length === 0 && // If there is no destination there is nothing we can flush to. A flush will
4031
4127
  // happen when we start flowing again
4032
4128
  request.destination !== null) {
4033
- var destination = request.destination;
4034
4129
  request.flushScheduled = true;
4035
4130
  scheduleWork(function () {
4036
- return flushCompletedChunks(request, destination);
4131
+ request.flushScheduled = false;
4132
+ var destination = request.destination;
4133
+
4134
+ if (destination) {
4135
+ flushCompletedChunks(request, destination);
4136
+ }
4037
4137
  });
4038
4138
  }
4039
4139
  }
@@ -4069,15 +4169,17 @@ function stopFlowing(request) {
4069
4169
 
4070
4170
  function abort(request, reason) {
4071
4171
  try {
4172
+ request.status = ABORTING;
4072
4173
  var abortableTasks = request.abortableTasks; // We have tasks to abort. We'll emit one error row and then emit a reference
4073
4174
  // to that row from every row that's still remaining.
4074
4175
 
4075
4176
  if (abortableTasks.size > 0) {
4076
4177
  request.pendingChunks++;
4077
4178
  var errorId = request.nextChunkId++;
4179
+ request.fatalError = errorId;
4078
4180
 
4079
4181
  var postponeInstance; if (enablePostpone && typeof reason === 'object' && reason !== null && reason.$$typeof === REACT_POSTPONE_TYPE) ; else {
4080
- var error = reason === undefined ? new Error('The render was aborted by the server without a reason.') : reason;
4182
+ var error = reason === undefined ? new Error('The render was aborted by the server without a reason.') : typeof reason === 'object' && reason !== null && typeof reason.then === 'function' ? new Error('The render was aborted by the server with a promise.') : reason;
4081
4183
  var digest = logRecoverableError(request, error);
4082
4184
  emitErrorChunk(request, errorId, digest, error);
4083
4185
  }
@@ -4094,7 +4196,7 @@ function abort(request, reason) {
4094
4196
  var _error;
4095
4197
 
4096
4198
  if (enablePostpone && typeof reason === 'object' && reason !== null && reason.$$typeof === REACT_POSTPONE_TYPE) ; else {
4097
- _error = reason === undefined ? new Error('The render was aborted by the server without a reason.') : reason;
4199
+ _error = reason === undefined ? new Error('The render was aborted by the server without a reason.') : typeof reason === 'object' && reason !== null && typeof reason.then === 'function' ? new Error('The render was aborted by the server with a promise.') : reason;
4098
4200
  }
4099
4201
 
4100
4202
  abortListeners.forEach(function (callback) {