Is it now possible to use DIO / dio_web_adapter with Web/WASM?

[OsvaldoTCF]

Request Statement

$ flutter build web --wasm

I get this error:

.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:5:8: Error: Dart library 'dart:html' is not available on this platform. import 'dart:html'; ^ Context: The unavailable library 'dart:html' is imported through these packages:

main.dart => package:dio => package:dio_web_adapter => dart:html

Solution Brainstorm

No response

[AlexV525]

It does. We're pushing it to convert to the package:web and the code base has already been migrated. Once the package:dio_web_adapter releases v2 you'll be able to use Dio on WASM env.

[vaind]

This error started popping up with the latest Dio release and broke our build/tests in getsentry/sentry-dart.

AFAICT, adding the dependency on package web_adapter was a breaking change and should have been a major release (Dio 6.0), not a minor one (Dio 5.5)

[AlexV525]

This error started popping up with the latest Dio release and broke our build/tests in getsentry/sentry-dart.

Can you elaborate on the details? Please submit an issue at getsentry/sentry-dart and ping me so we can track specific problems. This thread should focus on WASM support.

AFAICT, adding the dependency on package web_adapter was a breaking change and should have been a major release (Dio 6.0), not a minor one (Dio 5.5)

Nope. We intended to make this not a breaking change and the package is still embedded with the package:dio, no implementation has been changed. People who upgrade to Dio v5.5 will automatically use the package:web_adapter.

[vaind]

This is breaking for people who were alerady building for WASM, because package:web_adapter is incompatible with it while Dio at v5.4 worked fine

[vaind]

