Having an issue trying to convert an async function about sdk HOT 5 CLOSED

Thank you, @srujzs! This is incredibly helpful.

from sdk.

Labels: area-web, type-bug
Summary: The user is encountering a "TypeError: T[_eval] is not a function" error when using the js package to convert an async function with four parameters, including a complete callback, from JavaScript to Dart. The issue arises when calling the complete function within the Dart code, while the JavaScript version works correctly.

from sdk.

That error looks like it's related to the RTI, but is general enough that it's hard to tell where the error is coming from. Is there a simple repro/your Dart code you can add here?

One thing that I suspect may be an issue (although may not be the current issue) is that with JS, the async function returns a Promise, whereas with a Dart async function, it returns a Future<void>. Any code that assumes that that function returns a Promise might not work. Converting the resulting Future<void> to a JSPromise using dart:js_interop's toJS could work, but I'd need to see the code to figure out where that should go.

from sdk.

@srujzs Thanks for the response. I checked the scenario with toJS but didn't seem to work. I published this repo with minimal code to test it out.

from sdk.

Thanks for the repro! It does look related to converting Futures back and forth. I mentioned how a Dart async function returns a Future that needs to be converted to a Promise, but a JS async function also returns a Promise that needs to be converted to a Future so you can use it in Dart. Here's how I'd patch your repro with dart:js_interop:

diff --git a/lib/js_helper.dart b/lib/js_helper.dart
index a4e6555..6b69429 100644
--- a/lib/js_helper.dart
+++ b/lib/js_helper.dart
@@ -1,11 +1,7 @@
 @JS()
 library nuvo;

-import 'package:js/js.dart';
+import 'dart:js_interop';

 @JS()
-external dynamic testJS(
-  Function(
-    String text,
-  ) onResults,
-);
+external JSPromise<JSAny?> testJS(JSExportedDartFunction onResults);
diff --git a/lib/main.dart b/lib/main.dart
index 82ba815..c52f1d0 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -1,11 +1,17 @@
+import 'dart:js_interop';
+
 import 'package:flutter/material.dart';
-import 'package:js/js.dart';
 import 'package:js_testing/js_helper.dart';

 void main() {
   runApp(const MainApp());
 }

+JSPromise<JSString> func(String text) =>
+    Future<JSString>.delayed(const Duration(seconds: 1), () {
+      return text.toJS;
+    }).toJS;
+
 class MainApp extends StatelessWidget {
   const MainApp({super.key});

@@ -16,14 +22,7 @@ class MainApp extends StatelessWidget {
         body: Center(
           child: TextButton(
             onPressed: () {
-              testJS(
-                allowInterop(
-                  (text) async {
-                    Future.delayed(const Duration(seconds: 1));
-                    return text;
-                  },
-                ),
-              );
+              testJS(func.toJS).toDart;
             },
             child: const Text('Test'),
           ),

A few things worth noting:

• JSPromise represents a JS Promise. It is generic, and its type parameter is bound to JSAny?. Since your Future resolves with a String, the result needs to be converted to a type that extends JSAny?, which is just JSString. You can do that with toJS.
• toJS allows you to convert a Dart Future to a JS Promise. This was not provided with package:js, but you could write this yourself using interop (which the dart:js_interop implementation does).
• toDart allows you to convert a JS Promise to a Dart Future. This is similar to promiseToFuture from package:js/dart:js_util.

You can read more on the specifics here: https://dart.dev/interop/js-interop/js-types.

With the above changes, test is printed to the console.

from sdk.