From 733c287e3e6a630a829e33e437964eead4143ca9 Mon Sep 17 00:00:00 2001
From: "khanh.nguyen.quoc" <khanh.nguyen.quoc@airstage-vn.asia>
Date: Fri, 10 Oct 2025 11:49:40 +0700
Subject: [PATCH 1/4] migrate to wasm compatibility

---
 example/pubspec.lock                          |  62 ++--
 .../model_viewer/model_viewer_plus_web.dart   | 350 ++++++++++++------
 .../app/model_viewer/o3d_model_viewer.dart    |   7 +-
 .../implementation/o3d_web_impl.dart          |  13 +-
 pubspec.yaml                                  |   4 +-
 5 files changed, 284 insertions(+), 152 deletions(-)

diff --git a/example/pubspec.lock b/example/pubspec.lock
index 2d286fd..a67bffb 100644
--- a/example/pubspec.lock
+++ b/example/pubspec.lock
@@ -29,26 +29,26 @@ packages:
     dependency: transitive
     description:
       name: characters
-      sha256: "04a925763edad70e8443c99234dc3328f442e811f1d8fd1a72f1c8ad0f69a605"
+      sha256: f71061c654a3380576a52b451dd5532377954cf9dbd272a78fc8479606670803
       url: "https://pub.dev"
     source: hosted
-    version: "1.3.0"
+    version: "1.4.0"
   clock:
     dependency: transitive
     description:
       name: clock
-      sha256: cb6d7f03e1de671e34607e909a7213e31d7752be4fb66a86d29fe1eb14bfb5cf
+      sha256: fddb70d9b5277016c77a80201021d40a2247104d9f4aa7bab7157b7e3f05b84b
       url: "https://pub.dev"
     source: hosted
-    version: "1.1.1"
+    version: "1.1.2"
   collection:
     dependency: transitive
     description:
       name: collection
-      sha256: ee67cb0715911d28db6bf4af1026078bd6f0128b07a5f66fb2ed94ec6783c09a
+      sha256: "2f5709ae4d3d59dd8f7cd309b4e023046b57d8a6c82130785d2b0e5868084e76"
       url: "https://pub.dev"
     source: hosted
-    version: "1.18.0"
+    version: "1.19.1"
   cupertino_icons:
     dependency: "direct main"
     description:
@@ -61,10 +61,10 @@ packages:
     dependency: transitive
     description:
       name: fake_async
-      sha256: "511392330127add0b769b75a987850d136345d9227c6b94c96a04cf4a391bf78"
+      sha256: "5368f224a74523e8d2e7399ea1638b37aecfca824a3cc4dfdf77bf1fa905ac44"
       url: "https://pub.dev"
     source: hosted
-    version: "1.3.1"
+    version: "1.3.3"
   flutter:
     dependency: "direct main"
     description: flutter
@@ -92,26 +92,26 @@ packages:
     dependency: transitive
     description:
       name: leak_tracker
-      sha256: "3f87a60e8c63aecc975dda1ceedbc8f24de75f09e4856ea27daf8958f2f0ce05"
+      sha256: "33e2e26bdd85a0112ec15400c8cbffea70d0f9c3407491f672a2fad47915e2de"
       url: "https://pub.dev"
     source: hosted
-    version: "10.0.5"
+    version: "11.0.2"
   leak_tracker_flutter_testing:
     dependency: transitive
     description:
       name: leak_tracker_flutter_testing
-      sha256: "932549fb305594d82d7183ecd9fa93463e9914e1b67cacc34bc40906594a1806"
+      sha256: "1dbc140bb5a23c75ea9c4811222756104fbcd1a27173f0c34ca01e16bea473c1"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.5"
+    version: "3.0.10"
   leak_tracker_testing:
     dependency: transitive
     description:
       name: leak_tracker_testing
-      sha256: "6ba465d5d76e67ddf503e1161d1f4a6bc42306f9d66ca1e8f079a47290fb06d3"
+      sha256: "8d5a2d49f4a66b49744b23b018848400d23e54caf9463f4eb20df3eb8acb2eb1"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.1"
+    version: "3.0.2"
   lints:
     dependency: transitive
     description:
