Checkbox - Ripple radius is too big

[Havret]

Ripple radius for the checkbox is too big.

Expected:

Actual:

[Havret]

https://github.com/material-components/material-components-web/pull/2216

[englishextra]

I have solved that via setTimeout. Though I understand the problem lies in Element.getBoundingClientRect() which has always been quite tricky

var rippleTimer;
var rippleHandler = function(){
    clearTimeout(rippleTimer);
    [].forEach.call(document.getElementsByClassName("mdc-button"), function(surface) {
        mdc.ripple.MDCRipple.attachTo(surface);
    });
    [].forEach.call(document.getElementsByClassName("mdc-icon-toggle"), function(iconToggle) {
        mdc.iconToggle.MDCIconToggle.attachTo(iconToggle);
    });
    [].forEach.call(document.getElementsByClassName("mdc-ripple-surface"), function(surface) {
        mdc.ripple.MDCRipple.attachTo(surface);
    });
    [].forEach.call(document.getElementsByClassName("mdc-card__primary-action"), function(el) {
        mdc.ripple.MDCRipple.attachTo(el);
    });
};
rippleTimer = setTimeout(rippleHandler, 400);