Search code examples
dartdart2jsdart-js-interop

Issue building project with JavaScript APIs


Whenever I serve my project with the --release options or I build it, and run it on the webpage, I'm getting this errors console, and some features won't work, using the dartdevc compiler all the functions works fine.

For example this happens when I click a button:

jquery-3.3.1.slim.min.js:2 Uncaught TypeError: ((w.event.special[a.origType] || {}).handle || a.handler).apply is not a function
    at HTMLDivElement.dispatch (jquery-3.3.1.slim.min.js:2)
    at HTMLDivElement.v.handle (jquery-3.3.1.slim.min.js:2)
    at Object.trigger (jquery-3.3.1.slim.min.js:2)
    at HTMLDivElement.<anonymous> (jquery-3.3.1.slim.min.js:2)
    at Function.each (jquery-3.3.1.slim.min.js:2)
    at w.fn.init.each (jquery-3.3.1.slim.min.js:2)
    at w.fn.init.trigger (jquery-3.3.1.slim.min.js:2)
    at r.t.show (modal.js:117)
    at HTMLDivElement.<anonymous> (modal.js:515)
    at Function.each (jquery-3.3.1.slim.min.js:2)
dispatch @ jquery-3.3.1.slim.min.js:2
v.handle @ jquery-3.3.1.slim.min.js:2
trigger @ jquery-3.3.1.slim.min.js:2
(anonymous) @ jquery-3.3.1.slim.min.js:2
each @ jquery-3.3.1.slim.min.js:2
each @ jquery-3.3.1.slim.min.js:2
trigger @ jquery-3.3.1.slim.min.js:2
t.show @ modal.js:117
(anonymous) @ modal.js:515
each @ jquery-3.3.1.slim.min.js:2
each @ jquery-3.3.1.slim.min.js:2
r._jQueryInterface @ modal.js:498
cr @ index.dart.js:316
J.h4 @ index.dart.js:6202
dart.nN @ index.dart.js:6096
$1 @ index.dart.js:4961
m6 @ index.dart.js:980
(anonymous) @ index.dart.js:989

These are my js APIs called from Dart:

@JS()
library js_helper;

import 'package:js/js.dart';

@anonymous
@JS()
class SnackbarParams {
  external factory SnackbarParams({String text, String pos, String backgroundColor});

  external String get text;
  external String get pos;
  external String get backgroundColor;

}

@JS('Snackbar')
class Snackbar{
  external static void show(SnackbarParams obj);
}

@JS('\$')
external dynamic jQuery(query);

@JS()
@anonymous
class ModalElement {

  external dynamic modal(String call);
  external dynamic on(String event, Function callback);

}

@JS()
@anonymous
class jFormElement {
  external dynamic serialize();
}

And this should be the code that is creating this error: (jQuery('#loginModal') as ModalElement).modal('show');


Solution

  • At the end, the issue was in the on method, I needed to add allowInterop to the Function