Skip to content

Commit 7e47248

Browse files
committed
Add msw.js to lint ignore
Signed-off-by: Noorain Panjwani <[email protected]>
1 parent 458c89a commit 7e47248

File tree

3 files changed

+89
-82
lines changed

3 files changed

+89
-82
lines changed

.prettierignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
pnpm-lock.yaml
1+
pnpm-lock.yaml
2+
public/mockServiceWorker.js

eslint.config.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,13 @@ import simpleImportSort from 'eslint-plugin-simple-import-sort';
55
import tseslint from 'typescript-eslint';
66

77
export default tseslint.config({
8-
ignores: ['build/**', 'dist/**', 'node_modules/**', '.react-router/**'],
8+
ignores: [
9+
'build/**',
10+
'dist/**',
11+
'node_modules/**',
12+
'.react-router/**',
13+
'public/mockServiceWorker.js',
14+
],
915
extends: [
1016
eslint.configs.recommended,
1117
...tseslint.configs.recommended,

public/mockServiceWorker.js

+80-80
Original file line numberDiff line numberDiff line change
@@ -8,42 +8,42 @@
88
* - Please do NOT serve this file on production.
99
*/
1010

11-
const PACKAGE_VERSION = '2.7.0';
12-
const INTEGRITY_CHECKSUM = '00729d72e3b82faf54ca8b9621dbb96f';
13-
const IS_MOCKED_RESPONSE = Symbol('isMockedResponse');
14-
const activeClientIds = new Set();
11+
const PACKAGE_VERSION = '2.7.0'
12+
const INTEGRITY_CHECKSUM = '00729d72e3b82faf54ca8b9621dbb96f'
13+
const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
14+
const activeClientIds = new Set()
1515

1616
self.addEventListener('install', function () {
17-
self.skipWaiting();
18-
});
17+
self.skipWaiting()
18+
})
1919

2020
self.addEventListener('activate', function (event) {
21-
event.waitUntil(self.clients.claim());
22-
});
21+
event.waitUntil(self.clients.claim())
22+
})
2323

2424
self.addEventListener('message', async function (event) {
25-
const clientId = event.source.id;
25+
const clientId = event.source.id
2626

2727
if (!clientId || !self.clients) {
28-
return;
28+
return
2929
}
3030

31-
const client = await self.clients.get(clientId);
31+
const client = await self.clients.get(clientId)
3232

3333
if (!client) {
34-
return;
34+
return
3535
}
3636

3737
const allClients = await self.clients.matchAll({
3838
type: 'window',
39-
});
39+
})
4040

4141
switch (event.data) {
4242
case 'KEEPALIVE_REQUEST': {
4343
sendToClient(client, {
4444
type: 'KEEPALIVE_RESPONSE',
45-
});
46-
break;
45+
})
46+
break
4747
}
4848

4949
case 'INTEGRITY_CHECK_REQUEST': {
@@ -53,12 +53,12 @@ self.addEventListener('message', async function (event) {
5353
packageVersion: PACKAGE_VERSION,
5454
checksum: INTEGRITY_CHECKSUM,
5555
},
56-
});
57-
break;
56+
})
57+
break
5858
}
5959

6060
case 'MOCK_ACTIVATE': {
61-
activeClientIds.add(clientId);
61+
activeClientIds.add(clientId)
6262

6363
sendToClient(client, {
6464
type: 'MOCKING_ENABLED',
@@ -68,68 +68,68 @@ self.addEventListener('message', async function (event) {
6868
frameType: client.frameType,
6969
},
7070
},
71-
});
72-
break;
71+
})
72+
break
7373
}
7474

7575
case 'MOCK_DEACTIVATE': {
76-
activeClientIds.delete(clientId);
77-
break;
76+
activeClientIds.delete(clientId)
77+
break
7878
}
7979

