upgradeElement does not apply ripple effect for element created after window.onload

[alextekartik]

I took the exact same sample from the getting started page. In the following sample, the ripple effect is applied when pressing the button

http://codepen.io/alextekartik/pen/oXqqEm

However, if I call the same code after window.onload, the ripple effect is not applied properly

http://codepen.io/alextekartik/pen/vORRdq

A sample that create 3 buttons the same way (one directly, one during onload and one after some delay) shows the same issue (only the first has the ripple effect:

http://codepen.io/alextekartik/pen/vORRvY

Is there any other initialization code needed or is this a bug?
(tested on chrome and firefox)

[Garbee]

@passy wow, looks like Issue #206 just got revived from the grave.

[Garbee]

Just assigning a plain bug label until some more effort can be put into this. I'm not sure where the problem is spawning from exactly, looks related to how the Component Handler is dealing with things, but also could be one or the other components directly have a bug in this instance.

[Garbee]

Reviewing the old issue, looks like the ripple component is the core cause. Need to handle failure better.

[xdissent]

I don't think it's ripple's fault, it's just that componentHandler.upgradeElement() doesn't work like you might expect. It only applies a single component to an element, ignoring the element's class names altogether. So if you want to dynamically create a button with ripple, you have to componentHandler.upgradeElement(el, 'MaterialButton') then componentHandler.upgradeElement(el, 'MaterialRipple'). The individual components do sometimes look at class names though, so you can get a weird state where the ripple is set up by a component (as seen in MaterialButton) but the ripple component is never applied.

So, since components do look at class names to determine their behaviour, I think componentHandler.upgradeElement() should simply take an element and determine the appropriate components to apply based on class names alone. I've pushed a (backwards compatible) fix here: #890

[waltercolindres]

+1

[sgomes]

I believe this was fixed with #1498, please reopen if not.