dart-sdk/pkg/js
Danny Tuppeny 984f5c928d Added js import to sample code. (#26985)
This import seems to be required for the sample code to pass the analyzer.
2016-08-22 09:20:06 -07:00
..
example pkg/js: moved example code to https://github.com/google/chartjs.dart/ 2015-11-17 11:11:07 -08:00
lib Add JSNative utility class with static methods methods to efficiently manipulate typed JSInterop objects in cases where the member name is not known statically. These methods would be extension methods on JSObject if Dart supported extension methods. Update package js to export these methods. Implement in Dart2JS. Implement JS$ in dart2js. 2016-07-25 09:59:01 -07:00
AUTHORS
CHANGELOG.md Fix analyzer warnings in js_util_test, skip js_util_test in csp mode and baseline expectations for analyze_library.status 2016-07-25 13:20:25 -07:00
LICENSE
PATENTS
pubspec.yaml Fix sdk version constraint for pkg:js 0.6.1 2016-07-25 14:49:13 -07:00
README.md Added js import to sample code. (#26985) 2016-08-22 09:20:06 -07:00

Methods and annotations to specify interoperability with JavaScript APIs.

This packages requires Dart SDK 1.13.0.

This is beta software. Please files issues.

Adding the dependency

Add the following to your pubspec.yaml:

dependencies:
  js: ^0.6.0

Example

See the Chart.js Dart API for an end-to-end example.

Usage

Calling methods

// Calls invoke JavaScript `JSON.stringify(obj)`.
@JS("JSON.stringify")
external String stringify(obj);

Classes and Namespaces

@JS('google.maps')
library maps;

import "package:js/js.dart";

// Invokes the JavaScript getter `google.maps.map`.
external Map get map;

// `new Map` invokes JavaScript `new google.maps.Map(location)`
@JS()
class Map {
  external Map(Location location);
  external Location getLocation();
}

// `new Location(...)` invokes JavaScript `new google.maps.LatLng(...)`
//
// We recommend against using custom JavaScript names whenever
// possible. It is easier for users if the JavaScript names and Dart names
// are consistent.
@JS("LatLng")
class Location {
  external Location(num lat, num lng);
}

JavaScript object literals

Many JavaScript APIs take an object literal as an argument. For example:

// JavaScript
printOptions({responsive: true});

If you want to use printOptions from Dart, you cannot simply pass a Dart Map object  they are "opaque" in JavaScript.

Instead, create a Dart class with both the @JS() and @anonymous annotations.

// Dart
void main() {
  printOptions(new Options(responsive: true));
}

@JS()
external printOptions(Options options);

@JS()
@anonymous
class Options {
  external bool get responsive;

  external factory Options({bool responsive});
}

Passing functions to JavaScript.

If you are passing a Dart function to a JavaScript API, you must wrap it using allowInterop or allowInteropCaptureThis.

Contributing and Filing Bugs

Please file bugs and features requests on the Github issue tracker.

We also love and accept community contributions, from API suggestions to pull requests. Please file an issue before beginning work so we can discuss the design and implementation. We are trying to create issues for all current and future work, so if something there intrigues you (or you need it!) join in on the discussion.

Code contributors must sign the Google Individual Contributor License Agreement.