Migrate from dart:html to package:web (#15)

* Migrate to package:web & dart:js_interop

* Update pubspec.yaml

* Update web interops

* Refactor WebSocketClient$JS to simplify data handling

* chore: update meta dependency to version 1.9.1

* chore: Migrate to package:web and dart:js_interop

* chore: Add health checks to server startup

---------

Co-authored-by: Plague Fox <[email protected]>

Author: sabin26

.vscode/launch.json

@@ -37,7 +37,6 @@
         "ENVIRONMENT": "test"
       },
       "console": "debugConsole",
-      "runTestsOnDevice": false,
       "templateFor": "test",
       "toolArgs": [
         "--color",
@@ -47,8 +46,9 @@
         "--platform=chrome",
         "--file-reporter=json:.coverage/tests.json",
         "--timeout=30s",
-        "--concurrency=12"
-        /* "--name=can send binary data" */
+        "--concurrency=12",
+        "--chain-stack-traces"
+        /* "--name=can send List<int> data" */
       ],
       "args": []
     },
@@ -66,7 +66,11 @@
       "runTestsOnDevice": false,
       "templateFor": "test",
       "toolArgs": [],
-      "args": ["--port=8080", "--isolates=2", "--verbose=4"]
+      "args": [
+        "--port=8080",
+        "--isolates=2",
+        "--verbose=4"
+      ]
     }
   ]
-}
+}

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 1.1.0-dev.1
+
+- Migration from 'dart:html' to 'package:web'
+
 ## 1.0.0
 
 - Stable release

analysis_options.yaml

@@ -64,7 +64,6 @@ linter:
     avoid_js_rounded_ints: true
     avoid_print: true
     avoid_renaming_method_parameters: true
-    avoid_returning_null_for_future: true
     avoid_returning_null_for_void: true
     avoid_single_cascade_in_expression_statements: true
     avoid_slow_async_io: true
@@ -128,7 +127,6 @@ linter:
 
     # Pedantic 1.9.0
     always_declare_return_types: true
-    always_require_non_null_named_parameters: true
     annotate_overrides: true
     avoid_empty_else: true
     avoid_init_to_null: true
@@ -193,7 +191,6 @@ linter:
     prefer_mixin: true
     use_setters_to_change_properties: true
     avoid_setters_without_getters: true
-    avoid_returning_null: true
     avoid_returning_this: true
     type_annotate_public_apis: true
     avoid_types_on_closure_parameters: true

lib/src/client/ws_client_js.dart

@@ -2,10 +2,12 @@
 // coverage:ignore-file
 import 'dart:async';
 import 'dart:convert';
-import 'dart:html' as html show WebSocket, Blob, Event, CloseEvent, FileReader;
+import 'dart:js_interop' as js;
 import 'dart:typed_data';
 
 import 'package:meta/meta.dart';
+import 'package:web/web.dart' as web
+    show Blob, CloseEvent, Event, WebSocket, WebSocketEvents;
 import 'package:ws/src/client/web_socket_ready_state.dart';
 import 'package:ws/src/client/websocket_exception.dart';
 import 'package:ws/src/client/ws_client_base.dart';
