[dart-misc] 1.13 feature preview: improved JS interop

[Kevin Moore]

I did a write-up on my "work" blog: http://work.j832.com/2015/10/byojsl.html

We'll have more details as we get closer to releasing 1.13.

Kevin

[Filipe Morgado]

Looks awesome :)

[Don Olmstead]

What would a function end up looking like? Like setting window.onload
without using addEventListener?

Post by Filipe Morgado
Looks awesome :)
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[Daniel Joyce]

How well does this interop work with functions taking disparate types in
javascript? Typescript supports union types to resolve the issue

Post by Don Olmstead
What would a function end up looking like? Like setting window.onload
without using addEventListener?

Post by Filipe Morgado
Looks awesome :)
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
Daniel Joyce

The meek shall inherit the Earth, for the brave will be among the stars.

['Jacob Richman' via Dart Misc]

Currently you will need to omit types for functions taking disparate types
in JavaScript. We've discussed specifying union types via annotations to
improve tooling support for this case.

Post by Daniel Joyce
How well does this interop work with functions taking disparate types in
javascript? Typescript supports union types to resolve the issue

Post by Don Olmstead
What would a function end up looking like? Like setting window.onload
without using addEventListener?

Post by Filipe Morgado
Looks awesome :)
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
Daniel Joyce
The meek shall inherit the Earth, for the brave will be among the stars.
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

['Jacob Richman' via Dart Misc]

After you call allowInterop on a Dart function, you have a JavaScript
function that can be used anywhere a JavaScript function would be used.

Example:

import 'package:js/js.dart';

@Js()
set onload(Function callback);

void exampleListener(Event e) {
print("Event $e");
}

void main() {
onload = allowInterop(exampleListener);
}

If you want to pass Dart functions to JavaScript you must first call:
allowInterop(yourDartFunction)

which will create a JavaScript function from your Dart function. The
JavaScript function can then be invoked from either Dart or JavaScript with
minimal limitations.

Limitations:
1. You cannot pass named arguments to the function.
2. Dart zones support is unspecified if the function is called
asynchronously from JavaScript.

Both of these limitations may be lifted in the future. For example, if
Dart2Js were to support zones via a JavaScript polyfill script similar to
how Angular supports zones, you could still get full zone support while
using JavasScript interop.

Post by Don Olmstead
What would a function end up looking like? Like setting window.onload
without using addEventListener?

Post by Filipe Morgado
Looks awesome :)
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[Günter Zöchbauer]

Post by Kevin Moore
I did a write-up on my "work" blog: http://work.j832.com/2015/10/byojsl.html
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30)
Works great so far

['Kathy Walrath' via Dart Misc]

The URL GÃŒnter posted didn't work for me, but this one does:
http://stackoverflow.com/questions/tagged/dart-js-interop

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html

Post by Kevin Moore
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at
http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30
)
Works great so far
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[Don Olmstead]

So it should just be a Function? Assuming it is typed then could it be a
typedef or is that not currently working?

On Mon, Oct 19, 2015 at 11:01 AM, 'Kathy Walrath' via Dart Misc <

Post by 'Kathy Walrath' via Dart Misc
http://stackoverflow.com/questions/tagged/dart-js-interop

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html

Post by Kevin Moore
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at
http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30
)
Works great so far
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

['Jacob Richman' via Dart Misc]

Giving the callback a more specific type is also fine. For example, you
could give the callback a more specific type. For example:

import 'package:js/js.dart';

typedef JsEventListener(Event e);

@Js()
set onload(JsEventListener callback);

void exampleListener(Event e) {
print("Event $e");
}

void main() {
onload = allowInterop(exampleListener);
}

Keep in mind, types you specify for functions returned from JavaScript are
purely for static analysis and won't have an impact on runtime behavior.

Post by Don Olmstead
So it should just be a Function? Assuming it is typed then could it be a
typedef or is that not currently working?
On Mon, Oct 19, 2015 at 11:01 AM, 'Kathy Walrath' via Dart Misc <

