From 46ac43a1c12294835500ec5dbc6cc41f637bebd2 Mon Sep 17 00:00:00 2001
From: Sebastien Tasson <sebastien.tasson@gmail.com>
Date: Sun, 29 Oct 2017 19:38:07 +0000
Subject: [PATCH] fix(dialog): footer ripple missing

---
 components/dialog/mdc-dialog.vue | 22 +++++++++++++++-------
 components/dialog/test.spec.js   |  8 +++++++-
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/components/dialog/mdc-dialog.vue b/components/dialog/mdc-dialog.vue
index f00c9fb0..05ea92b0 100644
--- a/components/dialog/mdc-dialog.vue
+++ b/components/dialog/mdc-dialog.vue
@@ -15,14 +15,14 @@
         <slot />
       </section>
       <footer class="mdc-dialog__footer">
-        <button ref="cancel" type="button" v-if="cancel"
-          class="mdc-button mdc-dialog__footer__button mdc-dialog__footer__button--cancel">
+        <mdcButton ref="cancel" v-if="cancel"
+          class="mdc-dialog__footer__button mdc-dialog__footer__button--cancel">
           {{ cancel }}
-        </button>
-        <button  ref="accept" type="button" 
-        class="mdc-button mdc-dialog__footer__button mdc-dialog__footer__button--accept">
+        </mdcButton>
+        <mdcButton  ref="accept"
+        class="mdc-dialog__footer__button mdc-dialog__footer__button--accept">
           {{ accept }}
-        </button>
+        </mdcButton>
       </footer>
     </div>
     <div class="mdc-dialog__backdrop"></div>
@@ -32,6 +32,7 @@
 <script>
 import MDCDialogFoundation from '@material/dialog/foundation'
 import { createFocusTrapInstance } from '@material/dialog/util'
+import {VueMDCButton} from '../button'
 
 export default {
   name: 'mdc-dialog',
@@ -42,6 +43,9 @@ export default {
     'scrollable': Boolean,
     'dark': Boolean
   },
+  components: {
+    mdcButton : VueMDCButton
+  },
   data () {
     return {
       classes: {
@@ -85,7 +89,11 @@ export default {
       notifyCancel: () => this.$emit('cancel'),
       trapFocusOnSurface: () => this.focusTrap.activate(),
       untrapFocusOnSurface: () => this.focusTrap.deactivate(),
-      isDialog: (el) => (this.$refs.surface === el)
+      isDialog: (el) => (this.$refs.surface === el),
+      layoutFooterRipples: () => {
+        this.$refs.accept.ripple.layout()
+        this.cancel && this.$refs.cancel.ripple.layout()
+      }
     })
 
     this.foundation.init()
diff --git a/components/dialog/test.spec.js b/components/dialog/test.spec.js
index bfe5c1ab..63315928 100644
--- a/components/dialog/test.spec.js
+++ b/components/dialog/test.spec.js
@@ -1,4 +1,10 @@
 import { pluginSanityCheck } from '../test-utils'
 import * as plugin from './index.js';
 
-pluginSanityCheck(__dirname, plugin)
+pluginSanityCheck(__dirname, plugin, {
+  VueMDCDialog : {
+    propsData: {
+      title: 'title'
+    }
+  }
+})