Skip to content

Commit 115f087

Browse files
committed
Add unstable_pattern to client onError
1 parent 19ca284 commit 115f087

File tree

5 files changed

+42
-10
lines changed

5 files changed

+42
-10
lines changed

packages/react-router/__tests__/dom/client-on-error-test.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ describe(`handleError`, () => {
5151
expect(spy).toHaveBeenCalledWith(new Error("lazy error!"), {
5252
location: expect.objectContaining({ pathname: "/" }),
5353
params: {},
54+
unstable_pattern: "/",
5455
});
5556
expect(spy).toHaveBeenCalledTimes(1);
5657
expect(getHtml(container)).toContain("Unexpected Application Error!");
@@ -81,6 +82,7 @@ describe(`handleError`, () => {
8182
expect(spy).toHaveBeenCalledWith(new Error("middleware error!"), {
8283
location: expect.objectContaining({ pathname: "/" }),
8384
params: {},
85+
unstable_pattern: "/",
8486
});
8587
expect(spy).toHaveBeenCalledTimes(1);
8688
});
@@ -109,6 +111,7 @@ describe(`handleError`, () => {
109111
expect(spy).toHaveBeenCalledWith(new Error("loader error!"), {
110112
location: expect.objectContaining({ pathname: "/" }),
111113
params: {},
114+
unstable_pattern: "/",
112115
});
113116
expect(spy).toHaveBeenCalledTimes(1);
114117
});
@@ -139,6 +142,7 @@ describe(`handleError`, () => {
139142
expect(spy).toHaveBeenCalledWith(new Error("lazy error!"), {
140143
location: expect.objectContaining({ pathname: "/page" }),
141144
params: {},
145+
unstable_pattern: "/page",
142146
});
143147
expect(spy).toHaveBeenCalledTimes(1);
144148
let html = getHtml(container);
@@ -174,6 +178,7 @@ describe(`handleError`, () => {
174178
expect(spy).toHaveBeenCalledWith(new Error("middleware error!"), {
175179
location: expect.objectContaining({ pathname: "/page" }),
176180
params: {},
181+
unstable_pattern: "/page",
177182
});
178183
expect(spy).toHaveBeenCalledTimes(1);
179184
expect(getHtml(container)).toContain("Error");
@@ -205,6 +210,7 @@ describe(`handleError`, () => {
205210
expect(spy).toHaveBeenCalledWith(new Error("loader error!"), {
206211
location: expect.objectContaining({ pathname: "/page" }),
207212
params: {},
213+
unstable_pattern: "/page",
208214
});
209215
expect(spy).toHaveBeenCalledTimes(1);
210216
expect(getHtml(container)).toContain("Error");
@@ -241,6 +247,7 @@ describe(`handleError`, () => {
241247
expect(spy).toHaveBeenCalledWith(new Error("action error!"), {
242248
location: expect.objectContaining({ pathname: "/page" }),
243249
params: {},
250+
unstable_pattern: "/page",
244251
});
245252
expect(spy).toHaveBeenCalledTimes(1);
246253
expect(getHtml(container)).toContain("Error");
@@ -270,6 +277,7 @@ describe(`handleError`, () => {
270277
expect(spy).toHaveBeenCalledWith(new Error("loader error!"), {
271278
location: expect.objectContaining({ pathname: "/" }),
272279
params: {},
280+
unstable_pattern: "/",
273281
});
274282
expect(spy).toHaveBeenCalledTimes(1);
275283
expect(getHtml(container)).toContain("Error");
@@ -304,6 +312,7 @@ describe(`handleError`, () => {
304312
expect(spy).toHaveBeenCalledWith(new Error("action error!"), {
305313
location: expect.objectContaining({ pathname: "/" }),
306314
params: {},
315+
unstable_pattern: "/",
307316
});
308317
expect(spy).toHaveBeenCalledTimes(1);
309318
expect(getHtml(container)).toContain("Error");
@@ -334,6 +343,7 @@ describe(`handleError`, () => {
334343
expect(spy).toHaveBeenCalledWith(new Error("render error!"), {
335344
location: expect.objectContaining({ pathname: "/page" }),
336345
params: {},
346+
unstable_pattern: "/page",
337347
errorInfo: expect.objectContaining({
338348
componentStack: expect.any(String),
339349
}),
@@ -379,6 +389,7 @@ describe(`handleError`, () => {
379389
expect(spy).toHaveBeenCalledWith(new Error("await error!"), {
380390
location: expect.objectContaining({ pathname: "/page" }),
381391
params: {},
392+
unstable_pattern: "/page",
382393
});
383394
expect(spy).toHaveBeenCalledTimes(1);
384395
expect(getHtml(container)).toContain("Await Error");
@@ -427,6 +438,7 @@ describe(`handleError`, () => {
427438
expect(spy).toHaveBeenCalledWith(new Error("await error!"), {
428439
location: expect.objectContaining({ pathname: "/page" }),
429440
params: {},
441+
unstable_pattern: "/page",
430442
errorInfo: expect.objectContaining({
431443
componentStack: expect.any(String),
432444
}),
@@ -481,10 +493,12 @@ describe(`handleError`, () => {
481493
expect(spy).toHaveBeenCalledWith(new Error("await error!"), {
482494
location: expect.objectContaining({ pathname: "/page" }),
483495
params: {},
496+
unstable_pattern: "/page",
484497
});
485498
expect(spy).toHaveBeenCalledWith(new Error("errorElement error!"), {
486499
location: expect.objectContaining({ pathname: "/page" }),
487500
params: {},
501+
unstable_pattern: "/page",
488502
errorInfo: expect.objectContaining({
489503
componentStack: expect.any(String),
490504
}),
@@ -534,6 +548,7 @@ describe(`handleError`, () => {
534548
expect(spy).toHaveBeenCalledWith(new Error("loader error!"), {
535549
location: expect.objectContaining({ pathname: "/page" }),
536550
params: {},
551+
unstable_pattern: "/page",
537552
});
538553
expect(spy).toHaveBeenCalledTimes(1);
539554
expect(getHtml(container)).toContain("Error");
@@ -584,6 +599,7 @@ describe(`handleError`, () => {
584599
expect(spy).toHaveBeenCalledWith(new Error("render error!"), {
585600
location: expect.objectContaining({ pathname: "/page" }),
586601
params: {},
602+
unstable_pattern: "/page",
587603
errorInfo: expect.objectContaining({
588604
componentStack: expect.any(String),
589605
}),

packages/react-router/lib/components.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,12 @@ import type {
2929
Params,
3030
TrackedPromise,
3131
} from "./router/utils";
32-
import { getResolveToMatches, resolveTo, stripBasename } from "./router/utils";
32+
import {
33+
getResolveToMatches,
34+
getRoutePattern,
35+
resolveTo,
36+
stripBasename,
37+
} from "./router/utils";
3338

3439
import type {
3540
DataRouteObject,
@@ -313,6 +318,7 @@ export interface unstable_ClientOnErrorFunction {
313318
info: {
314319
location: Location;
315320
params: Params;
321+
unstable_pattern: string;
316322
errorInfo?: React.ErrorInfo;
317323
},
318324
): void;
@@ -554,6 +560,7 @@ export function RouterProvider({
554560
unstable_onError(error, {
555561
location: newState.location,
556562
params: newState.matches[0]?.params ?? {},
563+
unstable_pattern: getRoutePattern(newState.matches),
557564
}),
558565
);
559566
}
@@ -1610,7 +1617,8 @@ export function Await<Resolve>({
16101617
) {
16111618
dataRouterContext.unstable_onError(error, {
16121619
location: dataRouterStateContext.location,
1613-
params: dataRouterStateContext.matches?.[0]?.params || {},
1620+
params: dataRouterStateContext.matches[0]?.params || {},
1621+
unstable_pattern: getRoutePattern(dataRouterStateContext.matches),
16141622
errorInfo,
16151623
});
16161624
}

packages/react-router/lib/hooks.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ import {
4343
convertRouteMatchToUiMatch,
4444
decodePath,
4545
getResolveToMatches,
46+
getRoutePattern,
4647
isRouteErrorResponse,
4748
joinPaths,
4849
matchPath,
@@ -1194,6 +1195,7 @@ export function _renderMatches(
11941195
unstable_onError(error, {
11951196
location: dataRouterState.location,
11961197
params: dataRouterState.matches?.[0]?.params ?? {},
1198+
unstable_pattern: getRoutePattern(dataRouterState.matches),
11971199
errorInfo,
11981200
});
11991201
}

packages/react-router/lib/router/router.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3768,7 +3768,7 @@ export function createStaticHandler(
37683768
let response = await runServerMiddlewarePipeline(
37693769
{
37703770
request,
3771-
unstable_pattern: getRoutePattern(matches.map((m) => m.route.path)),
3771+
unstable_pattern: getRoutePattern(matches),
37723772
matches,
37733773
params: matches[0].params,
37743774
// If we're calling middleware then it must be enabled so we can cast
@@ -4000,7 +4000,7 @@ export function createStaticHandler(
40004000
let response = await runServerMiddlewarePipeline(
40014001
{
40024002
request,
4003-
unstable_pattern: getRoutePattern(matches.map((m) => m.route.path)),
4003+
unstable_pattern: getRoutePattern(matches),
40044004
matches,
40054005
params: matches[0].params,
40064006
// If we're calling middleware then it must be enabled so we can cast
@@ -4393,7 +4393,7 @@ export function createStaticHandler(
43934393
matches.findIndex((m) => m.route.id === pendingActionResult[0]) - 1
43944394
: undefined;
43954395

4396-
let pattern = getRoutePattern(matches.map((m) => m.route.path));
4396+
let pattern = getRoutePattern(matches);
43974397
dsMatches = matches.map((match, index) => {
43984398
if (maxIdx != null && index > maxIdx) {
43994399
return getDataStrategyMatch(
@@ -4867,7 +4867,7 @@ function getMatchesToLoad(
48674867
actionStatus,
48684868
};
48694869

4870-
let pattern = getRoutePattern(matches.map((m) => m.route.path));
4870+
let pattern = getRoutePattern(matches);
48714871
let dsMatches: DataStrategyMatch[] = matches.map((match, index) => {
48724872
let { route } = match;
48734873

@@ -5934,7 +5934,7 @@ function getTargetedDataStrategyMatches(
59345934
mapRouteProperties,
59355935
manifest,
59365936
request,
5937-
getRoutePattern(matches.map((m) => m.route.path)),
5937+
getRoutePattern(matches),
59385938
match,
59395939
lazyRoutePropertiesToSkip,
59405940
scopedContext,
@@ -5962,7 +5962,7 @@ async function callDataStrategyImpl(
59625962
// back out below.
59635963
let dataStrategyArgs = {
59645964
request,
5965-
unstable_pattern: getRoutePattern(matches.map((m) => m.route.path)),
5965+
unstable_pattern: getRoutePattern(matches),
59665966
params: matches[0].params,
59675967
context: scopedContext,
59685968
matches,

packages/react-router/lib/router/utils.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2049,6 +2049,12 @@ by the star-slash in the `getRoutePattern` regex and messes up the parsed commen
20492049
for `isRouteErrorResponse` above. This comment seems to reset the parser.
20502050
*/
20512051

2052-
export function getRoutePattern(paths: (string | undefined)[]) {
2053-
return paths.filter(Boolean).join("/").replace(/\/\/*/g, "/") || "/";
2052+
export function getRoutePattern(matches: AgnosticRouteMatch[]) {
2053+
return (
2054+
matches
2055+
.map((m) => m.route.path)
2056+
.filter(Boolean)
2057+
.join("/")
2058+
.replace(/\/\/*/g, "/") || "/"
2059+
);
20542060
}

0 commit comments

Comments
 (0)