diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx
index cd15330b32..0abf142385 100644
--- a/core/src/components/toast/toast.tsx
+++ b/core/src/components/toast/toast.tsx
@@ -191,7 +191,7 @@ export class Toast implements ComponentInterface, OverlayInterface {
     }
     const shouldDismiss = await this.callButtonHandler(button);
     if (shouldDismiss) {
-      return this.dismiss(undefined, button.role);
+      return this.dismiss(undefined, role);
     }
     return Promise.resolve();
   }
@@ -213,6 +213,14 @@ export class Toast implements ComponentInterface, OverlayInterface {
     return true;
   }
 
+  private dispatchCancelHandler = (ev: CustomEvent) => {
+    const role = ev.detail.role;
+    if (isCancel(role)) {
+      const cancelButton = this.getButtons().find(b => b.role === 'cancel');
+      this.callButtonHandler(cancelButton);
+    }
+  }
+
   renderButtons(buttons: ToastButton[], side: 'start' | 'end') {
     if (buttons.length === 0) {
       return;
@@ -265,6 +273,7 @@ export class Toast implements ComponentInterface, OverlayInterface {
           ...getClassMap(this.cssClass),
           'toast-translucent': this.translucent
         }}
+        onIonToastWillDismiss={this.dispatchCancelHandler}
       >
         <div class={wrapperClass}>
           <div class="toast-container">