如何在编译的 dart 中请求全屏

我正在玩一个 Dart 应用程序，试图让全屏模式正常工作。我的 HTML（不包括样板）：

<div id="fullscreen_div">
  Clicking this should cause it to go fullscreen!
</div>

我的飞镖代码：

import 'dart:html';

void main() {
  var div = querySelector('#fullscreen_div');
  div.onClick.listen((MouseEvent e) {
    div.requestFullscreen();
    print('requested fullscreen');
  });
}

这是 DartPad 上的。

如果我做得正确，单击 div 一次应该会导致 div 进入全屏模式。在 Chromium 上，这是有效的。当编译为 JavaScript（调试和缩小）时，不会发生这种情况，控制台输出：

Uncaught TypeError: undefined is not a function

Chrome、Firefox 和 IE 都会出现这种情况（在 Windows 7 上测试）。据我了解，这是一个常见的 JavaScript 错误，搜索不会出现任何明显的错误。

任何想法为什么requestFullScreendart 编译成 JS 后不起作用？

正如评论中所指出的（感谢 Günter！），这是一个已知问题。该线程中的 #12 发布了一个很好的解决方法，由我编辑为更通用一些：

import 'dart:js';
void fullscreenWorkaround(Element element) {
  var elem = new JsObject.fromBrowserObject(element);

  if (elem.hasProperty("requestFullscreen")) {
    elem.callMethod("requestFullscreen");
  }
  else {
    List<String> vendors = ['moz', 'webkit', 'ms', 'o'];
    for (String vendor in vendors) {
      String vendorFullscreen = "${vendor}RequestFullscreen";
      if (vendor == 'moz') {
        vendorFullscreen = "${vendor}RequestFullScreen";
      }
      if (elem.hasProperty(vendorFullscreen)) {
        elem.callMethod(vendorFullscreen);
        return;
      }
    }
  }
}

我在代码中使用了这个，并替换了这个调用

div.requestFullscreen();

with

fullscreenWorkaround(div);

效果很好。在 Chrome 和 IE 上测试并编译工作。