From c8104a29ecfd5685fb2e7738b85e654377ffb323 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Date: Thu, 30 May 2019 12:36:54 -0400
Subject: [PATCH] feat(toast): allow html content (#18423)

---
 core/src/components/toast/test/basic/e2e.ts     | 8 ++++++++
 core/src/components/toast/test/basic/index.html | 4 ++++
 core/src/components/toast/toast.tsx             | 3 ++-
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/core/src/components/toast/test/basic/e2e.ts b/core/src/components/toast/test/basic/e2e.ts
index 247c84efec..8044981dd0 100644
--- a/core/src/components/toast/test/basic/e2e.ts
+++ b/core/src/components/toast/test/basic/e2e.ts
@@ -46,6 +46,10 @@ test('toast: start end position', async () => {
   await testToast(DIRECTORY, '#toast-start-and-end');
 });
 
+test('toast: html', async () => {
+  await testToast(DIRECTORY, '#toast-html');
+});
+
 /**
  * RTL Tests
  */
@@ -93,3 +97,7 @@ test('toast:rtl: basic, custom class', async () => {
 test('toast:rtl: start end position', async () => {
   await testToast(DIRECTORY, '#toast-start-and-end', true);
 });
+
+test('toast:rtl: html', async () => {
+  await testToast(DIRECTORY, '#toast-html', true);
+});
diff --git a/core/src/components/toast/test/basic/index.html b/core/src/components/toast/test/basic/index.html
index 522a4c5102..5ddbca03b4 100644
--- a/core/src/components/toast/test/basic/index.html
+++ b/core/src/components/toast/test/basic/index.html
@@ -71,6 +71,10 @@
       <ion-button expand="block" id="toast-start-and-end" onclick="presentToastWithOptions({message: 'click to close', showCloseButton: true, cssClass: 'toast-start-and-end'})">
         Show Toast with start-end position
       </ion-button>
+      
+      <ion-button expand="block" id="toast-html" onclick="presentToastWithOptions({message: '<ion-button>Button in a Toast!</ion-button>', showCloseButton: true})">
+        Show HTML Toast
+      </ion-button>
 
       <ion-toast-controller></ion-toast-controller>
 
diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx
index b6029b409b..b30594c9dc 100644
--- a/core/src/components/toast/toast.tsx
+++ b/core/src/components/toast/toast.tsx
@@ -2,6 +2,7 @@ import { Component, ComponentInterface, Element, Event, EventEmitter, Method, Pr
 
 import { Animation, AnimationBuilder, Color, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface, ToastButton } from '../../interface';
 import { dismiss, eventMethod, isCancel, present } from '../../utils/overlays';
+import { sanitizeDOMString } from '../../utils/sanitization';
 import { createColorClasses, getClassMap } from '../../utils/theme';
 
 import { iosEnterAnimation } from './animations/ios.enter';
@@ -290,7 +291,7 @@ export class Toast implements ComponentInterface, OverlayInterface {
               <div class="toast-header">{this.header}</div>
             }
             {this.message !== undefined &&
-              <div class="toast-message">{this.message}</div>
+              <div class="toast-message" innerHTML={sanitizeDOMString(this.message)}></div>
             }
           </div>