Works like a charm. Thanks for the help @ Justin, John, Rob & Erik - much appreciated.
This is the final version that worked for me (for the full example see the StackOverflow answer <http://stackoverflow.com/a/25056720/837709>): bool isActive() { var passwordField = $['password-field']; var activeElement = js.context.callMethod('wrap', [document.activeElement ]); // For Browsers with shadow DOM support the shadowRoot.host matches while // for Browsers without shadow DOM support the password field match. if (activeElement.hashCode != hashCode && activeElement.hashCode != passwordField.hashCode) { return false; } else { return true; } } On Thursday, July 24, 2014 10:08:50 PM UTC+2, Erik Arvidsson wrote: > > Rob is right. platform.js adds global wrap and unwrap functions that are > noops if the browser supports native shadow dom. > > > On Thu, Jul 24, 2014 at 3:36 PM, 'Rob Dodson' via Polymer < > [email protected] <javascript:>> wrote: > >> I think on the PolymerJS side you don't need to include ShadowDOMPolyfill >> in the call. You should be able to just call wrap(document.activeElement) >> >> >> On Thu, Jul 24, 2014 at 12:12 PM, 'John Messerly' via Polymer < >> [email protected] <javascript:>> wrote: >> >>> Shadow DOM polyfill can't wrap accessors directly on document, so that's >>> why `document.activeElement` doesn't work. Things like `document.head` have >>> the same problem, see [1]. The usual answer is to introduce a querySelector >>> or some other method call, which kicks in the polyfill. Or you can call: >>> >>> ShadowDOMPolyfill.wrap(document.activeElement) >>> >>> >>> Calling that method from Dart would involve JS interop. I'm not an >>> expert there, but maybe something like: >>> >>> // might need a `new JsObject.fromBrowserObject()` around the method >>> arg, not sure >>> >>> context['ShadowDOMPolyfill'].callMethod('wrap', >>> [document.activeElement]); >>> >>> >>> >>> [1]: documented here >>> https://github.com/Polymer/ShadowDOM#wrap-and-unwrap >>> >>> >>> >>> On Thu, Jul 24, 2014 at 8:39 AM, Justin Fagnani <[email protected] >>> <javascript:>> wrote: >>> >>>> [email protected] <javascript:>, John >>>> On Jul 24, 2014 8:20 AM, "Nik Graf" <[email protected] <javascript:>> >>>> wrote: >>>> >>>>> I would like to identify if my component is still the active element >>>>> after a blur event. >>>>> >>>>> Here example code & a use-case to provide more Context: >>>>> >>>>> <polymer-element name="b-secret"> >>>>> <template> >>>>> <div>Other things here</div> >>>>> <input id="password-field" type="password" value="{{value}}"> >>>>> </template> >>>>> <script type="application/dart" src="secret.dart"></script> >>>>> </polymer-element> >>>>> >>>>> A user clicks on a custom input element (b-secret). If you call >>>>> document.activeElement you will get the custom element (b-secret) for >>>>> Browsers supporting ShadowDOM. In Firefox (no ShadowDOM support) for >>>>> example you will get the actual input element (#password-field) inside >>>>> your >>>>> component. >>>>> >>>>> While I guess fixing document.activeElement is not really possible I >>>>> would expected shadowRoot.querySelector('#password-field').hashCode to be >>>>> the same as document.activeElement.hashCode. >>>>> >>>>> I investigate a bit and recognized that the ShadowDOM shim creates a >>>>> wrapper object for the queried input field when compiled to JavaScript. >>>>> The >>>>> wrapper object is aware of the field's hashCode I'm looking for, but I >>>>> can't access it through Dart. See the annotated Screenshot: >>>>> http://cl.ly/image/3F2b1l343O43 >>>>> >>>>> You can find the real world example here: >>>>> https://github.com/blossom/bee/blob/secret-ff-fix/lib/components/secret/secret.dart#L100 >>>>> >>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>> --- >>>>> You received this message because you are subscribed to the Google >>>>> Groups "Polymer" group. >>>>> To unsubscribe from this group and stop receiving emails from it, send >>>>> an email to [email protected] <javascript:>. >>>>> To view this discussion on the web visit >>>>> https://groups.google.com/d/msgid/polymer-dev/d7a1192a-4520-4b0d-869f-88c8f524e841%40googlegroups.com >>>>> >>>>> <https://groups.google.com/d/msgid/polymer-dev/d7a1192a-4520-4b0d-869f-88c8f524e841%40googlegroups.com?utm_medium=email&utm_source=footer> >>>>> . >>>>> For more options, visit https://groups.google.com/d/optout. >>>>> >>>> >>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>> --- >>> You received this message because you are subscribed to the Google >>> Groups "Polymer" group. >>> To unsubscribe from this group and stop receiving emails from it, send >>> an email to [email protected] <javascript:>. >>> To view this discussion on the web visit >>> https://groups.google.com/d/msgid/polymer-dev/CAJup4OXw7xwUt5TjB6sodnT6JKV%2B7SKUavK%3Ds25S_goaUza0BQ%40mail.gmail.com >>> >>> <https://groups.google.com/d/msgid/polymer-dev/CAJup4OXw7xwUt5TjB6sodnT6JKV%2B7SKUavK%3Ds25S_goaUza0BQ%40mail.gmail.com?utm_medium=email&utm_source=footer> >>> . >>> >>> For more options, visit https://groups.google.com/d/optout. >>> >> >> Follow Polymer on Google+: plus.google.com/107187849809354688692 >> --- >> You received this message because you are subscribed to the Google Groups >> "Polymer" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected] <javascript:>. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/polymer-dev/CAJj5OwCUOQqfJYhaPafZZbaf6pJCGHcBVguYFnKAdLdNUKCSCg%40mail.gmail.com >> >> <https://groups.google.com/d/msgid/polymer-dev/CAJj5OwCUOQqfJYhaPafZZbaf6pJCGHcBVguYFnKAdLdNUKCSCg%40mail.gmail.com?utm_medium=email&utm_source=footer> >> . >> >> For more options, visit https://groups.google.com/d/optout. >> > > > > -- > erik > > > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/6932cba0-ead2-4c7c-a657-d2cbecac813c%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