Post by 'Kathy Walrath' via Dart Misc
http://stackoverflow.com/questions/tagged/dart-js-interop

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html

Post by Kevin Moore
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at
http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30
)
Works great so far
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[Don Olmstead]

Is there any way to rename a field on the Dart side? Have an onmessage
field that would be nice to transform into onMessage on the dart side.

On Mon, Oct 19, 2015 at 11:33 AM, 'Jacob Richman' via Dart Misc <

Post by 'Jacob Richman' via Dart Misc
Giving the callback a more specific type is also fine. For example, you
import 'package:js/js.dart';
typedef JsEventListener(Event e);
@Js()
set onload(JsEventListener callback);
void exampleListener(Event e) {
print("Event $e");
}
void main() {
onload = allowInterop(exampleListener);
}
Keep in mind, types you specify for functions returned from JavaScript are
purely for static analysis and won't have an impact on runtime behavior.

Post by Don Olmstead
So it should just be a Function? Assuming it is typed then could it be a
typedef or is that not currently working?
On Mon, Oct 19, 2015 at 11:01 AM, 'Kathy Walrath' via Dart Misc <

Post by 'Kathy Walrath' via Dart Misc
http://stackoverflow.com/questions/tagged/dart-js-interop

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html

Post by Kevin Moore
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at
http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30
)
Works great so far
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

['Jacob Richman' via Dart Misc]

By design there is no way to rename a field on the Dart side.
The problem is allowing renaming fields on the Dart side would have
significant code size and performance costs in dart2js.

Post by Don Olmstead
Is there any way to rename a field on the Dart side? Have an onmessage
field that would be nice to transform into onMessage on the dart side.
On Mon, Oct 19, 2015 at 11:33 AM, 'Jacob Richman' via Dart Misc <

Post by 'Jacob Richman' via Dart Misc
Giving the callback a more specific type is also fine. For example, you
import 'package:js/js.dart';
typedef JsEventListener(Event e);
@Js()
set onload(JsEventListener callback);
void exampleListener(Event e) {
print("Event $e");
}
void main() {
onload = allowInterop(exampleListener);
}
Keep in mind, types you specify for functions returned from JavaScript
are purely for static analysis and won't have an impact on runtime behavior.

Post by Don Olmstead
So it should just be a Function? Assuming it is typed then could it be a
typedef or is that not currently working?
On Mon, Oct 19, 2015 at 11:01 AM, 'Kathy Walrath' via Dart Misc <

Post by 'Kathy Walrath' via Dart Misc
http://stackoverflow.com/questions/tagged/dart-js-interop

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html

Post by Kevin Moore
We'll have more details as we get closer to releasing 1.13.

Kevin

I tried a few things (posted at
http://stackoverflow.com/questions/new/dart-js-interop?show=all&sort=recentlyactive&pageSize=30
)
Works great so far
--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to
http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[John Ryan]

I've been working on bindings for d3: https://github.com/johnpryan/d3dart

a few initial things I've noticed are:

- JS libraries with variable arguments can't be expressed properly (i.e.
func([p1, p2, p3, p]))
- occasionally functions will have optional parameters, but the order is
reversed (i.e. func(int p1) and func(double p2, int p1))
- Union types would be nice to have here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L424>
and here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L1514>

I'm also curious: since it's somewhat tricky to write these, would it be
possible to make a tool that (mostly) converts typescript definition files
to Dart?

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html
<http://www.google.com/url?q=http%3A%2F%2Fwork.j832.com%2F2015%2F10%2Fbyojsl.html&sa=D&sntz=1&usg=AFQjCNGn6C3sekyUsyqkp04GEHoE71eZAw>
We'll have more details as we get closer to releasing 1.13.

Kevin

['Jacob Richman' via Dart Misc]

I'm working on an automated tool to convert d.ts files to dart integrated
in with the ts2dart tool used by Angular2.
Agreed that method overloads and union types would be extremely useful at
the js-interop boundary. I'll be investigating supporting it with
annotations similar to how generic method support is being prototyped in
the dev compiler using annotations.

