implemented socket-based dwds

Author: jyameo

dwds/CHANGELOG.md

@@ -1,3 +1,10 @@
+## 24.3.12-wip
+
+- Removed DWDS requirement for Chrome Debug Port by implementing a WebSocket-based communication protocol that provides essential developer tooling (hot reload, service extensions) when Chrome debugger access is unavailable. - [#2605](https://github.com/dart-lang/webdev/issues/2605)
+- Added WebSocket-based hot reload and service extension support via new `WebSocketProxyService` class that implements VM service protocol over WebSockets.
+- Created new files: `WebSocketProxyService`, `WebSocketDebugService`, `WebSocketAppDebugServices`, and `WebSocketDwdsVmClient` to support socket-based DWDS functionality.
+- Enhanced `DevHandler` with `useWebSocketConnection` flag to toggle between Chrome-based and WebSocket-based communication protocols.
+
 ## 24.3.11
 
 - Changed DWDS to always inject the client and added `useDwdsWebSocketConnection` flag to control communication protocol: when true uses socket-based implementation, when false uses Chrome-based communication protocol.

dwds/lib/dart_web_debug_service.dart

@@ -31,13 +31,15 @@ class Dwds {
   final DevHandler _devHandler;
   final AssetReader _assetReader;
   final bool _enableDebugging;
+  final bool _useDwdsWebSocketConnection;
 
   Dwds._(
     this.middleware,
     this._devTools,
     this._devHandler,
     this._assetReader,
     this._enableDebugging,
+    this._useDwdsWebSocketConnection,
   ) : handler = _devHandler.handler;
 
   Stream<AppConnection> get connectedApps => _devHandler.connectedApps;
@@ -53,14 +55,57 @@ class Dwds {
     await _assetReader.close();
   }
 
+  /// Creates a debug connection for the given app connection.
+  ///
+  /// Returns a [DebugConnection] that wraps the appropriate debug services
+  /// based on the connection type (WebSocket or Chrome-based).
   Future<DebugConnection> debugConnection(AppConnection appConnection) async {
     if (!_enableDebugging) throw StateError('Debugging is not enabled.');
+
     final appDebugServices = await _devHandler.loadAppServices(appConnection);
-    final chromeProxyService = appDebugServices.chromeProxyService;
-    await chromeProxyService.isInitialized;
+
+    // Initialize the appropriate proxy service based on connection type
+    if (_useDwdsWebSocketConnection) {
+      await _initializeWebSocketService(appDebugServices);
+    } else {
+      await _initializeChromeService(appDebugServices);
+    }
+
     return DebugConnection(appDebugServices);
   }
 
+  /// Initializes and waits for WebSocket proxy service to be ready.
+  Future<void> _initializeWebSocketService(dynamic appDebugServices) async {
+    try {
+      final webSocketProxyService = appDebugServices.webSocketProxyService;
+      if (webSocketProxyService != null) {
+        await webSocketProxyService.isInitialized;
+        _logger.fine('WebSocket proxy service initialized successfully');
+      } else {
+        _logger.warning('WebSocket proxy service is null');
+      }
+    } catch (e) {
+      _logger.severe('Failed to initialize WebSocket proxy service: $e');
+      rethrow;
+    }
+  }
+
+  /// Initializes and waits for Chrome proxy service to be ready.
+  Future<void> _initializeChromeService(dynamic appDebugServices) async {
+    try {
+      final chromeProxyService = appDebugServices.chromeProxyService;
+      if (chromeProxyService != null) {
+        await chromeProxyService.isInitialized;
+        _logger.fine('Chrome proxy service initialized successfully');
+      } else {
+        _logger.warning('Chrome proxy service is null');
+      }
+    } catch (e) {
+      _logger.severe('Failed to initialize Chrome proxy service: $e');
+      rethrow;
+    }
+  }
+
   static Future<Dwds> start({
     required AssetReader assetReader,
     required Stream<BuildResult> buildResults,
@@ -123,10 +168,7 @@ class Dwds {
       _logger.info('Serving DevTools at $uri\n');
     }
 
-    final injected = DwdsInjector(
-      extensionUri: extensionUri,
-      useDwdsWebSocketConnection: useDwdsWebSocketConnection,
-    );
+    final injected = DwdsInjector(extensionUri: extensionUri);
 
     final devHandler = DevHandler(
       chromeConnection,
@@ -143,6 +185,7 @@ class Dwds {
       debugSettings.spawnDds,
       debugSettings.ddsPort,
       debugSettings.launchDevToolsInNewWindow,
+      useWebSocketConnection: useDwdsWebSocketConnection,
     );
 
     return Dwds._(
@@ -151,6 +194,7 @@ class Dwds {
       devHandler,
       assetReader,
       debugSettings.enableDebugging,
+      useDwdsWebSocketConnection,
     );
   }
 }

dwds/lib/data/serializers.dart

@@ -14,6 +14,8 @@ import 'error_response.dart';
 import 'extension_request.dart';
 import 'hot_reload_request.dart';
 import 'hot_reload_response.dart';
+import 'service_extension_request.dart';
+import 'service_extension_response.dart';
 import 'isolate_events.dart';
 import 'register_event.dart';
 import 'run_request.dart';
@@ -40,5 +42,7 @@ part 'serializers.g.dart';
   ErrorResponse,
   RegisterEvent,
   RunRequest,
+  ServiceExtensionRequest,
+  ServiceExtensionResponse,
 ])
 final Serializers serializers = _$serializers;

dwds/lib/data/serializers.g.dart

@@ -0,0 +1,43 @@
+// Copyright (c) 2025, the Dart project authors. All rights reserved.
+// Defines the request for service extension calls over WebSocket.
+
+import 'dart:convert';
+import 'package:built_value/built_value.dart';
+import 'package:built_value/serializer.dart';
+
+part 'service_extension_request.g.dart';
+
+abstract class ServiceExtensionRequest
+    implements Built<ServiceExtensionRequest, ServiceExtensionRequestBuilder> {
+  String get id;
+  String get method;
+  String
+  get argsJson; // Store args as JSON string for built_value compatibility
+
+  // Helper method to get args as Map<String, dynamic>
+  Map<String, dynamic> get args =>
+      argsJson.isEmpty
+          ? <String, dynamic>{}
+          : json.decode(argsJson) as Map<String, dynamic>;
+
+  ServiceExtensionRequest._();
+  factory ServiceExtensionRequest([
+    void Function(ServiceExtensionRequestBuilder) updates,
+  ]) = _$ServiceExtensionRequest;
+
+  // Convenient factory method to create with args Map
+  factory ServiceExtensionRequest.fromArgs({
+    required String id,
+    required String method,
+    required Map<String, dynamic> args,
+  }) => ServiceExtensionRequest(
+    (b) =>
+        b
+          ..id = id
+          ..method = method
+          ..argsJson = json.encode(args),
+  );
+
+  static Serializer<ServiceExtensionRequest> get serializer =>
+      _$serviceExtensionRequestSerializer;
+}