8080
case 'CLIENT_CLOSED': {
81-
activeClientIds.delete(clientId);
81+
activeClientIds.delete(clientId)
8282

83-
const remainingClients = allClients.filter(client => {
84-
return client.id !== clientId;
85-
});
83+
const remainingClients = allClients.filter((client) => {
84+
return client.id !== clientId
85+
})
8686

8787
// Unregister itself when there are no more clients
8888
if (remainingClients.length === 0) {
89-
self.registration.unregister();
89+
self.registration.unregister()
9090
}
9191

92-
break;
92+
break
9393
}
9494
}
95-
});
95+
})
9696

9797
self.addEventListener('fetch', function (event) {
98-
const { request } = event;
98+
const { request } = event
9999

100100
// Bypass navigation requests.
101101
if (request.mode === 'navigate') {
102-
return;
102+
return
103103
}
104104

105105
// Opening the DevTools triggers the "only-if-cached" request
106106
// that cannot be handled by the worker. Bypass such requests.
107107
if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
108-
return;
108+
return
109109
}
110110

111111
// Bypass all requests when there are no active clients.
112112
// Prevents the self-unregistered worked from handling requests
113113
// after it's been deleted (still remains active until the next reload).
114114
if (activeClientIds.size === 0) {
115-
return;
115+
return
116116
}
117117

118118
// Generate unique request ID.
119-
const requestId = crypto.randomUUID();
120-
event.respondWith(handleRequest(event, requestId));
121-
});
119+
const requestId = crypto.randomUUID()
120+
event.respondWith(handleRequest(event, requestId))
121+
})
122122

123123
async function handleRequest(event, requestId) {
124-
const client = await resolveMainClient(event);
125-
const response = await getResponse(event, client, requestId);
124+
const client = await resolveMainClient(event)
125+
const response = await getResponse(event, client, requestId)
126126

127127
// Send back the response clone for the "response:*" life-cycle events.
128128
// Ensure MSW is active and ready to handle the message, otherwise
129129
// this message will pend indefinitely.
130130
if (client && activeClientIds.has(client.id)) {
131-
(async function () {
132-
const responseClone = response.clone();
131+
;(async function () {
132+
const responseClone = response.clone()
133133

134134
sendToClient(
135135
client,
@@ -146,91 +146,91 @@ async function handleRequest(event, requestId) {
146146
},
147147
},
148148
[responseClone.body],
149-
);
150-
})();
149+
)
150+
})()
151151
}
152152

153-
return response;
153+
return response
154154
}
155155

156156
// Resolve the main client for the given event.
157157
// Client that issues a request doesn't necessarily equal the client
158158
// that registered the worker. It's with the latter the worker should
159159
// communicate with during the response resolving phase.
160160
async function resolveMainClient(event) {
161-
const client = await self.clients.get(event.clientId);
161+
const client = await self.clients.get(event.clientId)
162162

163163
if (activeClientIds.has(event.clientId)) {
164-
return client;
164+
return client
165165
}
166166

167167
if (client?.frameType === 'top-level') {
168-
return client;
168+
return client
169169
}
170170

171171
const allClients = await self.clients.matchAll({
172172
type: 'window',
173-
});
173+
})
174174