@@ -47,7 +49,7 @@ final class WebSocketClient$JS extends WebSocketClientBase {
   final $WebSocketOptions$JS? _options;
 
   /// Native WebSocket client.
-  html.WebSocket? _client;
+  web.WebSocket? _client;
 
   /// Blob codec for `Blob <-> List<int>` conversion.
   late final _BlobCodec _blobCodec = _BlobCodec();
@@ -57,10 +59,10 @@ final class WebSocketClient$JS extends WebSocketClientBase {
   StreamSubscription<Object?>? _dataBindSubscription;
 
   /// Binding to error from native WebSocket client.
-  StreamSubscription<html.Event>? _errorBindSubscription;
+  StreamSubscription<web.Event>? _errorBindSubscription;
 
   /// Binding to close event from native WebSocket client.
-  StreamSubscription<html.CloseEvent>? _closeBindSubscription;
+  StreamSubscription<web.CloseEvent>? _closeBindSubscription;
 
   /// Ready state of the WebSocket client.
   @override
@@ -75,31 +77,33 @@ final class WebSocketClient$JS extends WebSocketClientBase {
   @override
   void push(Object data) {
     final client = _client;
-    if (client == null || client.readyState != html.WebSocket.OPEN) {
+    if (client == null || client.readyState != web.WebSocket.OPEN) {
       throw const WSClientClosedException(
           message: 'WebSocket client is not connected.');
     }
     try {
-      switch (data) {
-        case String text:
-          client.sendString(text);
-        case html.Blob blob:
-          client.sendBlob(blob);
-        default:
-          if (_options?.useBlobForBinary == true) {
-            client.sendBlob(_blobCodec.write(data));
-          } else {
-            switch (data) {
-              case TypedData td:
-                client.sendTypedData(td);
-              case ByteBuffer bb:
-                client.sendByteBuffer(bb);
-              case List<int> bytes:
-                client.sendTypedData(Uint8List.fromList(bytes));
-              default:
-                throw ArgumentError.value(data, 'data', 'Invalid data type.');
-            }
-          }
+      if (data is String) {
+        client.send(data.toJS);
+        return;
+      } else if (_options?.useBlobForBinary == true) {
+        client.send(_blobCodec.write(data));
+      } else {
+        switch (data) {
+          case TypedData td:
+            client.send(Uint8List.view(
+              td.buffer,
+              td.offsetInBytes,
+              td.lengthInBytes,
+            ).toJS);
+          case ByteBuffer bb:
+            client.send(bb.toJS);
+          case List<int> bytes:
+            client.send(Uint8List.fromList(bytes).toJS);
+          case web.Blob blob:
+            client.send(web.Blob([blob].toJS));
+          default:
+            throw ArgumentError.value(data, 'data', 'Invalid data type.');
+        }
       }
     } on Object catch (error, stackTrace) {
       warning(error, stackTrace, 'WebSocketClient\$JS.add: $error');
@@ -113,7 +117,10 @@ final class WebSocketClient$JS extends WebSocketClientBase {
     try {
       if (_client != null) await disconnect(1001, 'RECONNECTING');
       super.connect(url);
-      final client = _client = html.WebSocket(url, protocols);
+      final client = _client = web.WebSocket(
+        url,
+        protocols?.map((e) => e.toJS).toList().toJS ?? <js.JSString>[].toJS,
+      );
       final completer = Completer<void>();
       client.onOpen.first.whenComplete(() {
         if (completer.isCompleted) return;
@@ -135,7 +142,7 @@ final class WebSocketClient$JS extends WebSocketClientBase {
           .map<Object?>((event) => event.data)
           .asyncMap<Object?>((data) => switch (data) {
                 String text => text,
-                html.Blob blob => _blobCodec.read(blob),
+                web.Blob blob => _blobCodec.read(blob),
                 TypedData td => Uint8List.view(
                     td.buffer,
                     td.offsetInBytes,
@@ -187,7 +194,11 @@ final class WebSocketClient$JS extends WebSocketClientBase {
     _dataBindSubscription = null;
     if (client != null) {
       try {
-        client.close(code, reason);
+        if (code != null && reason != null) {
+          client.close(code, reason);
+        } else {
+          client.close();
+        }
       } on Object {/* ignore */} // coverage:ignore-line
       _client = null;
     }
@@ -206,61 +217,33 @@ final class _BlobCodec {
   _BlobCodec();
 
   @internal
-  html.Blob write(Object data) {
+  web.Blob write(Object data) {
     switch (data) {
       case String text:
-        return html.Blob([Uint8List.fromList(utf8.encode(text))]);
+        return web.Blob([Uint8List.fromList(utf8.encode(text)).toJS].toJS);
       case TypedData td:
-        return html.Blob([
+        return web.Blob([
           Uint8List.view(
             td.buffer,
             td.offsetInBytes,
             td.lengthInBytes,
-          )
-        ]);
+          ).toJS
+        ].toJS);
       case ByteBuffer bb:
-        return html.Blob([bb.asUint8List()]);
+        return web.Blob([bb.asUint8List().toJS].toJS);
       case List<int> bytes:
-        return html.Blob([Uint8List.fromList(bytes)]);
+        return web.Blob([Uint8List.fromList(bytes).toJS].toJS);
+      case web.Blob blob:
+        return web.Blob([blob].toJS);
       default:
         throw ArgumentError.value(data, 'data', 'Invalid data type.');
     }
   }
 
   @internal
-  FutureOr<Object> read(html.Blob blob) async {
-    final completer = Completer<Object>();
-
-    void complete(Object data) {
-      if (completer.isCompleted) return;
-      completer.complete(data);
-    }
-
-    void completeError(Object error, [StackTrace? stackTrace]) {
-      if (completer.isCompleted) return;
-      completer.completeError(error, stackTrace);
-    }
-
-    late final html.FileReader reader;
-    reader = html.FileReader()
-      ..onLoadEnd.listen((_) {
-        final result = reader.result;
-        switch (result) {
-          case String text:
-            complete(text);
-            break;
-          case Uint8List bytes:
-            complete(bytes);
-            break;
-          case ByteBuffer bb:
-            complete(bb.asUint8List());
-            break;
-          default:
-            completeError('Unexpected result type: ${result.runtimeType}');
-        }
-      })
-      ..onError.listen(completeError)
-      ..readAsArrayBuffer(blob);
-    return completer.future;
+  Future<Object> read(web.Blob blob) async {
+    final arrayBuffer = await blob.arrayBuffer().toDart;
+    final bytes = arrayBuffer.toDart.asUint8List();
+    return bytes;
   }
 }

pubspec.yaml

@@ -3,7 +3,7 @@ name: ws
 description: >
   WS: A compact, highly efficient WebSocket library. Easily establish, manage, and reconnect WebSocket connections in real-time apps.
 
-version: 1.0.0
+version: 1.1.0-dev.1
 
 homepage: https://github.com/plugfox/ws
 
@@ -39,8 +39,9 @@ environment:
   sdk: '>=3.1.0 <4.0.0'
 
 dependencies:
+  web: ^0.5.1
   meta: ^1.9.1
 
 dev_dependencies:
-  lints: ^3.0.0
-  test: ^1.24.2
+  lints: ^4.0.0
+  test: ^1.25.7

server/lib/src/util/run_server.dart

@@ -86,7 +86,6 @@ Future<void> runServer<Config>({
           (message) => ports.forEach((port) => port.send(message)),
           cancelOnError: false,
         ); */
-        // TODO(plugfox): Health checks
         l.s(
           'Started ${parsedArguments.isolates} server(s) '
           'at http://${parsedArguments.address.address}:${parsedArguments.port} '

test/client/client_test.dart

@@ -336,6 +336,7 @@ void main() {
       client.add(binaryData);
       final received =
           await client.stream.first.timeout(const Duration(seconds: 5));
+      if (received is String) throw Exception('Received is String');
       expect(
           received,
           isA<List<int>>()
@@ -443,6 +444,7 @@ void main() {
         client.add(binaryData);
         final received =
             await client.stream.first.timeout(const Duration(seconds: 5));
+        if (received is String) throw Exception('Received is String');
         expect(
             received,
             isA<List<int>>()