[dart:html] Fix requestFullscreen bindings and type

Closes https://github.com/dart-lang/sdk/issues/25324

requestFullscreen returns a Promise and takes in an options parameter.
It also can be accessed either via `requestFullscreen` or
`webkitFullscreen` (only necessary for Safari). The bindings should be
updated to reflect this behavior.

Change-Id: I9401b6a1c8b3f9ac370aad8caac8295e0ee358b8
Reviewed-on: https://dart-review.googlesource.com/c/sdk/+/229381
Reviewed-by: Sigmund Cherem <sigmund@google.com>
Commit-Queue: Srujan Gaddam <srujzs@google.com>
diff --git a/sdk/lib/html/dart2js/html_dart2js.dart b/sdk/lib/html/dart2js/html_dart2js.dart
index 182872b..9a9f029 100644
--- a/sdk/lib/html/dart2js/html_dart2js.dart
+++ b/sdk/lib/html/dart2js/html_dart2js.dart
@@ -13989,6 +13989,40 @@
 
   int get scrollWidth => JS<num>('num', '#.scrollWidth', this).round();
 
+  /**
+   * Displays this element fullscreen.
+   *
+   * ## Other resources
+   *
+   * * [Fullscreen
+   *   API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API)
+   *   from MDN.
+   * * [Fullscreen specification](http://www.w3.org/TR/fullscreen/) from W3C.
+   */
+  @SupportedBrowser(SupportedBrowser.CHROME)
+  @SupportedBrowser(SupportedBrowser.SAFARI)
+  Future<void> requestFullscreen([Map? options]) {
+    var retValue;
+    if (options != null) {
+      retValue = JS(
+          '',
+          '(#.requestFullscreen||#.webkitRequestFullscreen).call(#, #)',
+          this,
+          this,
+          this,
+          convertDartToNative_Dictionary(options));
+    } else {
+      retValue = JS(
+          '',
+          '(#.requestFullscreen||#.webkitRequestFullscreen).call(#)',
+          this,
+          this,
+          this);
+    }
+    if (retValue != null) return promiseToFuture(retValue);
+    return Future<void>.value();
+  }
+
   // To suppress missing implicit constructor warnings.
   factory Element._() {
     throw new UnsupportedError("Not supported");
@@ -14896,21 +14930,6 @@
 
   void setPointerCapture(int pointerId) native;
 
-  @JSName('webkitRequestFullscreen')
-  /**
-   * Displays this element fullscreen.
-   *
-   * ## Other resources
-   *
-   * * [Fullscreen
-   *   API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API)
-   *   from MDN.
-   * * [Fullscreen specification](http://www.w3.org/TR/fullscreen/) from W3C.
-   */
-  @SupportedBrowser(SupportedBrowser.CHROME)
-  @SupportedBrowser(SupportedBrowser.SAFARI)
-  void requestFullscreen() native;
-
   // From ChildNode
 
   void after(Object nodes) native;
diff --git a/tests/lib/html/request_fullscreen_test.dart b/tests/lib/html/request_fullscreen_test.dart
new file mode 100644
index 0000000..2138e2d
--- /dev/null
+++ b/tests/lib/html/request_fullscreen_test.dart
@@ -0,0 +1,16 @@
+// Copyright (c) 2022, the Dart project authors.  Please see the AUTHORS file
+// 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:html';
+
+void main() async {
+  var documentElement = document.documentElement!;
+
+  // `requestFullscreen` requires user interaction to succeed, so this just
+  // tests that the bindings and type work.
+  await documentElement.requestFullscreen().catchError((_) {});
+  // Try it with an options argument.
+  await documentElement
+      .requestFullscreen({'navigationUI': 'show'}).catchError((_) {});
+}
diff --git a/tests/lib_2/html/request_fullscreen_test.dart b/tests/lib_2/html/request_fullscreen_test.dart
new file mode 100644
index 0000000..2138e2d
--- /dev/null
+++ b/tests/lib_2/html/request_fullscreen_test.dart
@@ -0,0 +1,16 @@
+// Copyright (c) 2022, the Dart project authors.  Please see the AUTHORS file
+// 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:html';
+
+void main() async {
+  var documentElement = document.documentElement!;
+
+  // `requestFullscreen` requires user interaction to succeed, so this just
+  // tests that the bindings and type work.
+  await documentElement.requestFullscreen().catchError((_) {});
+  // Try it with an options argument.
+  await documentElement
+      .requestFullscreen({'navigationUI': 'show'}).catchError((_) {});
+}
diff --git a/tools/dom/idl/dart/dart.idl b/tools/dom/idl/dart/dart.idl
index 699473c..ac5b337 100644
--- a/tools/dom/idl/dart/dart.idl
+++ b/tools/dom/idl/dart/dart.idl
@@ -523,8 +523,10 @@
 
 [DartSupplemental]
 interface Element : Node {
-    // Remove operation requestFullscreen only use webKitRequestFullscreen.
+    // Use template implementation that looks for both the non-prefixed and
+    // prefixed `requestFullscreen` instead.
     [DartSuppress] void requestFullscreen();
+    [DartSuppress] void webkitRequestFullscreen();
     // setAttribute and setAttributeNS can take in non-string values that are
     // then converted to strings.
     [DartSuppress] void setAttribute(DOMString name, DOMString value);
diff --git a/tools/dom/templates/html/impl/impl_Element.darttemplate b/tools/dom/templates/html/impl/impl_Element.darttemplate
index 046addf..6f5d05c 100644
--- a/tools/dom/templates/html/impl/impl_Element.darttemplate
+++ b/tools/dom/templates/html/impl/impl_Element.darttemplate
@@ -1584,6 +1584,40 @@
 
   int get scrollWidth => JS<num>('num', '#.scrollWidth', this).round();
 
+  /**
+   * Displays this element fullscreen.
+   *
+   * ## Other resources
+   *
+   * * [Fullscreen
+   *   API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API)
+   *   from MDN.
+   * * [Fullscreen specification](http://www.w3.org/TR/fullscreen/) from W3C.
+   */
+  @SupportedBrowser(SupportedBrowser.CHROME)
+  @SupportedBrowser(SupportedBrowser.SAFARI)
+  Future<void> requestFullscreen([Map? options]) {
+    var retValue;
+    if (options != null) {
+      retValue = JS(
+          '',
+          '(#.requestFullscreen||#.webkitRequestFullscreen).call(#, #)',
+          this,
+          this,
+          this,
+          convertDartToNative_Dictionary(options));
+    } else {
+      retValue = JS(
+          '',
+          '(#.requestFullscreen||#.webkitRequestFullscreen).call(#)',
+          this,
+          this,
+          this);
+    }
+    if (retValue != null) return promiseToFuture(retValue);
+    return Future<void>.value();
+  }
+
 $!MEMBERS
 }