@@ -124,10 +124,10 @@ packages:
     dependency: transitive
     description:
       name: matcher
-      sha256: d2323aa2060500f906aa31a895b4030b6da3ebdcc5619d14ce1aada65cd161cb
+      sha256: dc58c723c3c24bf8d3e2d3ad3f2f9d7bd9cf43ec6feaa64181775e60190153f2
       url: "https://pub.dev"
     source: hosted
-    version: "0.12.16+1"
+    version: "0.12.17"
   material_color_utilities:
     dependency: transitive
     description:
@@ -140,25 +140,25 @@ packages:
     dependency: transitive
     description:
       name: meta
-      sha256: bdb68674043280c3428e9ec998512fb681678676b3c54e773629ffe74419f8c7
+      sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c
       url: "https://pub.dev"
     source: hosted
-    version: "1.15.0"
+    version: "1.16.0"
   o3d:
     dependency: "direct main"
     description:
       path: ".."
       relative: true
     source: path
-    version: "3.1.2"
+    version: "3.1.3"
   path:
     dependency: transitive
     description:
       name: path
-      sha256: "087ce49c3f0dc39180befefc60fdb4acd8f8620e5682fe2476afd0b3688bb4af"
+      sha256: "75cca69d1490965be98c73ceaea117e8a04dd21217b37b292c9ddbec0d955bc5"
       url: "https://pub.dev"
     source: hosted
-    version: "1.9.0"
+    version: "1.9.1"
   platform:
     dependency: transitive
     description:
@@ -179,7 +179,7 @@ packages:
     dependency: transitive
     description: flutter
     source: sdk
-    version: "0.0.99"
+    version: "0.0.0"
   source_span:
     dependency: transitive
     description:
@@ -192,18 +192,18 @@ packages:
     dependency: transitive
     description:
       name: stack_trace
-      sha256: "73713990125a6d93122541237550ee3352a2d84baad52d375a4cad2eb9b7ce0b"
+      sha256: "8b27215b45d22309b5cddda1aa2b19bdfec9df0e765f2de506401c071d38d1b1"
       url: "https://pub.dev"
     source: hosted
-    version: "1.11.1"
+    version: "1.12.1"
   stream_channel:
     dependency: transitive
     description:
       name: stream_channel
-      sha256: ba2aa5d8cc609d96bbb2899c28934f9e1af5cddbd60a827822ea467161eb54e7
+      sha256: "969e04c80b8bcdf826f8f16579c7b14d780458bd97f56d107d3950fdbeef059d"
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.2"
+    version: "2.1.4"
   string_scanner:
     dependency: transitive
     description:
@@ -224,10 +224,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: "5b8a98dafc4d5c4c9c72d8b31ab2b23fc13422348d2997120294d3bac86b4ddb"
+      sha256: "522f00f556e73044315fa4585ec3270f1808a4b186c936e612cab0b565ff1e00"
       url: "https://pub.dev"
     source: hosted
-    version: "0.7.2"
+    version: "0.7.6"
   url_launcher:
     dependency: "direct main"
     description:
@@ -296,10 +296,10 @@ packages:
     dependency: transitive
     description:
       name: vector_math
-      sha256: "80b3257d1492ce4d091729e3a67a60407d227c27241d6927be0130c98e741803"
+      sha256: d530bd74fea330e6e364cda7a85019c434070188383e1cd8d9777ee586914c5b
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.4"
+    version: "2.2.0"
   vm_service:
     dependency: transitive
     description:
@@ -349,5 +349,5 @@ packages:
     source: hosted
     version: "3.16.3"
 sdks:
-  dart: ">=3.5.0 <4.0.0"
+  dart: ">=3.8.0-0 <4.0.0"
   flutter: ">=3.24.0"
diff --git a/lib/src/app/model_viewer/model_viewer_plus_web.dart b/lib/src/app/model_viewer/model_viewer_plus_web.dart
index 1d9124f..1b70d58 100644
--- a/lib/src/app/model_viewer/model_viewer_plus_web.dart
+++ b/lib/src/app/model_viewer/model_viewer_plus_web.dart
@@ -1,14 +1,43 @@
 import 'dart:async';
