Migrate to package:web

example/main.dart

@@ -1,6 +1,6 @@
 // ignore_for_file: invalid_use_of_visible_for_testing_member
 
-import 'dart:html';
+import 'package:web/web.dart';
 import 'package:platform_detect/platform_detect.dart';
 import 'package:platform_detect/src/decorator.dart';
 
@@ -38,7 +38,8 @@ void main() {
 
   _parseCurrentBrowser();
   _parseDecoratorValues();
-  ButtonElement evaluate = querySelector('#evaluate-test') as ButtonElement;
+  HTMLButtonElement evaluate =
+      querySelector('#evaluate-test') as HTMLButtonElement;
   evaluate.onClick.listen((_) => _parseTestValues());
 }
 
@@ -54,32 +55,32 @@ void _parseCurrentBrowser() {
   document.querySelector('#$currentUserAgentId')!.text =
       window.navigator.userAgent;
 
-  CheckboxInputElement isChrome =
-      document.querySelector('#$isChromeCheckboxId') as CheckboxInputElement;
+  HTMLInputElement isChrome =
+      document.querySelector('#$isChromeCheckboxId') as HTMLInputElement;
   isChrome.checked = browser.isChrome;
 
-  CheckboxInputElement isFirefox =
-      document.querySelector('#$isFirefoxCheckboxId') as CheckboxInputElement;
+  HTMLInputElement isFirefox =
+      document.querySelector('#$isFirefoxCheckboxId') as HTMLInputElement;
   isFirefox.checked = browser.isFirefox;
 
-  CheckboxInputElement isSafari =
-      document.querySelector('#$isSafariCheckboxId') as CheckboxInputElement;
+  HTMLInputElement isSafari =
+      document.querySelector('#$isSafariCheckboxId') as HTMLInputElement;
   isSafari.checked = browser.isSafari;
 
-  CheckboxInputElement isInternetExplorer =
-      document.querySelector('#$isIeCheckboxId') as CheckboxInputElement;
+  HTMLInputElement isInternetExplorer =
+      document.querySelector('#$isIeCheckboxId') as HTMLInputElement;
   isInternetExplorer.checked = browser.isInternetExplorer;
 }
 
 void _parseTestValues() {
-  InputElement testVendorInput =
-      querySelector('#$testVendorId') as InputElement;
-  InputElement testAppVersionInput =
-      querySelector('#$testAppVersionId') as InputElement;
-  InputElement testAppNameInput =
-      querySelector('#$testAppNameId') as InputElement;
-  InputElement testUserAgentInput =
-      querySelector('#$testUserAgentId') as InputElement;
+  HTMLInputElement testVendorInput =
+      querySelector('#$testVendorId') as HTMLInputElement;
+  HTMLInputElement testAppVersionInput =
+      querySelector('#$testAppVersionId') as HTMLInputElement;
+  HTMLInputElement testAppNameInput =
+      querySelector('#$testAppNameId') as HTMLInputElement;
+  HTMLInputElement testUserAgentInput =
+      querySelector('#$testUserAgentId') as HTMLInputElement;
 
   var navigator = TestNavigator();
   navigator.vendor = testVendorInput.value!.trim();
@@ -97,7 +98,8 @@ void _parseTestValues() {
 }
 
 void _parseDecoratorValues() {
-  CssClassSet htmlElementClasses = document.documentElement!.classes;
+  List<String> htmlElementClasses =
+      domTokenListToListString(document.documentElement!.classList);
 
   String osDecorators = htmlElementClasses
       .toList()

lib/src/decorator.dart

@@ -11,7 +11,8 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import 'dart:html';
+
+import 'package:web/web.dart';
 
 import 'package:meta/meta.dart';
 import 'package:platform_detect/src/detect.dart';
@@ -103,7 +104,7 @@ String nameToClassName(String name) {
 
 /// Whether the given [rootNode] has already had it's CSS classes set via [decorateRootNodeWithPlatformClasses].
 bool nodeHasBeenDecorated(Element rootNode) =>
-    rootNode.classes.contains(decorationCompleteClassName);
+    rootNode.classList.contains(decorationCompleteClassName);
 
 /// Generates CSS classes based on the current [browser], [operatingSystem] and optionally,
 /// [features] that your app may need conditional styling for in addition to the
@@ -144,7 +145,7 @@ void decorateRootNodeWithPlatformClasses(
   rootNode ??= document.documentElement;
 
   if (rootNode != null && !nodeHasBeenDecorated(rootNode)) {
-    var existingClasses = rootNode.classes.toList();
+    var existingClasses = domTokenListToListString(rootNode.classList);
 
     rootNode.className = getPlatformClasses(
         features: features,
@@ -154,3 +155,14 @@ void decorateRootNodeWithPlatformClasses(
     if (callback != null) callback();
   }
 }
+
+List<String> domTokenListToListString(DOMTokenList domTokenList) {
+  List<String> list = [];
+  for (int i = 0; i < domTokenList.length; i++) {
+    String? item = domTokenList.item(i);
+    if (item != null) {
+      list.add(item);
+    }
+  }
+  return list;
+}

lib/src/detect.dart

@@ -11,7 +11,7 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import 'dart:html';
+import 'package:web/web.dart';
 
 import 'package:platform_detect/src/browser.dart';
 import 'package:platform_detect/src/navigator.dart';

pubspec.yaml

@@ -5,9 +5,10 @@ homepage: https://github.com/Workiva/platform_detect
 documentation: https://www.dartdocs.org/documentation/platform_detect/latest
 
 environment:
-  sdk: '>=2.12.0 <3.0.0'
+  sdk: '>=3.2.0 <4.0.0'
 
 dependencies:
+  web: ^0.5.0
   meta: ^1.6.0
   pub_semver: ^2.0.0
 

test/decorator_test.dart

@@ -1,5 +1,5 @@
 @TestOn('browser')
-import 'dart:html';
+import 'package:web/web.dart';
 
 import 'package:test/test.dart';
 
@@ -18,7 +18,7 @@ void main() {
 
     void sharedSetup() {
       calls = [];
-      fakeRootNode = DivElement();
+      fakeRootNode = document.createElement('div');
     }
 
     group('', () {
@@ -39,19 +39,19 @@ void main() {
       });
 
       test('should identify the operating system', () {
-        expect(fakeRootNode.classes,
+        expect(domTokenListToListString(fakeRootNode.classList),
             contains('os-${nameToClassName(operatingSystem.name)}'));
       });
 
       group('should identify the browser', () {
         test('', () {
-          expect(fakeRootNode.classes,
+          expect(domTokenListToListString(fakeRootNode.classList),
               contains('ua-${nameToClassName(browser.name)}'));
         });
 
         test('major version', () {
           expect(
-              fakeRootNode.classes,
+              domTokenListToListString(fakeRootNode.classList),
               contains(
                   'ua-${nameToClassName(browser.name)}${browser.version.major}'));
         });
@@ -60,7 +60,7 @@ void main() {
           for (var i = nextVersion;
               i < nextVersion + decoratedNextVersionCount;
               i++) {
-            expect(fakeRootNode.classes,
+            expect(domTokenListToListString(fakeRootNode.classList),
                 contains('ua-lt-${nameToClassName(browser.name)}$i'));
           }
         });
@@ -75,7 +75,7 @@ void main() {
       });
 
       void verifyDistinctFeatureCssClasses(List<Feature> features) {
-        String allCssClasses = fakeRootNode.classes.toString();
+        String allCssClasses = fakeRootNode.className;
         List<String> featureCssClasses =
             getFeatureSupportClasses(features).split(' ');
 
@@ -95,7 +95,7 @@ void main() {
         for (var i = 0; i < features.length; i++) {
           // 1. Ensure that its there
           expect(
-              fakeRootNode.classes,
+              domTokenListToListString(fakeRootNode.classList),
               contains(matches(RegExp(
                   '($featureSupportNegationClassPrefix)*${features[i].name}'))));
         }
@@ -112,9 +112,12 @@ void main() {
       });
 
       group('custom features provided by the consumer', () {
-        Feature uniqueConsumerFeature =
-            // ignore: unnecessary_null_comparison
-            Feature('canvas', CanvasElement().context2D != null);
+        Feature uniqueConsumerFeature = Feature(
+            'canvas',
+            (document.createElement('canvas') as HTMLCanvasElement)
+                    // ignore: unnecessary_null_comparison
+                    .context2D !=
+                null);
         List<Feature> consumerFeaturesThatContainsNoDefaults = [
           uniqueConsumerFeature
         ];