Cannot querySelector in my Polymer component

dart, dart-polymer

Solution

When you use `querySelector("#my-dropdown")` you are using the top level function querySelector. This function search in the main document and not inside the ShadowDOMs of the polymer elements.

In your case you should use `shadowRoot.querySelector('#my-dropdown')` or `$['my-dropdown']` (it's a shortcut) to get the element you are querying.

Problem

I'm trying to access to a part of my component by querySelector, but it return null. My html in my component looks like : ``` <nav class="mainmenu"> <div class="container"> <div class="dropdown" id="my-dropdown"> ``` The reason I want to access this, is because, I want to change classes in certains conditions when user click somewhere in body. ``` void ready(){ document.body.onClick.listen((E) { if(_isActive){ querySelector("#my-dropdown"); ``` the querySelector always retun null. Why ? I understand shadow dom forgive me to access in other dom component, but why in the same component ? How can I access to it ? Or maybe I should process differently ?

Original source