+import 'dart:js_interop';
+import 'dart:js_interop_unsafe';
+import 'dart:ui_web' as ui_web;
 
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart' show rootBundle;
+import 'package:web/web.dart' as web;
 
 import 'html_builder.dart';
-import '../fake/dart_html_fake.dart' if (dart.library.html) 'dart:html';
-import '../fake/dart_ui_fake.dart' if (dart.library.html) 'dart:ui_web'
-    as ui_web;
 import 'o3d_model_viewer.dart';
 
+// JS interop for DOMPurify
+@JS('DOMPurify')
+external _DomPurify? get _domPurify;
+
+@JS()
+extension type _DomPurify(JSObject _) implements JSObject {
+  external JSString sanitize(JSAny dirty, [_DomPurifyConfig? config]);
+}
+
+@JS()
+@anonymous
+extension type _DomPurifyConfig._(JSObject _) implements JSObject {
+  external factory _DomPurifyConfig({
+    JSArray<JSString>? ALLOWED_TAGS,
+    JSArray<JSString>? ALLOWED_ATTR,
+    JSArray<JSString>? ADD_TAGS,
+    JSArray<JSString>? ADD_ATTR,
+    JSBoolean? ALLOW_DATA_ATTR,
+    JSBoolean? ALLOW_ARIA_ATTR,
+    JSBoolean? KEEP_CONTENT,
+    JSBoolean? SAFE_FOR_TEMPLATES,
+    JSBoolean? WHOLE_DOCUMENT,
+    JSString? RETURN_DOM,
+    JSString? RETURN_DOM_FRAGMENT,
+    JSBoolean? FORCE_BODY,
+  });
+}
+
 class ModelViewerState extends State<O3DModelViewer> {
   bool _isLoading = true;
 
@@ -18,27 +47,61 @@ class ModelViewerState extends State<O3DModelViewer> {
     unawaited(generateModelViewerHtml());
   }
 
-  /// To generate the HTML code for using the model viewer.
   Future<void> generateModelViewerHtml() async {
     final htmlTemplate =
         await rootBundle.loadString('packages/o3d/assets/template.html');
 
-    // allow to use elements
-    final NodeValidator validator =
-        widget.overwriteNodeValidatorBuilder ?? defaultNodeValidatorBuilder;
-
     final html = _buildHTML(htmlTemplate);
 
+    // Ensure DOMPurify is loaded (CDN). You can switch to a local asset if preferred.
+    await _ensureDomPurifyLoaded();
+
+    // Sanitize HTML using DOMPurify or a minimal whitelist fallback
+    final sanitized = await _sanitizeHtml(html);
+
     ui_web.platformViewRegistry.registerViewFactory(
       'babakcode-model-viewer-html-${widget.id}',
-      (viewId) => HtmlHtmlElement()
-        // ignore: avoid_dynamic_calls
-        ..style.border = 'none'
-        // ignore: avoid_dynamic_calls
-        ..style.height = '100%'
-        // ignore: avoid_dynamic_calls
-        ..style.width = '100%'
-        ..setInnerHtml(html, validator: validator),
+      (viewId) {
+        final el = web.document.createElement('div') as web.HTMLDivElement;
+        el.style.border = 'none';
+        el.style.height = '100%';
+        el.style.width = '100%';
+        el.style.margin = '0';
+        el.style.padding = '0';
+        el.style.overflow = 'hidden';
+
+        // Set sanitized HTML
+        el.innerHTML = sanitized.toJS;
+
+        // Ensure model-viewer has correct styling
+        final modelViewer = el.querySelector('model-viewer');
+        if (modelViewer != null) {
+          final mv = modelViewer as web.HTMLElement;
+          mv.style.width = '100%';
+          mv.style.height = '100%';
+          mv.style.display = 'block';
+          mv.style.margin = '0';
+          mv.style.padding = '0';
+        }
+
+        // If custom JS/CSS is needed, inject programmatically (DOMPurify strips <script>):
+        if (widget.relatedCss != null && widget.relatedCss!.isNotEmpty) {
+          final styleEl =
+              web.document.createElement('style') as web.HTMLStyleElement;
+          styleEl.textContent = widget.relatedCss!;
+          el.appendChild(styleEl);
+        }
+        if (widget.relatedJs != null && widget.relatedJs!.isNotEmpty) {
+          final s =
+              web.document.createElement('script') as web.HTMLScriptElement;
+          // Optional: set type='module' or keep default
+          // s.type = 'module';
+          s.text = widget.relatedJs!;
+          el.appendChild(s);
+        }
+
+        return el;
+      },
     );
 
     setState(() {
@@ -46,8 +109,110 @@ class ModelViewerState extends State<O3DModelViewer> {
     });
   }
 
+  // Load DOMPurify if it's not already available
+  Future<void> _ensureDomPurifyLoaded() async {
+    if (_hasDomPurify()) return;
+
+    final c = Completer<void>();
+    final script =
+        web.document.createElement('script') as web.HTMLScriptElement;
+    script.src =
+        'https://cdnjs.cloudflare.com/ajax/libs/dompurify/3.2.7/purify.min.js';
+    script.defer = true;
+    // Add integrity for security
+    script.integrity =
+        'sha512-5NsJWIT0jacsCoHLyxBMHRJx8MHDMPpw0D4mK5FAqq3YRJJLDq3CQYz3MKEJo45hVzvFvPdPZJTSyVxfJxfsEw==';
+    script.crossOrigin = 'anonymous';
+
+    script.addEventListener(
+      'load',
+      ((web.Event _) {
+        if (!c.isCompleted) c.complete();
+      }).toJS,
+    );
+    script.addEventListener(
+      'error',
+      ((web.Event _) {
+        if (!c.isCompleted) {
+          c.completeError(StateError('Failed to load DOMPurify'));
+        }
+      }).toJS,
+    );
+    (web.document.head ?? web.document.body ?? web.document.documentElement!)
+        .appendChild(script);
+    await c.future.catchError((_) {
+      // Ignore load error, use fallback sanitizer
+    });
+  }
+
+  bool _hasDomPurify() {
+    try {
+      // Check global DOMPurify
+      return web.window.hasProperty('DOMPurify'.toJS).toDart;
+    } catch (_) {
+      return false;
+    }
+  }
+
+  Future<String> _sanitizeHtml(String dirty) async {
+    // If DOMPurify is available, use proper configuration
+    if (_hasDomPurify() && _domPurify != null) {
+      try {
+        final cfg = _DomPurifyConfig(
+          // Use ALLOWED_TAGS instead of ADD_TAGS for better security
+          ALLOWED_TAGS: _allowedTags.map((e) => e.toJS).toList().toJS,
+          ALLOWED_ATTR: _allowedAttrs.map((e) => e.toJS).toList().toJS,
+          ALLOW_DATA_ATTR: true.toJS, // allow data-*
+          ALLOW_ARIA_ATTR: true.toJS, // allow aria-*
+          KEEP_CONTENT: true.toJS, // keep text content when tags are removed
+          SAFE_FOR_TEMPLATES: true.toJS, // prevent mXSS via template tag
+          FORCE_BODY: false.toJS, // don't force into <body> context
+        );
+
+        final sanitizedJS = _domPurify!.sanitize(dirty.toJS, cfg);
+        return sanitizedJS.toDart;
+      } catch (e) {
+        debugPrint('DOMPurify sanitize error: $e');
+        return _simpleWhitelistSanitize(dirty);
+      }
+    }
+
+    // Minimal whitelist fallback: remove <script> and on* attributes
+    return _simpleWhitelistSanitize(dirty);
+  }
+
+  // Minimal whitelist sanitizer that doesn't depend on external libraries
+  String _simpleWhitelistSanitize(String input) {
+    // DON'T remove <style> tags - they're needed for layout
+    // Instead, only remove <script> tags
+    var result = input.replaceAll(
+        RegExp(r"<\s*script\b[^>]*>([\s\S]*?)<\s*/\s*script\s*>",
+            caseSensitive: false),
+        '');
+
+    // Remove on* event handlers (onclick, onload, onerror, etc.)
+    result = result.replaceAll(
+        RegExp(r'''\son[a-z]+\s*=\s*(".*?"|\'.*?\'|[^\s>]+)''',
+            caseSensitive: false),
+        '');
+
+    // Block javascript: protocol in href/src
+    result = result.replaceAll(
+        RegExp(r'''((href|src)\s*=\s*["\']?)\s*javascript:''',
+            caseSensitive: false),
+        r'$1about:blank#blocked');
+
+    // Block data: URIs except for images
+    result = result.replaceAll(
+        RegExp(r'''((?!<img[^>]*)\s+(?:href|src)\s*=\s*["\']?)\s*data:''',
+            caseSensitive: false),
+        r'$1about:blank#blocked');
+
+    return result;
+  }
+
   @override
-  Widget build(final BuildContext context) {
+  Widget build(BuildContext context) {
     return _isLoading
         ? const Center(
             child: CircularProgressIndicator(
@@ -82,8 +247,6 @@ class ModelViewerState extends State<O3DModelViewer> {
       // AR Attributes
       ar: widget.ar,
       arModes: widget.arModes,
-      // arScale: widget.arScale,
-      // arPlacement: widget.arPlacement,
       iosSrc: widget.iosSrc,
       xrEnvironment: widget.xrEnvironment,
       // Staing & Cameras Attributes
@@ -123,12 +286,10 @@ class ModelViewerState extends State<O3DModelViewer> {
       scale: widget.scale,
       // CSS Styles
       backgroundColor: widget.backgroundColor,
-      // Default progress bar color
       progressBarColor: widget.progressBarColor,
       // Annotations CSS
       minHotspotOpacity: widget.minHotspotOpacity,
       maxHotspotOpacity: widget.maxHotspotOpacity,
-
       // Others
       innerModelViewerHtml: widget.innerModelViewerHtml,
       relatedCss: widget.relatedCss,
@@ -139,94 +300,61 @@ class ModelViewerState extends State<O3DModelViewer> {
   }
 }
 
-NodeValidatorBuilder defaultNodeValidatorBuilder = NodeValidatorBuilder.common()
-  ..allowElement(
-    'meta',
-    attributes: ['name', 'content'],
-    uriPolicy: AllowAllUri(),
-  )
-  ..allowElement('style')
-  ..allowElement(
-    'script',
-    attributes: [
-      'src',
-      'type',
-      'defer',
-      'async',
-      'crossorigin',
-      'integrity',
-      'nomodule',
-      'nonce',
-      'referrerpolicy',
-    ],
-    uriPolicy: AllowAllUri(),
-  )
-  ..allowCustomElement(
-    'model-viewer',
-    attributes: [
-      'style',
-
-      // Loading Attributes
-      'src',
-      'alt',
-      'poster',
-      'loading',
-      'reveal',
-      'with-credentials',
-
-      // Augmented Reality Attributes
-      'ar',
-      'ar-modes',
-      'ar-scale',
-      'ar-placement',
-      'ios-src',
-      'xr-environment',
-
-      // Staing & Cameras Attributes
-      'camera-controls',
-      'disable-pan',
-      'disable-tap',
-      'touch-action',
-      'disable-zoom',
-      'orbit-sensitivity',
-      'auto-rotate',
-      'auto-rotate-delay',
-      'rotation-per-second',
-      'interaction-prompt',
-      'interaction-prompt-style',
-      'interaction-prompt-threshold',
-      'camera-orbit',
-      'camera-target',
-      'field-of-view',
-      'max-camera-orbit',
-      'min-camera-orbit',
-      'max-field-of-view',
-      'min-field-of-view',
-      'interpolation-decay',
-
-      // Lighting & Env Attributes
-      'skybox-image',
-      'environment-image',
-      'exposure',
-      'shadow-intensity',
-      'shadow-softness ',
+// Allowlist equivalent to the previous NodeValidatorBuilder
+const _allowedTags = <String>[
+  'div',
+  'span',
+  'p',
+  'h1',
+  'h2',
+  'h3',
+  'h4',
+  'h5',
+  'h6',
+  'strong',
+  'em',
+  'b',
+  'i',
+  'u',
+  'br',
+  'hr',
+  'meta',
+  'style', // IMPORTANT: Keep style tags for CSS
+  'button',
+  'input',
+  'label',
+  'select',
+  'option',
+  'textarea',
+  'img',
+  'svg',
+  'path',
+  'circle',
+  'rect',
+  'line',
+  'polygon',
+  'model-viewer',
+];
 
-      // Animation Attributes
-      'animation-name',
-      'animation-crossfade-duration',
-      'autoplay',
-
-      // Materials & Scene Attributes
-      'variant-name',
-      'orientation',
-      'scale',
-    ],
-    uriPolicy: AllowAllUri(),
-  );
-
-class AllowAllUri implements UriPolicy {
-  @override
-  bool allowsUri(String uri) {
-    return true;
-  }
-}
+const _allowedAttrs = <String>[
+  // common
+  'id', 'class', 'style', 'title', 'name', 'content',
+  'src', 'alt', 'type', 'defer', 'async', 'crossorigin', 'integrity',
+  'nomodule', 'nonce', 'referrerpolicy',
+  // model-viewer
+  'poster', 'loading', 'reveal', 'with-credentials',
+  'ar', 'ar-modes', 'ar-scale', 'ar-placement', 'ios-src', 'xr-environment',
+  'camera-controls', 'disable-pan', 'disable-tap', 'touch-action',
+  'disable-zoom',
+  'orbit-sensitivity', 'auto-rotate', 'auto-rotate-delay',
+  'rotation-per-second',
+  'interaction-prompt', 'interaction-prompt-style',
+  'interaction-prompt-threshold',
+  'camera-orbit', 'camera-target', 'field-of-view', 'max-camera-orbit',
+  'min-camera-orbit',
+  'max-field-of-view', 'min-field-of-view', 'interpolation-decay',
+  'skybox-image', 'environment-image', 'exposure', 'shadow-intensity',
+  'shadow-softness',
+  'animation-name', 'animation-crossfade-duration', 'autoplay',
+  'variant-name', 'orientation', 'scale',
+];
diff --git a/lib/src/app/model_viewer/o3d_model_viewer.dart b/lib/src/app/model_viewer/o3d_model_viewer.dart
index e2176cc..73753ac 100644
--- a/lib/src/app/model_viewer/o3d_model_viewer.dart
+++ b/lib/src/app/model_viewer/o3d_model_viewer.dart
@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:o3d/o3d.dart';
 import 'package:webview_flutter/webview_flutter.dart';
+
 import '../../../src/app/model_viewer/model_viewer_plus_stub.dart'
     if (dart.library.io) 'model_viewer_plus_mobile.dart'
     if (dart.library.js_interop) 'model_viewer_plus_web.dart';
-import '../fake/dart_html_fake.dart' if (dart.library.js_interop) 'dart:html';
 
 /// Flutter widget for rendering interactive 3D models.
 class O3DModelViewer extends StatefulWidget {
@@ -64,7 +64,8 @@ class O3DModelViewer extends StatefulWidget {
     this.relatedJs,
     required this.id,
     this.debugLogging = true,
-    this.overwriteNodeValidatorBuilder,
+    // Deprecated. Use [sanitizerConfig] instead.
+    // this.overwriteNodeValidatorBuilder,
     this.javascriptChannels,
     this.onWebViewCreated,
     super.key,
@@ -603,7 +604,7 @@ class O3DModelViewer extends StatefulWidget {
   ///
   /// See also: [NodeValidatorBuilder](https://api.flutter.dev/flutter/dart-html/NodeValidatorBuilder-class.html)
   ///
-  final NodeValidatorBuilder? overwriteNodeValidatorBuilder;
+  // final NodeValidatorBuilder? overwriteNodeValidatorBuilder;
 
   /// Passthrough to `javascriptChannels` in the underlying `WebView`.
   final Set<JavascriptChannel>? javascriptChannels;
diff --git a/lib/src/controllers/implementation/o3d_web_impl.dart b/lib/src/controllers/implementation/o3d_web_impl.dart
index 930f7ff..1181972 100644
--- a/lib/src/controllers/implementation/o3d_web_impl.dart
+++ b/lib/src/controllers/implementation/o3d_web_impl.dart
@@ -1,7 +1,9 @@
 // ignore_for_file: avoid_web_libraries_in_flutter
+import 'dart:js_interop';
+import 'dart:js_interop_unsafe' as js_util;
+
 import 'package:flutter/services.dart';
 import 'package:o3d/src/controllers/interfaces/o3d_controller_interface.dart';
-import 'dart:js' as js;
 import 'package:webview_flutter/webview_flutter.dart';
 
 class O3dImp implements O3DControllerInterface {
@@ -88,14 +90,15 @@ class O3dImp implements O3DControllerInterface {
 
   @override
   Future executeCustomJsCodeWithResult(String code) async {
-    final js.JsArray<dynamic> result =
-        await js.context.callMethod('customEvaluateWithResult$id', [code]);
-    return result.toList();
+    final JSPromise<JSArray<JSAny>> jsResult =
+        globalContext.callMethod('customEvaluateWithResult$id'.toJS, code.toJS);
+    final result = (await jsResult.toDart).toDart;
+    return result;
   }
 
   @override
   void customJsCode(String code) =>
-      js.context.callMethod("customJsCode$id", [code]);
+      globalContext.callMethod("customJsCode$id".toJS, code.toJS);
 
   @override
   void resetCameraOrbit() {
diff --git a/pubspec.yaml b/pubspec.yaml
index 76fe4c3..d00bd84 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -23,7 +23,7 @@ platforms:
   web:
 
 environment:
-  sdk: ">=3.0.0 <4.0.0"
+  sdk: ">=3.6.0 <4.0.0"
   flutter: ">=1.17.0"
 
 dependencies:
@@ -32,7 +32,7 @@ dependencies:
     sdk: flutter
   path: ^1.9.0
   url_launcher: ^6.2.6
-  web: ^1.0.0
+  web: ^1.1.1
   webview_flutter: ^4.10.0
   webview_flutter_android: ^4.1.0
   webview_flutter_wkwebview: ^3.16.3

From 495596367d479c41d95fdda9f64a4cbaafe381dd Mon Sep 17 00:00:00 2001
From: "khanh.nguyen.quoc" <khanh.nguyen.quoc@airstage-vn.asia>
Date: Fri, 10 Oct 2025 13:55:09 +0700
Subject: [PATCH 2/4] remove unused integrity

---
 lib/src/app/model_viewer/model_viewer_plus_web.dart | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/lib/src/app/model_viewer/model_viewer_plus_web.dart b/lib/src/app/model_viewer/model_viewer_plus_web.dart
index 1b70d58..7c99295 100644
--- a/lib/src/app/model_viewer/model_viewer_plus_web.dart
+++ b/lib/src/app/model_viewer/model_viewer_plus_web.dart
@@ -119,10 +119,6 @@ class ModelViewerState extends State<O3DModelViewer> {
     script.src =
         'https://cdnjs.cloudflare.com/ajax/libs/dompurify/3.2.7/purify.min.js';
     script.defer = true;
-    // Add integrity for security
-    script.integrity =
-        'sha512-5NsJWIT0jacsCoHLyxBMHRJx8MHDMPpw0D4mK5FAqq3YRJJLDq3CQYz3MKEJo45hVzvFvPdPZJTSyVxfJxfsEw==';
-    script.crossOrigin = 'anonymous';
 
     script.addEventListener(
       'load',

From 86ba5d778abbf8c63812bba6c9e442af39e611d3 Mon Sep 17 00:00:00 2001
From: "khanh.nguyen.quoc" <khanh.nguyen.quoc@airstage-vn.asia>
Date: Fri, 10 Oct 2025 15:13:19 +0700
Subject: [PATCH 3/4] check function customJsCode exist before call

---
 .../implementation/o3d_web_impl.dart          | 43 +++++++++++++++----
 1 file changed, 35 insertions(+), 8 deletions(-)

diff --git a/lib/src/controllers/implementation/o3d_web_impl.dart b/lib/src/controllers/implementation/o3d_web_impl.dart
index 1181972..ce65257 100644
--- a/lib/src/controllers/implementation/o3d_web_impl.dart
+++ b/lib/src/controllers/implementation/o3d_web_impl.dart
@@ -1,6 +1,6 @@
 // ignore_for_file: avoid_web_libraries_in_flutter
 import 'dart:js_interop';
-import 'dart:js_interop_unsafe' as js_util;
+import 'dart:js_interop_unsafe';
 
 import 'package:flutter/services.dart';
 import 'package:o3d/src/controllers/interfaces/o3d_controller_interface.dart';
@@ -90,19 +90,46 @@ class O3dImp implements O3DControllerInterface {
 
   @override
   Future executeCustomJsCodeWithResult(String code) async {
-    final JSPromise<JSArray<JSAny>> jsResult =
-        globalContext.callMethod('customEvaluateWithResult$id'.toJS, code.toJS);
-    final result = (await jsResult.toDart).toDart;
-    return result;
+    try {
+      final JSPromise<JSAny?> jsResult = globalContext.callMethod(
+          'customEvaluateWithResult$id'.toJS, code.toJS) as JSPromise<JSAny?>;
+      final result = await jsResult.toDart;
+
+      // Convert JSArray to Dart List if needed
+      if (result != null && result.isA<JSArray>()) {
+        final jsArray = result as JSArray<JSString?>;
+        return jsArray.toDart.map((item) => item?.toDart).toList();
+      }
+      return result;
+    } catch (e) {
+      logger?.call('Error executing JS code: $e');
+      return null;
+    }
   }
 
   @override
-  void customJsCode(String code) =>
-      globalContext.callMethod("customJsCode$id".toJS, code.toJS);
+  void customJsCode(String code) {
+    try {
+      // Call function: window.customJsCode{id}(code)
+      // Need to wrap argument in JSArray for proper calling
+      final functionName = 'customJsCode$id';
+
+      // Check if function exists
+      if (!globalContext.has(functionName)) {
+        logger?.call('Function $functionName not found on window object');
+        return;
+      }
+
+      // Call the function with code as single argument
+      globalContext.callMethod(functionName.toJS, code.toJS);
+    } catch (e) {
+      logger?.call('Error calling customJsCode: $e');
+    }
+  }
 
   @override
   void resetCameraOrbit() {
-    customJsCode('$model.cameraTarget = defaultCameraOrbit$id;');
+    customJsCode('$model.cameraOrbit = defaultCameraOrbit$id;');
   }
 
   @override

From 203afce7ac01fdbce8a2104435ca8a8bb9668a3f Mon Sep 17 00:00:00 2001
From: "khanh.nguyen.quoc" <khanh.nguyen.quoc@airstage-vn.asia>
Date: Fri, 10 Oct 2025 17:50:28 +0700
Subject: [PATCH 4/4] update conditional imports

---
 lib/src/controllers/interfaces/o3d_controller_interface.dart   | 2 +-
 .../controllers/repositories/o3d_datasource_repository.dart    | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/lib/src/controllers/interfaces/o3d_controller_interface.dart b/lib/src/controllers/interfaces/o3d_controller_interface.dart
index 5e30346..61e7fc6 100644
--- a/lib/src/controllers/interfaces/o3d_controller_interface.dart
+++ b/lib/src/controllers/interfaces/o3d_controller_interface.dart
@@ -1,6 +1,6 @@
 import 'package:flutter/foundation.dart';
 import 'package:o3d/src/controllers/implementation/o3d_stub_impl.dart'
-    if (dart.library.js) "package:o3d/src/controllers/implementation/o3d_web_impl.dart";
+    if (dart.library.js_interop) "package:o3d/src/controllers/implementation/o3d_web_impl.dart";
 
 abstract class O3DControllerInterface {
   /// [customJsCode]
diff --git a/lib/src/controllers/repositories/o3d_datasource_repository.dart b/lib/src/controllers/repositories/o3d_datasource_repository.dart
index e148857..f224e17 100644
--- a/lib/src/controllers/repositories/o3d_datasource_repository.dart
+++ b/lib/src/controllers/repositories/o3d_datasource_repository.dart
@@ -1,8 +1,9 @@
 import 'package:flutter/material.dart';
 import 'package:o3d/src/controllers/interfaces/o3d_controller_interface.dart';
 import 'package:webview_flutter/webview_flutter.dart';
+
 import '../implementation/o3d_stub_impl.dart'
-    if (dart.library.js) "../implementation/o3d_web_impl.dart";
+    if (dart.library.js_interop) "../implementation/o3d_web_impl.dart";
 
 class O3dDataSource implements O3DControllerInterface {
   final O3dImp _o3dImp;