Switch ddc to use @js instead of @JsName. Also update dart:js to support new public methods added for 1.13

BUG=
[email protected]

Review URL: https://codereview.chromium.org/1448993002 .

Author: jacob314

pkg/dev_compiler/lib/runtime/dart/_js_helper.js

@@ -30,15 +30,6 @@ dart_library.library('dart/_js_helper', null, /* Imports */[
   dart.setSignature(Native, {
     constructors: () => ({Native: [Native, [core.String]]})
   });
-  class JsName extends core.Object {
-    JsName(opts) {
-      let name = opts && 'name' in opts ? opts.name : null;
-      this.name = name;
-    }
-  }
-  dart.setSignature(JsName, {
-    constructors: () => ({JsName: [JsName, [], {name: core.String}]})
-  });
   class JsPeerInterface extends core.Object {
     JsPeerInterface(opts) {
       let name = opts && 'name' in opts ? opts.name : null;
@@ -1189,7 +1180,6 @@ dart_library.library('dart/_js_helper', null, /* Imports */[
   exports.NoThrows = NoThrows;
   exports.NoInline = NoInline;
   exports.Native = Native;
-  exports.JsName = JsName;
   exports.JsPeerInterface = JsPeerInterface;
   exports.SupportJsExtensionMethods = SupportJsExtensionMethods;
   exports.defineProperty = defineProperty;

pkg/dev_compiler/lib/runtime/dart/js.js

@@ -390,6 +390,31 @@ dart_library.library('dart/js', null, /* Imports */[
     return value;
   }
   dart.fn(_putIfAbsent, core.Object, [dart.dynamic, dart.dynamic, dart.functionType(dart.dynamic, [dart.dynamic])]);
+  function allowInterop(f) {
+    return f;
+  }
+  dart.fn(allowInterop, core.Function, [core.Function]);
+  dart.defineLazyProperties(exports, {
+    get _interopCaptureThisExpando() {
+      return new (core.Expando$(core.Function))();
+    },
+    set _interopCaptureThisExpando(_) {}
+  });
+  function allowInteropCaptureThis(f) {
+    let ret = exports._interopCaptureThisExpando.get(f);
+    if (ret == null) {
+      ret = dart.as(function() {
+        let args = [this];
+        for (let arg of arguments) {
+          args.push(arg);
+        }
+        return f(...args);
+      }, core.Function);
+      exports._interopCaptureThisExpando.set(f, ret);
+    }
+    return ret;
+  }
+  dart.fn(allowInteropCaptureThis, core.Function, [core.Function]);
   let __CastType0$ = dart.generic(function(E) {
     let __CastType0 = dart.typedef('__CastType0', () => dart.functionType(dart.dynamic, [E]));
     return __CastType0;
@@ -400,4 +425,6 @@ dart_library.library('dart/js', null, /* Imports */[
   exports.JsFunction = JsFunction;
   exports.JsArray$ = JsArray$;
   exports.JsArray = JsArray;
+  exports.allowInterop = allowInterop;
+  exports.allowInteropCaptureThis = allowInteropCaptureThis;
 });

pkg/dev_compiler/lib/src/codegen/js_codegen.dart

@@ -248,7 +248,7 @@ class JSCodegenVisitor extends GeneralizingAstVisitor with ClosureAnnotator {
   void visitLibraryDirective(LibraryDirective node) {
     assert(_jsModuleValue == null);
 
-    var jsName = findAnnotation(node.element, isJsNameAnnotation);
+    var jsName = findAnnotation(node.element, isJSAnnotation);
     _jsModuleValue =
         getConstantField(jsName, 'name', types.stringType)?.toStringValue();
   }
@@ -409,7 +409,7 @@ class JSCodegenVisitor extends GeneralizingAstVisitor with ClosureAnnotator {
     if (jsTypeName != null && jsTypeName != dartClassName) {
       // We export the JS type as if it was a Dart type. For example this allows
       // `dom.InputElement` to actually be HTMLInputElement.
-      // TODO(jmesserly): if we had the JsName on the Element, we could just
+      // TODO(jmesserly): if we had the JS name on the Element, we could just
       // generate it correctly when we refer to it.
       if (isPublic(dartClassName)) _addExport(dartClassName);
       return js.statement('let # = #;', [dartClassName, jsTypeName]);
@@ -421,7 +421,7 @@ class JSCodegenVisitor extends GeneralizingAstVisitor with ClosureAnnotator {
   JS.Statement visitClassDeclaration(ClassDeclaration node) {
     var classElem = node.element;
     var type = classElem.type;
-    var jsName = findAnnotation(classElem, isJsNameAnnotation);
+    var jsName = findAnnotation(classElem, isJSAnnotation);
 
     if (jsName != null) return _emitJsType(node.name.name, jsName);
 
@@ -2721,7 +2721,7 @@ class JSCodegenVisitor extends GeneralizingAstVisitor with ClosureAnnotator {
   // TODO(jmesserly): ideally we'd check the method and see if it is marked
   // `external`, but that doesn't work because it isn't in the element model.
   bool _useNativeJsIndexer(DartType type) =>
-      findAnnotation(type.element, isJsNameAnnotation) != null;
+      findAnnotation(type.element, isJSAnnotation) != null;
 
   /// Gets the target of a [PropertyAccess], [IndexExpression], or
   /// [MethodInvocation]. These three nodes can appear in a [CascadeExpression].

pkg/dev_compiler/lib/src/codegen/js_interop.dart

@@ -24,8 +24,8 @@ bool isJsRestAnnotation(DartObjectImpl value) =>
 bool isJsSpreadInvocation(MethodInvocation i) =>
     _isJsLibType('spread', i.methodName?.bestElement);
 
-// TODO(jmesserly): Move JsName, JsPeerInterface to package:js (see issue #135).
-bool isJsNameAnnotation(DartObjectImpl value) => value.type.name == 'JsName';
+// TODO(jmesserly): Move JsPeerInterface to package:js (see issue #135).
+bool isJSAnnotation(DartObjectImpl value) => value.type.name == 'JS';
 
 bool isJsPeerInterface(DartObjectImpl value) =>
     value.type.name == 'JsPeerInterface';

pkg/dev_compiler/lib/src/utils.dart

@@ -330,7 +330,7 @@ String resourceOutputPath(Uri resourceUri, Uri entryUri, String runtimeDir) {
 ///
 /// For example if we had the ClassDeclaration node for `FontElement`:
 ///
-///    @JsName('HTMLFontElement')
+///    @js.JS('HTMLFontElement')
 ///    @deprecated
 ///    class FontElement { ... }
 ///

pkg/dev_compiler/test/codegen/expect/dom/dom.js

@@ -5,15 +5,6 @@ dart_library.library('dom/dom', window, /* Imports */[
 ], function(exports, dart, core) {
   'use strict';
   let dartx = dart.dartx;
-  class JsName extends core.Object {
-    JsName(opts) {
-      let name = opts && 'name' in opts ? opts.name : null;
-      this.name = name;
-    }
-  }
-  dart.setSignature(JsName, {
-    constructors: () => ({JsName: [JsName, [], {name: core.String}]})
-  });
   class Overload extends core.Object {
     Overload() {
     }
@@ -50,7 +41,6 @@ dart_library.library('dom/dom', window, /* Imports */[
   }
   class CanvasPathMethods extends core.Object {}
   // Exports:
-  exports.JsName = JsName;
   exports.Overload = Overload;
   exports.overload = overload;
   exports.CustomEvent = CustomEvent;

pkg/dev_compiler/test/codegen/expect/js/js.js

@@ -0,0 +1,31 @@
+dart_library.library('js/js', null, /* Imports */[
+  "dart/_runtime",
+  'dart/js',
+  'dart/core'
+], /* Lazy imports */[
+], function(exports, dart, js, core) {
+  'use strict';
+  let dartx = dart.dartx;
+  dart.export(exports, js, ['allowInterop', 'allowInteropCaptureThis'], []);
+  class JS extends core.Object {
+    JS(name) {
+      if (name === void 0)
+        name = null;
+      this.name = name;
+    }
+  }
+  dart.setSignature(JS, {
+    constructors: () => ({JS: [JS, [], [core.String]]})
+  });
+  class _Anonymous extends core.Object {
+    _Anonymous() {
+    }
+  }
+  dart.setSignature(_Anonymous, {
+    constructors: () => ({_Anonymous: [_Anonymous, []]})
+  });
+  let anonymous = dart.const(new _Anonymous());
+  // Exports:
+  exports.JS = JS;
+  exports.anonymous = anonymous;
+});

pkg/dev_compiler/test/codegen/expect/js/js.txt

@@ -0,0 +1 @@
+// Messages from compiling js.dart

pkg/dev_compiler/test/codegen/expect/sunflower/dom.js

@@ -5,15 +5,6 @@ dart_library.library('sunflower/dom', window, /* Imports */[
 ], function(exports, dart, core) {
   'use strict';
   let dartx = dart.dartx;
-  class JsName extends core.Object {
-    JsName(opts) {
-      let name = opts && 'name' in opts ? opts.name : null;
-      this.name = name;
-    }
-  }
-  dart.setSignature(JsName, {
-    constructors: () => ({JsName: [JsName, [], {name: core.String}]})
-  });
   class Overload extends core.Object {
     Overload() {
     }
@@ -50,7 +41,6 @@ dart_library.library('sunflower/dom', window, /* Imports */[
   }
   class CanvasPathMethods extends core.Object {}
   // Exports:
-  exports.JsName = JsName;
   exports.Overload = Overload;
   exports.overload = overload;
   exports.CustomEvent = CustomEvent;

pkg/dev_compiler/test/codegen/expect/sunflower/sunflower.html

@@ -52,6 +52,7 @@ <h1>drfibonacci's Sunflower Spectacular</h1>
 <script src="../dev_compiler/runtime/dart/_js_mirrors.js"></script>
 <script src="../dev_compiler/runtime/dart/js.js"></script>
 <script src="circle.js"></script>
+<script src="../js/js.js"></script>
 <script src="dom.js"></script>
 <script src="painter.js"></script>
 <script src="sunflower.js"></script>

pkg/dev_compiler/test/codegen/sunflower/dom.dart

@@ -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.
 
-@JsName(name: 'window')
+@js.JS('window')
 library dom;
 
-@JsName()
+import 'package:js/js.dart' as js;
+
+@js.JS()
 class Window {}
 
-class JsName {
-  /// The JavaScript name.
-  /// Used for classes and libraries.
-  /// Note that this could be an expression, e.g. `lib.TypeName` in JS, but it
-  /// should be kept simple, as it will be generated directly into the code.
-  final String name;
-  const JsName({this.name});
-}
 class Overload {
   const Overload();
 }
@@ -24,7 +18,7 @@ const overload = const Overload();
 external Document get document;
 external Window get window;
 
-@JsName()
+@js.JS()
 abstract class Document extends Node {
   Element createElement(String name);
   Element querySelector(String selector);
@@ -33,7 +27,7 @@ abstract class Document extends Node {
   HTMLElement body;
 }
 
-@JsName()
+@js.JS()
 class Blob {
   external Blob(blobParts, {String type});
 }
@@ -42,19 +36,19 @@ class CustomEvent {
   external CustomEvent(String type, {detail, bubbles, cancelable});
 }
 
-@JsName()
+@js.JS()
 abstract class Element extends Node {
   void addEventListener(String type, EventListener callback, [bool capture]);
   String textContent;
 }
 
-@JsName()
+@js.JS()
 abstract class HTMLElement extends Element {
   String innerHTML;
   HTMLCollection get children;
 }
 
-@JsName()
+@js.JS()
 abstract class Node {
   bool hasChildNodes();
   NodeList get childNodes;
@@ -70,7 +64,7 @@ abstract class HTMLCollection {
   external Element operator [](num index);
 }
 
-@JsName()
+@js.JS()
 class NodeList {
   external NodeList();
   external num get length;
@@ -83,26 +77,26 @@ class NodeList {
 
 typedef void EventListener(Event e);
 
-@JsName()
+@js.JS()
 abstract class Event {}
 
 // TODO(jmesserly): rename these
-@JsName(name: 'HTMLInputElement')
+@js.JS('HTMLInputElement')
 abstract class InputElement extends HTMLElement {
   String value;
 }
 
-@JsName(name: 'HTMLCanvasElement')
+@js.JS('HTMLCanvasElement')
 abstract class CanvasElement extends HTMLElement {
   RenderingContext getContext(String contextId);
 }
 
-@JsName(name: 'HTMLDivElement')
+@js.JS('HTMLDivElement')
 abstract class DivElement extends HTMLElement {
   RenderingContext getContext(String contextId);
 }
 
-@JsName(name: 'HTMLScriptElement')
+@js.JS('HTMLScriptElement')
 abstract class ScriptElement extends HTMLElement {
   String type;
 }
@@ -113,7 +107,7 @@ abstract class ScriptElement extends HTMLElement {
 abstract class RenderingContext {}
 
 // http://www.w3.org/html/wg/drafts/2dcontext/html5_canvas_CR/
-@JsName()
+@js.JS()
 abstract class CanvasRenderingContext2D
     implements CanvasDrawingStyles, CanvasPathMethods, RenderingContext {
 
@@ -229,23 +223,23 @@ abstract class CanvasPathMethods {
       [bool anticlockwise]);
 }
 
-@JsName()
+@js.JS()
 abstract class CanvasGradient {
   // opaque object
   void addColorStop(num offset, String color);
 }
 
-@JsName()
+@js.JS()
 abstract class CanvasPattern {
   // opaque object
 }
 
-@JsName()
+@js.JS()
 abstract class TextMetrics {
   num get width;
 }
 
-@JsName()
+@js.JS()
 abstract class ImageData {
   int get width;
   int get height;