Search code examples
dartdart-polymer

Polymer querySelector working on DartVM but not in Chrome after compile


Having a weird issue. In my Dart code I have some polymer components on the screen and one of them has a method I call from my main().

I grab a reference to it by doing

PolyComp poly = querySelector("#idOfPolymer");
poly.flash();

This works perfectly in dart. The page loads up and PolyComp starts to flash. However when I run this in Chrome by running Build Polymer app from the Dart IDE, I get an error that says cannot call flash() on null.

I ended up making it flash by just using an event bus and letting PolyComp listen to my event, but this is overkill.

What am I doing wrong? This happens in the latest Chrome, Firefox and Safari.

Edit:

I built the following polymer app to JS also and ran into the same issue. https://github.com/sethladd/dart-polymer-dart-examples/blob/master/web/todo_element/todo.html

Works on DartVM, not in Chrome because its calling a method on a null element.


Solution

  • When you run this code from the main() method it is probably a timing issue. You can try something like

    import "package:polymer/polymer.dart";
    
    main() {
      initPolymer().run(() {
        // code here works most of the time
        Polymer.onReady.then((e) {     
          // some things must wait until onReady callback is called
        });
      });
    }
    

    see also how to implement a main function in polymer apps