javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 08:09:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(toast): allow html content (#18423)

Browse Source
This commit is contained in:
Liam DeBeasi
2019-05-30 12:36:54 -04:00
committed by GitHub
parent 17ad73ace2
commit c8104a29ec
3 changed files with 14 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
core/src/components/toast/test/basic/e2e.ts
View File

@ -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);
});

4
core/src/components/toast/test/basic/index.html
View File

@ -72,6 +72,10 @@
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>
<ion-grid>

3
core/src/components/toast/toast.tsx
View File

@ -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>