Rikulo Bootjack + PolymerDart

Question

I'm trying to use the excellent Bootjack library with PolymerDart, and although the CSS theming is working, the dart code isn't executing in the Polymer component.

I've created a dead simple test showing the problem. You'll see the raw html version works fine, but the shadow DOM version doesn't.

Here is the gist. Just download as a zip, it has everything to not work ;)

Any help would be greatly appreciated.

-- Update -- After TinyFox's advice of directly wiring up the control, it now half works. I've updated the gist with the change.

-- Shane

Answer 1

The code is not executed because the way you include the main.dart file is outdated.

use

<script type="application/dart">export "main.dart";</script>

The dropdown still doesn't work probably because

..on('click.bs.dropdown.data-api', _toggleEvent, selector: _TOGGLE_SELECTOR)

in packages/bootjack/src/dropdown.dart where _TOGGLE_SELECTOR is (same file)

static const String _TOGGLE_SELECTOR ='[data-toggle=dropdown]';

isn't working as expected. I guess the selector doesn't find elements inside a polymer element even if you have set applyAuthorStyles to true.

Answer 2

zoechi's answer and my comment explains the possible cause of the problem.

To work it around, you can try to wire the element manually inside your shadow DOM, and it should be able to handle the click event by itself.