jQuery plugins and Polymer elements

Question

I have attempted to wrap a couple of jQuery plugins in Polymer elements, but have so far had little success. For example the select2 plugin (troubles discussed here) and the

Answer 1

My question is are there any key gotchas when working with jQuery within a Polymer element that need to be considered?

Probably the biggest issue is going to be around Shadow DOM. When you place markup inside of the Shadow DOM it cannot be selected by jQuery. Many plugins assume that all of their content is available in the Light DOM so that can lead to all kinds of problems. Hopefully newer versions of jQuery will find ways to work with the Shadow DOM so this might become less of an issue.

And even more useful, are there good examples of successful Polymer elements that wrap jQuery plugins?

If you really want to work with a jQuery plugin and Polymer elements then it might be best to construct your jQuery plugins in the Light DOM and then pass them into your elements as <content>. Here's a jsbin example which constructs a Select2 element and passes it into a Polymer element so it can be displayed.