Skip to content

Commit 553420e

Browse files
committed
refactor hash to digest
1 parent e4c8a38 commit 553420e

12 files changed

+107
-76
lines changed

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -92,11 +92,11 @@ describe('ReactDOMFizzServer', () => {
9292
function expectErrors(errorsArr, toBeDevArr, toBeProdArr) {
9393
const mappedErrows = errorsArr.map(({error, errorInfo}) => {
9494
const stack = errorInfo && errorInfo.componentStack;
95-
const errorHash = errorInfo && errorInfo.errorHash;
95+
const digest = errorInfo && errorInfo.digest;
9696
if (stack) {
97-
return [error.message, errorHash, normalizeCodeLocInfo(stack)];
98-
} else if (errorHash) {
99-
return [error.message, errorHash];
97+
return [error.message, digest, normalizeCodeLocInfo(stack)];
98+
} else if (digest) {
99+
return [error.message, digest];
100100
}
101101
return error.message;
102102
});

packages/react-dom/src/client/ReactDOMHostConfig.js

+32-11
Original file line numberDiff line numberDiff line change
@@ -729,22 +729,43 @@ export function isSuspenseInstancePending(instance: SuspenseInstance) {
729729
export function isSuspenseInstanceFallback(instance: SuspenseInstance) {
730730
return instance.data === SUSPENSE_FALLBACK_START_DATA;
731731
}
732+
732733
export function getSuspenseInstanceFallbackErrorDetails(
733734
instance: SuspenseInstance,
734-
): {message?: string, stack?: string, hash?: string} {
735-
const nextSibling = instance.nextSibling;
736-
if (
737-
nextSibling &&
738-
nextSibling.nodeType === ELEMENT_NODE &&
739-
nextSibling.nodeName.toLowerCase() === 'template'
740-
) {
735+
): {digest: ?string, message?: string, stack?: string} {
736+
const dataset =
737+
instance.nextSibling && ((instance.nextSibling: any): HTMLElement).dataset;
738+
let digest, message, stack;
739+
if (dataset) {
740+
digest = dataset.dgst;
741+
if (__DEV__) {
742+
message = dataset.msg;
743+
stack = dataset.stck;
744+
}
745+
}
746+
if (__DEV__) {
741747
return {
742-
message: ((nextSibling: any): HTMLTemplateElement).dataset.msg,
743-
stack: ((nextSibling: any): HTMLTemplateElement).dataset.stack,
744-
hash: ((nextSibling: any): HTMLTemplateElement).dataset.hash,
748+
message,
749+
digest,
750+
stack,
751+
};
752+
} else {
753+
return {
754+
digest,
745755
};
746756
}
747-
return {};
757+
758+
// let value = {message: undefined, hash: undefined};
759+
// const nextSibling = instance.nextSibling;
760+
// if (nextSibling) {
761+
// const dataset = ((nextSibling: any): HTMLTemplateElement).dataset;
762+
// value.message = dataset.msg;
763+
// value.hash = dataset.hash;
764+
// if (__DEV__) {
765+
// value.stack = dataset.stack;
766+
// }
767+
// }
768+
// return value;
748769
}
749770

750771
export function registerSuspenseInstanceRetry(

packages/react-dom/src/server/ReactDOMServerFormatConfig.js

+26-28
Original file line numberDiff line numberDiff line change
@@ -1527,13 +1527,13 @@ const startClientRenderedSuspenseBoundary = stringToPrecomputedChunk(
15271527
const endSuspenseBoundary = stringToPrecomputedChunk('<!--/$-->');
15281528

15291529
const clientRenderedSuspenseBoundaryError1 = stringToPrecomputedChunk(
1530-
'<template data-hash="',
1530+
'<template data-dgst="',
15311531
);
15321532
const clientRenderedSuspenseBoundaryError1A = stringToPrecomputedChunk(
15331533
'" data-msg="',
15341534
);
15351535
const clientRenderedSuspenseBoundaryError1B = stringToPrecomputedChunk(
1536-
'" data-stack="',
1536+
'" data-stck="',
15371537
);
15381538
const clientRenderedSuspenseBoundaryError2 = stringToPrecomputedChunk(
15391539
'"></template>',
@@ -1576,7 +1576,7 @@ export function writeStartPendingSuspenseBoundary(
15761576
export function writeStartClientRenderedSuspenseBoundary(
15771577
destination: Destination,
15781578
responseState: ResponseState,
1579-
errorHash: ?string,
1579+
errorDigest: ?string,
15801580
errorMesssage: ?string,
15811581
errorComponentStack: ?string,
15821582
): boolean {
@@ -1585,33 +1585,31 @@ export function writeStartClientRenderedSuspenseBoundary(
15851585
destination,
15861586
startClientRenderedSuspenseBoundary,
15871587
);
1588-
if (errorHash) {
1589-
writeChunk(destination, clientRenderedSuspenseBoundaryError1);
1590-
writeChunk(destination, stringToChunk(escapeTextForBrowser(errorHash)));
1591-
// In prod errorMessage will usually be nullish but there is one case where
1592-
// it is used (currently when the server aborts the task) so we leave it ungated.
1588+
writeChunk(destination, clientRenderedSuspenseBoundaryError1);
1589+
writeChunk(
1590+
destination,
1591+
stringToChunk(escapeTextForBrowser(errorDigest || '')),
1592+
);
1593+
if (__DEV__) {
15931594
if (errorMesssage) {
15941595
writeChunk(destination, clientRenderedSuspenseBoundaryError1A);
15951596
writeChunk(
15961597
destination,
15971598
stringToChunk(escapeTextForBrowser(errorMesssage)),
15981599
);
15991600
}
1600-
if (__DEV__) {
1601-
// Component stacks are currently only captured in dev
1602-
if (errorComponentStack) {
1603-
writeChunk(destination, clientRenderedSuspenseBoundaryError1B);
1604-
writeChunk(
1605-
destination,
1606-
stringToChunk(escapeTextForBrowser(errorComponentStack)),
1607-
);
1608-
}
1601+
if (errorComponentStack) {
1602+
writeChunk(destination, clientRenderedSuspenseBoundaryError1B);
1603+
writeChunk(
1604+
destination,
1605+
stringToChunk(escapeTextForBrowser(errorComponentStack)),
1606+
);
16091607
}
1610-
result = writeChunkAndReturn(
1611-
destination,
1612-
clientRenderedSuspenseBoundaryError2,
1613-
);
16141608
}
1609+
result = writeChunkAndReturn(
1610+
destination,
1611+
clientRenderedSuspenseBoundaryError2,
1612+
);
16151613
return result;
16161614
}
16171615
export function writeEndCompletedSuspenseBoundary(
@@ -1772,7 +1770,7 @@ export function writeEndSegment(
17721770
// const SUSPENSE_PENDING_START_DATA = '$?';
17731771
// const SUSPENSE_FALLBACK_START_DATA = '$!';
17741772
//
1775-
// function clientRenderBoundary(suspenseBoundaryID, errorHash, errorMsg, errorComponentStack) {
1773+
// function clientRenderBoundary(suspenseBoundaryID, errorDigest, errorMsg, errorComponentStack) {
17761774
// // Find the fallback's first element.
17771775
// const suspenseIdNode = document.getElementById(suspenseBoundaryID);
17781776
// if (!suspenseIdNode) {
@@ -1786,9 +1784,9 @@ export function writeEndSegment(
17861784
// suspenseNode.data = SUSPENSE_FALLBACK_START_DATA;
17871785
// // assign error metadata to first sibling
17881786
// let dataset = suspenseIdNode.dataset;
1789-
// if (errorHash) dataset.hash = errorHash;
1787+
// if (errorDigest) dataset.dgst = errorDigest;
17901788
// if (errorMsg) dataset.msg = errorMsg;
1791-
// if (errorComponentStack) dataset.stack = errorComponentStack;
1789+
// if (errorComponentStack) dataset.stck = errorComponentStack;
17921790
// // Tell React to retry it if the parent already hydrated.
17931791
// if (suspenseNode._reactRetry) {
17941792
// suspenseNode._reactRetry();
@@ -1876,7 +1874,7 @@ const completeSegmentFunction =
18761874
const completeBoundaryFunction =
18771875
'function $RC(a,b){a=document.getElementById(a);b=document.getElementById(b);b.parentNode.removeChild(b);if(a){a=a.previousSibling;var f=a.parentNode,c=a.nextSibling,e=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d)if(0===e)break;else e--;else"$"!==d&&"$?"!==d&&"$!"!==d||e++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;b.firstChild;)f.insertBefore(b.firstChild,c);a.data="$";a._reactRetry&&a._reactRetry()}}';
18781876
const clientRenderFunction =
1879-
'function $RX(b,c,d,e){var a=document.getElementById(b);a&&(b=a.previousSibling,b.data="$!",a=a.dataset,c&&(a.hash=c),d&&(a.msg=d),e&&(a.stack=e),b._reactRetry&&b._reactRetry())}';
1877+
'function $RX(b,c,d,e){var a=document.getElementById(b);a&&(b=a.previousSibling,b.data="$!",a=a.dataset,c&&(a.dgst=c),d&&(a.msg=d),e&&(a.stck=e),b._reactRetry&&b._reactRetry())}';
18801878

18811879
const completeSegmentScript1Full = stringToPrecomputedChunk(
18821880
completeSegmentFunction + ';$RS("',
@@ -1957,7 +1955,7 @@ export function writeClientRenderBoundaryInstruction(
19571955
destination: Destination,
19581956
responseState: ResponseState,
19591957
boundaryID: SuspenseBoundaryID,
1960-
errorHash: ?string,
1958+
errorDigest: ?string,
19611959
errorMessage?: string,
19621960
errorComponentStack?: string,
19631961
): boolean {
@@ -1979,11 +1977,11 @@ export function writeClientRenderBoundaryInstruction(
19791977

19801978
writeChunk(destination, boundaryID);
19811979
writeChunk(destination, clientRenderScript1A);
1982-
if (errorHash || errorMessage || errorComponentStack) {
1980+
if (errorDigest || errorMessage || errorComponentStack) {
19831981
writeChunk(destination, clientRenderErrorScriptArgInterstitial);
19841982
writeChunk(
19851983
destination,
1986-
stringToChunk(escapeJSStringsForInstructionScripts(errorHash || '')),
1984+
stringToChunk(escapeJSStringsForInstructionScripts(errorDigest || '')),
19871985
);
19881986
}
19891987
if (errorMessage || errorComponentStack) {

packages/react-dom/src/server/ReactDOMServerLegacyFormatConfig.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ export function writeStartClientRenderedSuspenseBoundary(
149149
destination: Destination,
150150
responseState: ResponseState,
151151
// flushing these error arguments are not currently supported in this legacy streaming format.
152-
errorHash: ?string,
152+
errorDigest: ?string,
153153
errorMessage?: string,
154154
errorComponentStack?: string,
155155
): boolean {

packages/react-native-renderer/src/server/ReactNativeServerFormatConfig.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -226,7 +226,7 @@ export function writeStartClientRenderedSuspenseBoundary(
226226
destination: Destination,
227227
responseState: ResponseState,
228228
// TODO: encode error for native
229-
errorHash: ?string,
229+
errorDigest: ?string,
230230
errorMessage: ?string,
231231
errorComponentStack: ?string,
232232
): boolean {
@@ -300,7 +300,7 @@ export function writeClientRenderBoundaryInstruction(
300300
responseState: ResponseState,
301301
boundaryID: SuspenseBoundaryID,
302302
// TODO: encode error for native
303-
errorHash: ?string,
303+
errorDigest: ?string,
304304
errorMessage: ?string,
305305
errorComponentStack: ?string,
306306
): boolean {

packages/react-reconciler/src/ReactCapturedValue.js

+5-5
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export type CapturedValue<T> = {|
1515
value: T,
1616
source: Fiber | null,
1717
stack: string | null,
18-
hash: string | null,
18+
digest: string | null,
1919
|};
2020

2121
export function createCapturedValueAtFiber<T>(
@@ -28,19 +28,19 @@ export function createCapturedValueAtFiber<T>(
2828
value,
2929
source,
3030
stack: getStackByFiberInDevAndProd(source),
31-
hash: null,
31+
digest: null,
3232
};
3333
}
3434

3535
export function createCapturedValue<T>(
3636
value: T,
37-
hash?: string,
38-
stack?: string,
37+
digest: ?string,
38+
stack: ?string,
3939
): CapturedValue<T> {
4040
return {
4141
value,
4242
source: null,
4343
stack: stack != null ? stack : null,
44-
hash: hash != null ? hash : null,
44+
digest: digest != null ? digest : null,
4545
};
4646
}

packages/react-reconciler/src/ReactFiberBeginWork.new.js

+10-4
Original file line numberDiff line numberDiff line change
@@ -2583,9 +2583,15 @@ function updateDehydratedSuspenseComponent(
25832583
// This boundary is in a permanent fallback state. In this case, we'll never
25842584
// get an update and we'll never be able to hydrate the final content. Let's just try the
25852585
// client side render instead.
2586-
const {message, hash, stack} = getSuspenseInstanceFallbackErrorDetails(
2587-
suspenseInstance,
2588-
);
2586+
let digest, message, stack;
2587+
if (__DEV__) {
2588+
({digest, message, stack} = getSuspenseInstanceFallbackErrorDetails(
2589+
suspenseInstance,
2590+
));
2591+
} else {
2592+
({digest} = getSuspenseInstanceFallbackErrorDetails(suspenseInstance));
2593+
}
2594+
25892595
const error = message
25902596
? // eslint-disable-next-line react-internal/prod-error-codes
25912597
new Error(message)
@@ -2594,7 +2600,7 @@ function updateDehydratedSuspenseComponent(
25942600
'due to an error during server rendering. Switched to ' +
25952601
'client rendering.',
25962602
);
2597-
const capturedValue = createCapturedValue(error, hash, stack);
2603+
const capturedValue = createCapturedValue(error, digest, stack);
25982604
return retrySuspenseComponentWithoutHydrating(
25992605
current,
26002606
workInProgress,

packages/react-reconciler/src/ReactFiberBeginWork.old.js

+10-4
Original file line numberDiff line numberDiff line change
@@ -2583,9 +2583,15 @@ function updateDehydratedSuspenseComponent(
25832583
// This boundary is in a permanent fallback state. In this case, we'll never
25842584
// get an update and we'll never be able to hydrate the final content. Let's just try the
25852585
// client side render instead.
2586-
const {message, hash, stack} = getSuspenseInstanceFallbackErrorDetails(
2587-
suspenseInstance,
2588-
);
2586+
let digest, message, stack;
2587+
if (__DEV__) {
2588+
({digest, message, stack} = getSuspenseInstanceFallbackErrorDetails(
2589+
suspenseInstance,
2590+
));
2591+
} else {
2592+
({digest} = getSuspenseInstanceFallbackErrorDetails(suspenseInstance));
2593+
}
2594+
25892595
const error = message
25902596
? // eslint-disable-next-line react-internal/prod-error-codes
25912597
new Error(message)
@@ -2594,7 +2600,7 @@ function updateDehydratedSuspenseComponent(
25942600
'due to an error during server rendering. Switched to ' +
25952601
'client rendering.',
25962602
);
2597-
const capturedValue = createCapturedValue(error, hash, stack);
2603+
const capturedValue = createCapturedValue(error, digest, stack);
25982604
return retrySuspenseComponentWithoutHydrating(
25992605
current,
26002606
workInProgress,

packages/react-reconciler/src/ReactFiberWorkLoop.new.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -2343,8 +2343,8 @@ function commitRootImpl(
23432343
for (let i = 0; i < recoverableErrors.length; i++) {
23442344
const recoverableError = recoverableErrors[i];
23452345
const componentStack = recoverableError.stack;
2346-
const errorHash = recoverableError.hash;
2347-
onRecoverableError(recoverableError.value, {componentStack, errorHash});
2346+
const digest = recoverableError.digest;
2347+
onRecoverableError(recoverableError.value, {componentStack, digest});
23482348
}
23492349
}
23502350

packages/react-reconciler/src/ReactFiberWorkLoop.old.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -2343,8 +2343,8 @@ function commitRootImpl(
23432343
for (let i = 0; i < recoverableErrors.length; i++) {
23442344
const recoverableError = recoverableErrors[i];
23452345
const componentStack = recoverableError.stack;
2346-
const errorHash = recoverableError.hash;
2347-
onRecoverableError(recoverableError.value, {componentStack, errorHash});
2346+
const digest = recoverableError.digest;
2347+
onRecoverableError(recoverableError.value, {componentStack, digest});
23482348
}
23492349
}
23502350

packages/react-reconciler/src/ReactInternalTypes.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -249,7 +249,7 @@ type BaseFiberRootProperties = {|
249249

250250
onRecoverableError: (
251251
error: mixed,
252-
errorInfo: {errorHash?: ?string, componentStack?: ?string},
252+
errorInfo: {errorDigest?: ?string, componentStack?: ?string},
253253
) => void,
254254
|};
255255

0 commit comments

Comments
 (0)