Sunday, April 13, 2014

No Debugging Polymer

It pains me to admit this, but most of my debugging in Polymer is done in the venerable print STDERR style. If something is not quite working, I add print / console.log statement at the last known point in the code that I know is behaving and work from there.

I have gotten a lot of mileage from this style of debugging over the years, but recently have grown fond of the Chrome (and Dart) debugger. That said, there is much event debugging in Polymer that would be simplified if I could just watch all events play out as they happen.

Which is exactly what the logging flags in Polymer would seem to do. There are also debug flags, but I am not clear what they do. I'll check that out after the logging flags.

First up, I replace the regular Polymer libraries with the development versions. In my application's bower.json, I normally depend on the regular Polymer library:
  "name": "mdv_example",
  // ...
  "dependencies": {
    "polymer": "Polymer/polymer"
So instead I manually install the development versions of Polymer and its associated platform with Bower:
$ bower install polymer=Polymer/polymer-dev platform=Polymer/platform-dev
bower polymer#*                 cached git://
bower polymer#*               validate 0.2.2 against git://*
bower platform#*                cached git://
bower platform#*              validate 0.2.2 against git://*
Then I fire up my application with some logging flags. It seems like this can be done within the application, in the URL, or on the script tag that loads the platform. I opt for the latter:
<script src="bower_components/platform/platform.js" debug log="watch,bind,ready"></script>
And, when I load my page…

I see nothing. There is no change in behavior or in the console log.

Looking at the installed bower_components I find that the original Polymer and platform packages remain unchanged. The -dev versions are installed alongside, but they have not replaced the original packages as I had expected. So I force the issue by removing the original and replacing them with the -dev versions:
$ cd bower_components
$ rm -rf platform
$ mv platform-dev platform
$ rm -rf polymer
$ mv polymer-dev polymer
And, with that, it still does not work. I see no debugging at all:

And I cannot figure this out. Am I missing something obvious or did this break? Hopefully some intrepid soul can point me in the right direction. Otherwise, print STDERR may continue to be my go-to solution.

Day #33


  1. Did you figure out how to debug Polymer apps when developing? I've started making a Polymer app and I'm having the same problem you describe so well here. It's really frustrating. :-/

    1. Sadly, I'm still using console.log as my primary debugging tool. Bummed that this still isn't fixed :(