Angular Dart with Polymer and Service-Worker incompatibilty - angularjs

Question

I'm currently trying to build a web app compatible with the Google Progressive Web Apps specs. To do this i use Angular with Dart and Polymer based Webcomponents instead of the Angular components. So far everything works as expected. To make the app offline capable utilizing the Service-Worker API i use the following dart lib: https://github.com/isoos/service_worker
Using either Polymer or Service-Worker works fine but combining booth just exits with an error on app startup.
This is my AppComponent startup routine:
// ... other imports
import 'package:service_worker/window.dart' as sw; // <-- import alone causes the error
Future main() async {
await initPolymer(); // <-- causes the error in combination with the import above
bootstrap(AppComponent);
if (sw.isNotSupported) {
print('ServiceWorkers are not supported.');
return;
}
//... initializing service worker
}
The error occurs even if i'm not initializing the Service-Worker, importing the Service-Worker module is enough to cause the error.
Building the app works without any errors.
I'm new to Dart and the Polymer and Angular eco systems and the error message i get is not very helpful to me:
Uncaught Error: NoSuchMethodError: method not found: js_helper.dart:1742 'h' (J.Q(...).h is not a function)
at Object.J.H (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:9747:15)
at http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:10559:1584
at Isolate.e.(anonymous function) (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:10608:15)
at Object.yK (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:9291:22)
at http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:9282:10
at yM.a (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:2612:72)
at yM.dart.yM.$2 (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:2828:24)
at y9.dart.y9.$1 (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:2824:31)
at xM.bi (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:3767:40)
at xk.$0 (http://127.0.0.1:8080/index.bootstrap.initialize.dart.js:3167:16)
Can you give me a hint what could cause the error and how to fix it? I would very much like to use the Polymer components instead of the plain Angular components but i need the Service-Worker for offline caching support.

Answer 1

This looks like an issue caused by incompatibility between dart:js (the old style, used by the original polymer package) and package:js (the new style, used by all new packages, including package:service_worker).
You might want to have a look at the polymerize project, which brings Polymer via the new-style interop. Then you'll have no conflict.