fix(@angular/build): allow missing HTML file request to fallback to index

If a HTTP request is made to the development server that explicitly requests
an HTML file (i.e., `/abc.html`), the development server will now attempt to
fallback to the root `index.html` file if the requested HTML file does not exist.
Since this may indicate a defect or other application misconfiguration such as a
missing asset, a warning will also be issued in the console during development to
notify the developer that something may be wrong.

Author: clydin

packages/angular/build/src/tools/vite/middlewares/html-fallback-middleware.ts

@@ -10,20 +10,42 @@ import type { ServerResponse } from 'node:http';
 import type { Connect } from 'vite';
 import { lookupMimeTypeFromRequest } from '../utils';
 
+const ALLOWED_FALLBACK_METHODS = Object.freeze(['GET', 'HEAD']);
+
 export function angularHtmlFallbackMiddleware(
   req: Connect.IncomingMessage,
   _res: ServerResponse,
   next: Connect.NextFunction,
 ): void {
   // Similar to how it is handled in vite
   // https://github.com/vitejs/vite/blob/main/packages/vite/src/node/server/middlewares/htmlFallback.ts#L15C19-L15C45
+  if (!req.method || !ALLOWED_FALLBACK_METHODS.includes(req.method)) {
+    // No fallback for unsupported request methods
+    next();
+
+    return;
+  }
+
+  if (req.url) {
+    const mimeType = lookupMimeTypeFromRequest(req.url);
+    if (mimeType === 'text/html' || mimeType === 'application/xhtml+xml') {
+      // eslint-disable-next-line no-console
+      console.warn(
+        `Request for HTML file "${req.url}" was received but no asset found. Asset may be missing from build.`,
+      );
+    } else if (mimeType) {
+      // No fallback for request of asset-like files
+      next();
+
+      return;
+    }
+  }
+
   if (
-    (req.method === 'GET' || req.method === 'HEAD') &&
-    (!req.url || !lookupMimeTypeFromRequest(req.url)) &&
-    (!req.headers.accept ||
-      req.headers.accept.includes('text/html') ||
-      req.headers.accept.includes('text/*') ||
-      req.headers.accept.includes('*/*'))
+    !req.headers.accept ||
+    req.headers.accept.includes('text/html') ||
+    req.headers.accept.includes('text/*') ||
+    req.headers.accept.includes('*/*')
   ) {
     req.url = '/index.html';
   }