diff --git a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspendedBy.js b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspendedBy.js
index d1da51a0cf1fe..19cc47f982cbf 100644
--- a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspendedBy.js
+++ b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspendedBy.js
@@ -300,9 +300,31 @@ type Props = {
store: Store,
};
-function compareTime(a: SerializedAsyncInfo, b: SerializedAsyncInfo): number {
- const ioA = a.awaited;
- const ioB = b.awaited;
+function withIndex(
+ value: SerializedAsyncInfo,
+ index: number,
+): {
+ index: number,
+ value: SerializedAsyncInfo,
+} {
+ return {
+ index,
+ value,
+ };
+}
+
+function compareTime(
+ a: {
+ index: number,
+ value: SerializedAsyncInfo,
+ },
+ b: {
+ index: number,
+ value: SerializedAsyncInfo,
+ },
+): number {
+ const ioA = a.value.awaited;
+ const ioB = b.value.awaited;
if (ioA.start === ioB.start) {
return ioA.end - ioB.end;
}
@@ -364,7 +386,8 @@ export default function InspectedElementSuspendedBy({
minTime = maxTime - 25;
}
- const sortedSuspendedBy = suspendedBy === null ? [] : suspendedBy.slice(0);
+ const sortedSuspendedBy =
+ suspendedBy === null ? [] : suspendedBy.map(withIndex);
sortedSuspendedBy.sort(compareTime);
let unknownSuspenders = null;
@@ -407,11 +430,11 @@ export default function InspectedElementSuspendedBy({
- {sortedSuspendedBy.map((asyncInfo, index) => (
+ {sortedSuspendedBy.map(({value, index}) => (