Processing all development asset requests leads to extreme test slowdowns #13
Description
In our repository, we use vite for development assets. Because the base modules are being loaded and processed lazily rather than bundled ahead of time, this means some development pages have hundreds to thousands of asset requests. In one example, we experienced ~3x test slowdown from the overhead of looking for a matching request handler hundreds to thousands of times. Locally, we addressed this with a yarn patch to include an early return if isCommonAssetRequest is true, but we are curious if there might be a smarter option.
We also had another issue related to the handler instanceof filter not working for us (mentioned on a related issue here), and we addressed that in our patch as well.
The entirety of our patch looks like this:
diff --git a/build/index.js b/build/index.js
index da5c816f2cf3ccc21bb18ef4069ec61a8f31cade..188b3208cc4ff201ad56fd713ab3d9f4f5e52468 100644
--- a/build/index.js
+++ b/build/index.js
@@ -1,5 +1,5 @@
import { invariant } from "outvariant";
-import { RequestHandler, SetupApi, WebSocketHandler, getResponse } from "msw";
+import { RequestHandler, SetupApi, WebSocketHandler, getResponse, isCommonAssetRequest } from "msw";
import { CancelableCloseEvent, CancelableMessageEvent } from "@mswjs/interceptors/WebSocket";
//#region src/index.ts
@@ -46,8 +46,14 @@ var NetworkFixture = class extends SetupApi {
headers: new Headers(await request.allHeaders()),
body: request.postDataBuffer()
});
+
+ if (isCommonAssetRequest(fetchRequest)) {
+ route.continue();
+ return;
+ }
+
const response = await getResponse(this.handlersController.currentHandlers().filter((handler) => {
- return handler instanceof RequestHandler;
+ return handler.__kind === 'RequestHandler';
}), fetchRequest, { baseUrl: this.getPageUrl() });
if (response) {
if (response.status === 0) {
@@ -65,7 +71,7 @@ var NetworkFixture = class extends SetupApi {
});
await this.#page.routeWebSocket(/.+/, async (ws) => {
const allWebSocketHandlers = this.handlersController.currentHandlers().filter((handler) => {
- return handler instanceof WebSocketHandler;
+ return handler.__kind === 'EventHandler';
});
if (allWebSocketHandlers.length === 0) {
ws.connectToServer();