mdSelect: virtual scroller messes with FB & Google SDKs

[ngraef]

Demo

I am using the Facebook and Google login SDKs loaded via javascript. When loaded, they each create a DOM node on body (FB creates <div id="fb-root"> and Google creates <iframe id="oauth2relayXXXXXXXXX">).

The new virtual scroller for mdSelect moves these nodes into a container when the select is activated, and moves them back to the body when closed. It looks as though this movement triggers something in the SDKs that causes them to reload. This can be observed in the network activity and console output.

The functionality isn't broken; however, in my fully-configured app (i.e. with SDK client IDs added), each open and close of the select triggers 10 network requests: 8 get fulfilled from cache and 2 are ~100ms pings to FB.

@rschmukler - any thoughts on a way around this?

[rschmukler]

@ngraef as a temporary work around, you can probably put a root level md-content in your body and nest everything inside of that. I'll look into something possibly better....

[ngraef]

@rschmukler hmm that only works if the md-content has enough content to scroll.

[ngraef]

Related: #2456

[rschmukler]

@ngraef upon further thinking, I think the wrapper md-content is the best approach. The alternative would be some sort of white listing, but I feel like that either requires more work from the user (a call to some sort of provider for every external lib/div id added).

I've made it so that the outer most md-content will be used, provided that the body itself isn't scrolling. Let me know if this doesn't work for you.

[ngraef]

Yup, that works. Thanks, @rschmukler !