refactor(@angular/build): allow browser client to log console message…

… with dev-server

The development server now supports a WebSocket event named `angular:log`.
This event allows the browser client to send log messages back to the development
server. Currently this is unused by the client and Angular runtime. But
is intended to be used in the future for such cases as propagating error messages
back to the development server console. This event is considered internal and
should not be relied upon by external code.

(cherry picked from commit e3aa483)

packages/angular/build/src/builders/dev-server/vite-server.ts

@@ -439,6 +439,24 @@ export async function* serveWithVite(
       server = await createServer(serverConfiguration);
       await server.listen();
 
+      // Setup builder context logging for browser clients
+      server.hot.on('angular:log', (data: { text: string; kind?: string }) => {
+        if (typeof data?.text !== 'string') {
+          context.logger.warn('Development server client sent invalid internal log event.');
+        }
+        switch (data.kind) {
+          case 'error':
+            context.logger.error(`[CLIENT ERROR]: ${data.text}`);
+            break;
+          case 'warning':
+            context.logger.warn(`[CLIENT WARNING]: ${data.text}`);
+            break;
+          default:
+            context.logger.info(`[CLIENT INFO]: ${data.text}`);
+            break;
+        }
+      });
+
       const urls = server.resolvedUrls;
       if (urls && (urls.local.length || urls.network.length)) {
         serverUrl = new URL(urls.local[0] ?? urls.network[0]);