This is the test failure in CI after automatic update to Dio 5.5 (because we don't pin a lower version). Before the release of Dio 5.5, the CI worked fine and there were no relevant code changes

Run dart test -p chrome --compiler dart2wasm --test-randomize-ordering-seed=random --chain-stack-traces
Shuffling test order with --test-randomize-ordering-seed=2877333308

❌ [Chrome, Dart2Wasm] loading test/dio_stacktrace_extractor_test.dart (failed)
  *NOTE*: Compilation to WasmGC is experimental.
  The support may change, or be removed, with no advance notice.

  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:5:8: Error: Dart library 'dart:html' is not available on this platform.
  import 'dart:html';
         ^
  Context: The unavailable library 'dart:html' is imported through these packages:

      /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio => package:dio_web_adapter => dart:html
      /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:sentry_dio => package:dio => package:dio_web_adapter => dart:html

  Detailed import paths for (some of) the these imports:

      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio/dio_for_browser.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio/dio_for_browser.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/interceptors/imply_content_type.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/interceptors/imply_content_type.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/progress_stream/browser_progress_stream.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/progress_stream/browser_progress_stream.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/response/response_stream_handler.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/response/response_stream_handler.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/adapter.dart => package:dio/src/adapters/browser_adapter.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/dio_impl.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      main.dart => /home/runner/work/sentry-dart/sentry-dart/dio/test/dio_stacktrace_extractor_test.dart => package:dio/dio.dart => package:dio/src/dio_mixin.dart => package:dio/src/interceptors/imply_content_type.dart => package:dio/src/form_data.dart => package:dio/src/multipart_file.dart => package:dio/src/multipart_file/browser_multipart_file.dart => package:dio_web_adapter/dio_web_adapter.dart => package:dio_web_adapter/src/html/adapter.dart => dart:html
      ...

  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:20:17: Error: 'HttpRequest' isn't a type.
    final xhrs = <HttpRequest>{};
                  ^^^^^^^^^^^
  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:183:8: Error: 'ProgressEvent' isn't a type.
        (ProgressEvent event) {
         ^^^^^^^^^^^^^
  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:37:17: Error: The method 'HttpRequest' isn't defined for the class 'BrowserHttpClientAdapter'.
   - 'BrowserHttpClientAdapter' is from 'package:dio_web_adapter/src/html/adapter.dart' ('../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart').
  Try correcting the name to the name of an existing method, or defining a method named 'HttpRequest'.
      final xhr = HttpRequest();
                  ^^^^^^^^^^^
  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:239:28: Error: The getter 'HttpRequest' isn't defined for the class 'BrowserHttpClientAdapter'.
   - 'BrowserHttpClientAdapter' is from 'package:dio_web_adapter/src/html/adapter.dart' ('../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart').
  Try correcting the name to the name of an existing getter, or defining a getter or field named 'HttpRequest'.
        if (xhr.readyState < HttpRequest.DONE &&
                             ^^^^^^^^^^^
  ../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart:240:28: Error: The getter 'HttpRequest' isn't defined for the class 'BrowserHttpClientAdapter'.
   - 'BrowserHttpClientAdapter' is from 'package:dio_web_adapter/src/html/adapter.dart' ('../../../../.pub-cache/hosted/pub.dev/dio_web_adapter-1.0.1/lib/src/html/adapter.dart').
  Try correcting the name to the name of an existing getter, or defining a getter or field named 'HttpRequest'.
            xhr.readyState > HttpRequest.UNSENT) {
                             ^^^^^^^^^^^

  Failed to load "test/dio_stacktrace_extractor_test.dart": Bad state: dart2wasm failed.
  package:test_core/src/runner/wasm_compiler_pool.dart 74:26      WasmCompilerPool.compileInternal.<fn>
  ===== asynchronous gap ===========================
  package:test_core/src/util/io.dart 120:23                       withTempDir.<fn>.<fn>
  ===== asynchronous gap ===========================
  package:pool/pool.dart 127:14                                   Pool.withResource
  ===== asynchronous gap ===========================
  package:test/src/runner/browser/compilers/dart2wasm.dart 136:7  Dart2WasmSupport.compileSuite.<fn>
  ===== asynchronous gap ===========================
  package:test/src/runner/browser/platform.dart 178:5             BrowserPlatform.load
  ===== asynchronous gap ===========================
  package:test_core/src/runner/loader.dart 219:27                 Loader.loadFile.<fn>
  ===== asynchronous gap ===========================
  package:test_core/src/runner/load_suite.dart 97:19              new LoadSuite.<fn>.<fn>

[AlexV525]

Please submit an issue at getsentry/sentry-dart and ping me so we can track specific problems. This thread should focus on WASM support.

@vaind

[vaind]

This is not an issue in sentry-dart. Your package added a dependency on a noncompatible package. I'll create a new issue.

[Rexios80]

@vaind What are you talking about? They created dio_web_adapter because dio currently does not support WASM.

../../.pub-cache/hosted/pub.dev/dio-5.4.3+1/lib/src/adapters/browser_adapter.dart:3:8: Error: Dart library 'dart:html' is not available on this platform.
import 'dart:html';

[Rexios80]

@AlexV525 while we're here, how do you plan on dealing with the possibility of needing to update dio_web_adapter v1 after releasing v2? I'm pretty sure pub won't let you release versions below 2.0.0 after you release it.

[AlexV525]

I'm pretty sure pub won't let you release versions below 2.0.0 after you release it.

AFAICT it does allow. But maybe it's been changed.

[Rexios80]

Holy crap it totally does. I did not expect that.

[vaind]

why wouldn't it? it's another major version - it's pretty normal to have releases on multiple major versions

[vaind]

@vaind What are you talking about? They created dio_web_adapter because dio currently does not support WASM.

../../.pub-cache/hosted/pub.dev/dio-5.4.3+1/lib/src/adapters/browser_adapter.dart:3:8: Error: Dart library 'dart:html' is not available on this platform.
import 'dart:html';

Depends on what you're using from Dio. See #2266

[kuhnroyal]

Judging by your sample, with no specific adapter configuration, it seems that the default IO adapter is used for the WASM compile. Which does not really make sense to me, why would that work? I mean I can see that it compiles but....

[AlexV525]

Judging by your sample, with no specific adapter configuration, it seems that the default IO adapter is used for the WASM compile. Which does not really make sense to me, why would that work? I mean I can see that it compiles but....

I guess that the WASM env is compatible with the compilation of dart:io but no actual business can be involved.

[Rexios80]

That might be a bug in the WASM compiler

[vaind]

That might be a bug in the WASM compiler

The compiled code works fine: the request is executed successfully.

[kuhnroyal]

So from what I read, dart:io seems to be a supported package for WASM. Just can not target any browser API then. Not sure how a file download etc. will behave at runtime in a browser.