Vue-material: Ripple effect on button not working (even on your demo)

[laurensV]

The ripple effect on the buttons is not working. For every click on a button, the span.md-ripple-wave is added, but never removed, and there is no ripple effect. It also doens't work in your own example:

https://codesandbox.io/s/github/vuematerial/examples/tree/master/examples/login

Reproduce:

1. Go to https://codesandbox.io/s/github/vuematerial/examples/tree/master/examples/login
2. Click on the login button, no ripple effect.
3. You can also see in inspect element that a span element is added on every click, and never removed

I tested this in chrome and firefox on Linux, both have the same issue

[Grundmanis]

Same for me

[Grundmanis]

For ppl who have the same issue - I've just downgraded my vue version to "2.5" ..

  "dependencies": {
    "vue": "^2.5.22",
}

[rcosta-gcare]

This is so sad... we shouldn't be downgrading anything.

[CxdInitial]

I have met the same bug. It seems like transition component in the MdWave component didn't exist. So the hook bound to after-enter event on the transition component never got called.

//MdWave.vue
<template>
  <transition name="md-ripple" @after-enter="end">
    <span v-if="animating" />
  </transition>
</template>

I didn't import the whole library, if this matters.

import Vue from 'vue'
import MdField from 'vue-material/dist/components/MdField'
import MdButton from 'vue-material/dist/components/MdButton'
import App from './App.vue'
import router from './router/index'

Vue.use(MdField)
Vue.use(MdButton)
new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

[OneParishLukas]

Any updates on this? Would love to use in a project. Do I have to downgrade Vue for the ripple to work?

[F3LENYR]

I've the same problem.