google / google/material-design-lite

Toggle components not fully upgraded for ripple effect

Open
#1,835 1 comment 2 reactions 0 assignees View on GitHub
Component Handler
Dominant language
HTML
Stars
32.2k
Forks
4.9k
PR merge metrics
No merged PRs in 30d

Description

When switches, radio buttons and checkboxes are upgraded using the `componentHandler`, the internal `__ripple-container` is not upgraded and the ripple is not effected when the toggle is clicked. There is a copdepen [here](http://codepen.io/cartant/pen/XmYqLd) that puts statically-created and dynamically-created toggles side by side.

With the statically-created switch, the `mdl-switch__ripple-container` looks like this:

``

And with the dynamically-created switch, like this:

``

The dynamically-created switch's `label` contains this attribute:

`data-upgraded=",MaterialSwitch,MaterialRipple"`

suggesting that the switch component has been upgraded for the ripple effect, but without the internal `mdl-switch__ripple-container` being upgraded, too, there'll be no ripple effect.

Note that explicitly upgrading the `mdl-switch__ripple-container` using the `componentHandler` results in the expected behaviour, but that should not be necessary: the `componentHandler` should fully upgrade the component.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.