Switch dart:js and dart:js_util usages to use static interop

Author: parlough

lib/resources/docs.dart.js

@@ -5,7 +5,7 @@ description: A non-interactive HTML documentation generator for Dart source code
 repository: https://github.com/dart-lang/dartdoc
 
 environment:
-  sdk: '>=2.17.0 <3.0.0'
+  sdk: '>=2.18.0 <3.0.0'
 
 dependencies:
   analyzer: "^5.2.0"
@@ -35,6 +35,7 @@ dev_dependencies:
   dart_style: ^2.2.0
   grinder: ^0.9.0
   http: ^0.13.3
+  js: 0.6.5
   lints: ^2.0.0
   test: ^1.19.0
   test_descriptor: ^2.0.0

lib/resources/docs.dart.js.map

@@ -2,20 +2,14 @@
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
-import 'dart:js' as js;
-
+import 'highlight.dart' as highlight;
 import 'search.dart' as search;
 import 'sidenav.dart' as sidenav;
 import 'theme.dart' as theme;
 
 void main() {
-  inithighlightJS();
+  highlight.init();
   sidenav.init();
   search.init();
   theme.init();
 }
-
-void inithighlightJS() {
-  js.JsObject hljs = js.context['hljs'];
-  hljs.callMethod('highlightAll');
-}

pubspec.yaml

@@ -0,0 +1,16 @@
+import 'package:js/js.dart';
+
+void init() {
+  highlight?.highlightAll();
+}
+
+@JS()
+@staticInterop
+class HighlightJs {}
+
+extension HighlightJsExtension on HighlightJs {
+  external void highlightAll();
+}
+
+@JS('hljs')
+external HighlightJs? get highlight;

web/docs.dart

@@ -4,7 +4,8 @@
 
 import 'dart:convert';
 import 'dart:html';
-import 'dart:js_util' as js_util;
+
+import 'web_interop.dart';
 
 final String _htmlBase = () {
   final body = document.querySelector('body')!;
@@ -34,14 +35,14 @@ void init() {
   }
 
   window.fetch('${_htmlBase}index.json').then((response) async {
-    int code = js_util.getProperty(response, 'status');
+    response = response as FetchResponse;
+    var code = response.status;
     if (code == 404) {
       disableSearch();
       return;
     }
 
-    var textPromise = js_util.callMethod<Object>(response, 'text', []);
-    var text = await promiseToFuture<String>(textPromise);
+    var text = await response.text;
     var jsonIndex = (jsonDecode(text) as List).cast<Map<String, dynamic>>();
     final index = jsonIndex.map(_IndexItem.fromMap).toList();
 
@@ -167,7 +168,7 @@ class _Search {
     ..append(moreResults)
     ..append(searchResults);
 
-  /// Element used in [listbox] to inform the functionality of hitting enter in
+  /// Element used in [listBox] to inform the functionality of hitting enter in
   /// search box.
   late final moreResults = document.createElement('div')
     ..classes.add('enter-search-message');
@@ -516,10 +517,8 @@ void _mapToContainer(Element containerElement, Element suggestion) {
 
   final element = _containerMap[containerInnerHtml];
   if (element != null) {
-    print('appending! ${suggestion.innerHtml}');
     element.append(suggestion);
   } else {
-    print('appending2! ${suggestion.innerHtml}');
     containerElement.append(suggestion);
     _containerMap[containerInnerHtml] = containerElement;
   }

web/highlight.dart

@@ -1 +1 @@
-469F5B013C1B0324C1F020C95013AC51
+2D8E7D7722AE5937479C00C043788871

web/search.dart

@@ -0,0 +1,18 @@
+import 'package:js/js.dart';
+import 'package:js/js_util.dart' as js_util;
+
+@JS()
+@staticInterop
+class FetchResponse {}
+
+extension FetchResponseExtension on FetchResponse {
+  external int get status;
+
+  @JS('text')
+  external Promise _text();
+  Future<String> get text => js_util.promiseToFuture(_text());
+}
+
+@JS()
+@staticInterop
+class Promise {}