MDL Ripple component is created/initialized before custom component.

MDL version: 1.1.2
Browser: Chrome
Browser version: 48.0.2564.103 (64-bit)
Operating system: OS-X
Operating system version: 10.11.3
URL: NA
What steps will reproduce the problem:

 1. I'm trying to write an MDL-component with ripple effect on child elements, similar to the MDL tabs component. The problem I am experiencing is that it seems as if MaterialRipple is initialized before I get the chance to add the `mdl-js-ripple-effect--ignore-events` class, and thus prevent the triggered ripple events to fire for the container.

It may be that this is not an issue, but rather something I've missed when it comes to developing MDL components.

 2. Html to support component

``` html

A basic MDL component

```

 3. The stripped down component:

``` javascript
(function() {
'use strict';

const MaterialBasic = function MaterialBasic(element) {
// Stores the element.
this.element_ = element;

console.log(this.element_.classList, 'data-upgraded', this.element_.getAttribute('data-upgraded'));

// Initialize instance.
this.init();
};
window['MaterialBasic'] = MaterialBasic;

MaterialBasic.prototype.Constant_ = {
RIPPLE_COMPONENT: 'MaterialRipple'
};

MaterialBasic.prototype.CssClasses_ = {
IS_UPGRADED: 'is-upgraded',
JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'
};

MaterialBasic.prototype.init = function() {
if (this.element_) {
if (this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
// Ignore ripple event on this container
this.element_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT_IGNORE_EVENTS);
}

// Do the init required for this component to work

// Set upgraded flag
this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
}
};

// The component registers itself. It can assume componentHandler is available
// in the global scope.
/* eslint no-undef: 0 */
componentHandler.register({
constructor: MaterialBasic,
classAsString: 'MaterialBasic',
cssClass: 'mdl-js-basic'
});
})();
```

What is the expected result?
Ripple event should not fire on container

What happens instead of that?
Ripple event fires and throws an error: "Uncaught TypeError: Cannot read property 'classList' of null"

If I add the class `mdl-js-ripple-effect--ignore-events` in markup everything works as expected.

I would expect that my component was initialized before the MDL Ripple component, but it does not seem to happen. Is there a known workaround for this?

Regards
Leif Olsen