Post by John Ryan
I've been working on bindings for d3: https://github.com/johnpryan/d3dart
- JS libraries with variable arguments can't be expressed properly
(i.e. func([p1, p2, p3, p]))
- occasionally functions will have optional parameters, but the order
is reversed (i.e. func(int p1) and func(double p2, int p1))
- Union types would be nice to have here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L424>
and here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L1514>
I'm also curious: since it's somewhat tricky to write these, would it be
possible to make a tool that (mostly) converts typescript definition files
to Dart?

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html
<http://www.google.com/url?q=http%3A%2F%2Fwork.j832.com%2F2015%2F10%2Fbyojsl.html&sa=D&sntz=1&usg=AFQjCNGn6C3sekyUsyqkp04GEHoE71eZAw>
We'll have more details as we get closer to releasing 1.13.

Kevin

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new
To unsubscribe from this group and stop receiving emails from it, send an

[Don Olmstead]

Ok not a big deal. Thought it would be something supported since it seemed
to work for classes without issue.

[Don Olmstead]

Is there a listing of browsers this is tested against? I'm having an issue
with a browser thats roughly safari 7.

If I attempt to call the function through the console I get that its not a
function, so window.navigator.foo.onmessage. But I can call it directly if
I do, window.navigator.foo.onmessage.call$1.

Post by Don Olmstead
Ok not a big deal. Thought it would be something supported since it seemed
to work for classes without issue.

['Kevin Moore' via Dart Misc]

Post by John Ryan
I've been working on bindings for d3: https://github.com/johnpryan/d3dart
- JS libraries with variable arguments can't be expressed properly
(i.e. func([p1, p2, p3, p]))
- occasionally functions will have optional parameters, but the order
is reversed (i.e. func(int p1) and func(double p2, int p1))
- Union types would be nice to have here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L424>
and here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L1514>
I'm also curious: since it's somewhat tricky to write these, would it be
possible to make a tool that (mostly) converts typescript definition files
to Dart?

We're working on exactly that!

Post by John Ryan

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html
<http://www.google.com/url?q=http%3A%2F%2Fwork.j832.com%2F2015%2F10%2Fbyojsl.html&sa=D&sntz=1&usg=AFQjCNGn6C3sekyUsyqkp04GEHoE71eZAw>
We'll have more details as we get closer to releasing 1.13.

Kevin

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new

['Kevin Moore' via Dart Misc]

Post by John Ryan
I've been working on bindings for d3: https://github.com/johnpryan/d3dart
- JS libraries with variable arguments can't be expressed properly
(i.e. func([p1, p2, p3, p]))
- occasionally functions will have optional parameters, but the order
is reversed (i.e. func(int p1) and func(double p2, int p1))
- Union types would be nice to have here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L424>
and here
<https://github.com/borisyankov/DefinitelyTyped/blob/master/d3/d3.d.ts#L1514>
John: make sure you open (or subscribe to) issues for these things
I'm also curious: since it's somewhat tricky to write these, would it be
possible to make a tool that (mostly) converts typescript definition files
to Dart?

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html
<http://www.google.com/url?q=http%3A%2F%2Fwork.j832.com%2F2015%2F10%2Fbyojsl.html&sa=D&sntz=1&usg=AFQjCNGn6C3sekyUsyqkp04GEHoE71eZAw>
We'll have more details as we get closer to releasing 1.13.

Kevin

--
For other discussions, see https://groups.google.com/a/dartlang.org/
For HOWTO questions, visit http://stackoverflow.com/tags/dart
To file a bug report or feature request, go to http://www.dartbug.com/new

[Kevin Moore]

If you'd like to track our work on tools to auto-generate JS-interop
facades from TypeScript, subscribe to this issue on GitHub
<https://github.com/dart-lang/sdk/issues/24874>.

Post by Kevin Moore
http://work.j832.com/2015/10/byojsl.html
We'll have more details as we get closer to releasing 1.13.

Kevin