175175
return allClients
176-
.filter(client => {
176+
.filter((client) => {
177177
// Get only those clients that are currently visible.
178-
return client.visibilityState === 'visible';
178+
return client.visibilityState === 'visible'
179179
})
180-
.find(client => {
180+
.find((client) => {
181181
// Find the client ID that's recorded in the
182182
// set of clients that have registered the worker.
183-
return activeClientIds.has(client.id);
184-
});
183+
return activeClientIds.has(client.id)
184+
})
185185
}
186186

187187
async function getResponse(event, client, requestId) {
188-
const { request } = event;
188+
const { request } = event
189189

190190
// Clone the request because it might've been already used
191191
// (i.e. its body has been read and sent to the client).
192-
const requestClone = request.clone();
192+
const requestClone = request.clone()
193193

194194
function passthrough() {
195195
// Cast the request headers to a new Headers instance
196196
// so the headers can be manipulated with.
197-
const headers = new Headers(requestClone.headers);
197+
const headers = new Headers(requestClone.headers)
198198

199199
// Remove the "accept" header value that marked this request as passthrough.
200200
// This prevents request alteration and also keeps it compliant with the
201201
// user-defined CORS policies.
202-
const acceptHeader = headers.get('accept');
202+
const acceptHeader = headers.get('accept')
203203
if (acceptHeader) {
204-
const values = acceptHeader.split(',').map(value => value.trim());
204+
const values = acceptHeader.split(',').map((value) => value.trim())
205205
const filteredValues = values.filter(
206-
value => value !== 'msw/passthrough',
207-
);
206+
(value) => value !== 'msw/passthrough',
207+
)
208208

209209
if (filteredValues.length > 0) {
210-
headers.set('accept', filteredValues.join(', '));
210+
headers.set('accept', filteredValues.join(', '))
211211
} else {
212-
headers.delete('accept');
212+
headers.delete('accept')
213213
}
214214
}
215215

216-
return fetch(requestClone, { headers });
216+
return fetch(requestClone, { headers })
217217
}
218218

219219
// Bypass mocking when the client is not active.
220220
if (!client) {
221-
return passthrough();
221+
return passthrough()
222222
}
223223

224224
// Bypass initial page load requests (i.e. static assets).
225225
// The absence of the immediate/parent client in the map of the active clients
226226
// means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
227227
// and is not ready to handle requests.
228228
if (!activeClientIds.has(client.id)) {
229-
return passthrough();
229+
return passthrough()
230230
}
231231

232232
// Notify the client that a request has been intercepted.
233-
const requestBuffer = await request.arrayBuffer();
233+
const requestBuffer = await request.arrayBuffer()
234234
const clientMessage = await sendToClient(
235235
client,
236236
{
@@ -253,38 +253,38 @@ async function getResponse(event, client, requestId) {
253253
},
254254
},
255255
[requestBuffer],
256-
);
256+
)
257257

258258
switch (clientMessage.type) {
259259
case 'MOCK_RESPONSE': {
260-
return respondWithMock(clientMessage.data);
260+
return respondWithMock(clientMessage.data)
261261
}
262262

263263
case 'PASSTHROUGH': {
264-
return passthrough();
264+
return passthrough()
265265
}
266266
}
267267

268-
return passthrough();
268+
return passthrough()
269269
}
270270

271271
function sendToClient(client, message, transferrables = []) {
272272
return new Promise((resolve, reject) => {
273-
const channel = new MessageChannel();
273+
const channel = new MessageChannel()
274274

275-
channel.port1.onmessage = event => {
275+
channel.port1.onmessage = (event) => {
276276
if (event.data && event.data.error) {
277-
return reject(event.data.error);
277+
return reject(event.data.error)
278278
}
279279

280-
resolve(event.data);
281-
};
280+
resolve(event.data)
281+
}
282282

283283
client.postMessage(
284284
message,
285285
[channel.port2].concat(transferrables.filter(Boolean)),
286-
);
287-
});
286+
)
287+
})
288288
}
289289

290290
async function respondWithMock(response) {
@@ -293,15 +293,15 @@ async function respondWithMock(response) {
293293
// instance will have status code set to 0. Since it's not possible to create
294294
// a Response instance with status code 0, handle that use-case separately.
295295
if (response.status === 0) {
296-
return Response.error();
296+
return Response.error()
297297
}
298298

299-
const mockedResponse = new Response(response.body, response);
299+
const mockedResponse = new Response(response.body, response)
300300

301301
Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
302302
value: true,
303303
enumerable: true,
304-
});
304+
})
305305

306-
return mockedResponse;
306+
return mockedResponse
307307
}

0 commit comments

Comments
 (0)