Skip to content

Commit 4276e90

Browse files
Fix MSW typescript compile errors (#21319)
Refactor mock handlers to use typed request/response models
1 parent c5098f6 commit 4276e90

17 files changed

+117
-102
lines changed

src/Umbraco.Web.UI.Client/e2e/installer.spec.ts

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
const { rest } = window.MockServiceWorker;
1+
const { http, HttpResponse } = window.MockServiceWorker;
22

33
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
44
import {
@@ -12,14 +12,10 @@ test.describe('installer tests', () => {
1212
test.beforeEach(async ({ page, worker }) => {
1313
await worker.use(
1414
// Override the server status to be "must-install"
15-
rest.get(umbracoPath('/server/status'), (_req, res, ctx) => {
16-
return res(
17-
// Respond with a 200 status code
18-
ctx.status(200),
19-
ctx.json<ServerStatusResponseModel>({
20-
serverStatus: RuntimeLevelModel.INSTALL,
21-
}),
22-
);
15+
http.get(umbracoPath('/server/status'), () => {
16+
return HttpResponse.json<ServerStatusResponseModel>({
17+
serverStatus: RuntimeLevelModel.INSTALL,
18+
});
2319
}),
2420
);
2521

@@ -62,18 +58,17 @@ test.describe('installer tests', () => {
6258
test('installer fails', async ({ page, worker }) => {
6359
await worker.use(
6460
// Override the server status to be "must-install"
65-
rest.post(umbracoPath('/install/setup'), (_req, res, ctx) => {
66-
return res(
67-
// Respond with a 200 status code
68-
ctx.status(400),
69-
ctx.json<ProblemDetails>({
61+
http.post(umbracoPath('/install/setup'), () => {
62+
return HttpResponse.json<ProblemDetails>(
63+
{
7064
status: 400,
7165
type: 'validation',
7266
detail: 'Something went wrong',
7367
errors: {
7468
databaseName: ['The database name is required'],
7569
},
76-
}),
70+
},
71+
{ status: 400 },
7772
);
7873
}),
7974
);

src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,20 @@
1-
const { rest } = window.MockServiceWorker;
1+
const { http, HttpResponse } = window.MockServiceWorker;
2+
import { expect, test } from './test.js';
23
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
34
import {
45
type ProblemDetails,
56
RuntimeLevelModel,
67
type ServerStatusResponseModel,
78
} from '@umbraco-cms/backoffice/external/backend-api';
8-
import { expect, test } from './test.js';
99

1010
test.describe('upgrader tests', () => {
1111
test.beforeEach(async ({ page, worker }) => {
1212
await worker.use(
1313
// Override the server status to be "must-install"
14-
rest.get(umbracoPath('/server/status'), (_req, res, ctx) => {
15-
return res(
16-
// Respond with a 200 status code
17-
ctx.status(200),
18-
ctx.json<ServerStatusResponseModel>({
19-
serverStatus: RuntimeLevelModel.UPGRADE,
20-
}),
21-
);
14+
http.get(umbracoPath('/server/status'), () => {
15+
return HttpResponse.json<ServerStatusResponseModel>({
16+
serverStatus: RuntimeLevelModel.UPGRADE,
17+
});
2218
}),
2319
);
2420

@@ -43,15 +39,14 @@ test.describe('upgrader tests', () => {
4339
test('upgrader fails and shows error', async ({ page, worker }) => {
4440
await worker.use(
4541
// Override the server status to be "must-install"
46-
rest.post(umbracoPath('/upgrade/authorize'), (_req, res, ctx) => {
47-
return res(
48-
// Respond with a 200 status code
49-
ctx.status(400),
50-
ctx.json<ProblemDetails>({
42+
http.post(umbracoPath('/upgrade/authorize'), () => {
43+
return HttpResponse.json<ProblemDetails>(
44+
{
5145
status: 400,
5246
type: 'error',
5347
detail: 'Something went wrong',
54-
}),
48+
},
49+
{ status: 400 },
5550
);
5651
}),
5752
);

src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/folder.handlers.ts

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,10 @@ const { http, HttpResponse } = window.MockServiceWorker;
22
import { umbDataTypeMockDb } from '../../data/data-type/data-type.db.js';
33
import { UMB_SLUG } from './slug.js';
44
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
5+
import type { CreateFolderRequestModel, UpdateFolderResponseModel } from '@umbraco-cms/backoffice/external/backend-api';
56

67
export const folderHandlers = [
7-
http.post(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
8+
http.post<object, CreateFolderRequestModel>(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
89
const requestBody = await request.json();
910
if (!requestBody) return new HttpResponse(null, { status: 400, statusText: 'no body found' });
1011

@@ -26,14 +27,17 @@ export const folderHandlers = [
2627
return HttpResponse.json(response);
2728
}),
2829

29-
http.put(umbracoPath(`${UMB_SLUG}/folder/:id`), async ({ request, params }) => {
30-
const id = params.id as string;
31-
if (!id) return new HttpResponse(null, { status: 400, statusText: 'no id found' });
32-
const requestBody = await request.json();
33-
if (!requestBody) return new HttpResponse(null, { status: 400, statusText: 'no body found' });
34-
umbDataTypeMockDb.folder.update(id, requestBody);
35-
return new HttpResponse(null, { status: 200 });
36-
}),
30+
http.put<{ id: string }, UpdateFolderResponseModel>(
31+
umbracoPath(`${UMB_SLUG}/folder/:id`),
32+
async ({ request, params }) => {
33+
const id = params.id;
34+
if (!id) return new HttpResponse(null, { status: 400, statusText: 'no id found' });
35+
const requestBody = await request.json();
36+
if (!requestBody) return new HttpResponse(null, { status: 400, statusText: 'no body found' });
37+
umbDataTypeMockDb.folder.update(id, requestBody);
38+
return new HttpResponse(null, { status: 200 });
39+
},
40+
),
3741

3842
http.delete(umbracoPath(`${UMB_SLUG}/folder/:id`), ({ params }) => {
3943
const id = params.id as string;

src/Umbraco.Web.UI.Client/src/mocks/handlers/document-type/folder.handlers.ts

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,10 @@ const { http, HttpResponse } = window.MockServiceWorker;
22
import { umbDocumentTypeMockDb } from '../../data/document-type/document-type.db.js';
33
import { UMB_SLUG } from './slug.js';
44
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
5+
import type { CreateFolderRequestModel, UpdateFolderResponseModel } from '@umbraco-cms/backoffice/external/backend-api';
56

67
export const folderHandlers = [
7-
http.post(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
8+
http.post<object, CreateFolderRequestModel>(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
89
const requestBody = await request.json();
910
if (!requestBody) return new HttpResponse(null, { status: 400 });
1011

@@ -26,14 +27,17 @@ export const folderHandlers = [
2627
return HttpResponse.json(response);
2728
}),
2829

29-
http.put(umbracoPath(`${UMB_SLUG}/folder/:id`), async ({ request, params }) => {
30-
const id = params.id as string;
31-
if (!id) return new HttpResponse(null, { status: 400 });
32-
const requestBody = await request.json();
33-
if (!requestBody) return new HttpResponse(null, { status: 400 });
34-
umbDocumentTypeMockDb.folder.update(id, requestBody);
35-
return new HttpResponse(null, { status: 200 });
36-
}),
30+
http.put<{ id: string }, UpdateFolderResponseModel>(
31+
umbracoPath(`${UMB_SLUG}/folder/:id`),
32+
async ({ request, params }) => {
33+
const id = params.id;
34+
if (!id) return new HttpResponse(null, { status: 400 });
35+
const requestBody = await request.json();
36+
if (!requestBody) return new HttpResponse(null, { status: 400 });
37+
umbDocumentTypeMockDb.folder.update(id, requestBody);
38+
return new HttpResponse(null, { status: 200 });
39+
},
40+
),
3741

3842
http.delete(umbracoPath(`${UMB_SLUG}/folder/:id`), ({ params }) => {
3943
const id = params.id as string;

src/Umbraco.Web.UI.Client/src/mocks/handlers/dynamic-root.handlers.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import { umbDocumentMockDb } from '../data/document/document.db.js';
2-
import type { DynamicRootRequestModel } from '@umbraco-cms/backoffice/external/backend-api';
32
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
43

54
const { http, HttpResponse } = window.MockServiceWorker;
65

76
export const handlers = [
8-
http.post<DynamicRootRequestModel>(umbracoPath('/dynamic-root/query'), async () => {
7+
http.post(umbracoPath('/dynamic-root/query'), async () => {
98
const response = umbDocumentMockDb.tree
109
.getRoot()
1110
.items.map((item) => item.id)

src/Umbraco.Web.UI.Client/src/mocks/handlers/health-check.handlers.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,8 @@ export const handlers = [
4848
}
4949
}),
5050

51-
http.post<HealthCheckActionRequestModel>(umbracoPath('/health-check/execute-action'), async ({ request }) => {
52-
const body = await request.json<HealthCheckActionRequestModel>();
51+
http.post<object, HealthCheckActionRequestModel>(umbracoPath('/health-check/execute-action'), async ({ request }) => {
52+
const body = await request.json();
5353
const healthCheckId = body.healthCheck.id;
5454
// Find the health check based on the healthCheckId from the healthGroups[].checks
5555
const healthCheck = healthGroups.flatMap((group) => group.checks).find((check) => check?.id === healthCheckId);

src/Umbraco.Web.UI.Client/src/mocks/handlers/install.handlers.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -77,8 +77,8 @@ export const handlers = [
7777
});
7878
}),
7979

80-
http.post(umbracoPath('/install/validate-database'), async ({ request }) => {
81-
const body = await request.json<DatabaseInstallRequestModel>();
80+
http.post<object, DatabaseInstallRequestModel>(umbracoPath('/install/validate-database'), async ({ request }) => {
81+
const body = await request.json();
8282

8383
if (body.name === 'validate') {
8484
return HttpResponse.json<ProblemDetails>(
@@ -94,8 +94,8 @@ export const handlers = [
9494
return new HttpResponse(null, { status: 201 });
9595
}),
9696

97-
http.post(umbracoPath('/install/setup'), async ({ request }) => {
98-
const body = await request.json<InstallRequestModel>();
97+
http.post<object, InstallRequestModel>(umbracoPath('/install/setup'), async ({ request }) => {
98+
const body = await request.json();
9999

100100
if (body.database?.name === 'fail') {
101101
// Note: ctx.delay() is not directly supported in v2, needs to be implemented differently if delay is needed

src/Umbraco.Web.UI.Client/src/mocks/handlers/media-type/folder.handlers.ts

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,10 @@ const { http, HttpResponse } = window.MockServiceWorker;
22
import { umbMediaTypeMockDb } from '../../data/media-type/media-type.db.js';
33
import { UMB_SLUG } from './slug.js';
44
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
5+
import type { CreateFolderRequestModel, UpdateFolderResponseModel } from '@umbraco-cms/backoffice/external/backend-api';
56

67
export const folderHandlers = [
7-
http.post(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
8+
http.post<object, CreateFolderRequestModel>(umbracoPath(`${UMB_SLUG}/folder`), async ({ request }) => {
89
const requestBody = await request.json();
910
if (!requestBody) return new HttpResponse(null, { status: 400 });
1011

@@ -26,14 +27,17 @@ export const folderHandlers = [
2627
return HttpResponse.json(response);
2728
}),
2829

29-
http.put(umbracoPath(`${UMB_SLUG}/folder/:id`), async ({ request, params }) => {
30-
const id = params.id as string;
31-
if (!id) return new HttpResponse(null, { status: 400 });
32-
const requestBody = await request.json();
33-
if (!requestBody) return new HttpResponse(null, { status: 400 });
34-
umbMediaTypeMockDb.folder.update(id, requestBody);
35-
return new HttpResponse(null, { status: 200 });
36-
}),
30+
http.put<{ id: string }, UpdateFolderResponseModel>(
31+
umbracoPath(`${UMB_SLUG}/folder/:id`),
32+
async ({ request, params }) => {
33+
const id = params.id;
34+
if (!id) return new HttpResponse(null, { status: 400 });
35+
const requestBody = await request.json();
36+
if (!requestBody) return new HttpResponse(null, { status: 400 });
37+
umbMediaTypeMockDb.folder.update(id, requestBody);
38+
return new HttpResponse(null, { status: 200 });
39+
},
40+
),
3741

3842
http.delete(umbracoPath(`${UMB_SLUG}/folder/:id`), ({ params }) => {
3943
const id = params.id as string;

src/Umbraco.Web.UI.Client/src/mocks/handlers/package.handlers.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -51,9 +51,9 @@ export const handlers = [
5151
});
5252
}),
5353

54-
http.post(umbracoPath('/package/created'), async ({ request }) => {
54+
http.post<object, CreatePackageRequestModel>(umbracoPath('/package/created'), async ({ request }) => {
5555
//save
56-
const data: CreatePackageRequestModel = await request.json();
56+
const data = await request.json();
5757
const newPackage: PackageDefinitionResponseModel = { ...data, id: UmbId.new(), packagePath: '' };
5858
packageArray.push(newPackage);
5959
return HttpResponse.json<PackageDefinitionResponseModel>(newPackage);
@@ -68,9 +68,9 @@ export const handlers = [
6868
return HttpResponse.json<PackageDefinitionResponseModel>(found);
6969
}),
7070

71-
http.put(umbracoPath('/package/created/:id'), async ({ request }) => {
71+
http.put<object, PackageDefinitionResponseModel>(umbracoPath('/package/created/:id'), async ({ request }) => {
7272
//update
73-
const data: PackageDefinitionResponseModel = await request.json();
73+
const data = await request.json();
7474
if (!data.id) return;
7575
const index = packageArray.findIndex((x) => x.id === data.id);
7676
packageArray[index] = data;

src/Umbraco.Web.UI.Client/src/mocks/handlers/telemetry.handlers.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,9 @@ export const handlers = [
2424
});
2525
}),
2626

27-
http.post<TelemetryResponseModel>(umbracoPath('/telemetry/level'), async ({ request }) => {
28-
const newLevel = (await request.json<TelemetryResponseModel>()).telemetryLevel;
27+
http.post<object, TelemetryResponseModel>(umbracoPath('/telemetry/level'), async ({ request }) => {
28+
const body = await request.json();
29+
const newLevel = body?.telemetryLevel;
2930
if (newLevel) {
3031
telemetryLevel = newLevel;
3132
return new HttpResponse(null, { status: 200 });

0 commit comments

Comments
 (0)