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

chore: sync

Browse Source
This commit is contained in:
Liam DeBeasi
2023-11-28 16:31:47 -05:00
parent 4ad6df67f0 196a22eb74
commit fd36b953d6
258 changed files with 33681 additions and 8732 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
core/src/components/toast/test/toast-config.spec.ts
View File

@ -9,7 +9,7 @@ describe('toast: duration config', () => {
html: `<ion-toast></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const toast = page.body.querySelector('ion-toast')!;
expect(toast.duration).toBe(0);
});
@ -22,7 +22,7 @@ describe('toast: duration config', () => {
html: `<ion-toast></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const toast = page.body.querySelector('ion-toast')!;
expect(toast.duration).toBe(5000);
});

100
core/src/components/toast/test/toast.spec.tsx
View File

@ -1,9 +1,9 @@
import { h } from '@stencil/core';
import { newSpecPage } from '@stencil/core/testing';
import { Toast } from '../toast';
import { config } from '../../../global/config';
import { toastController } from '../../../utils/overlays';
import { createAnimation } from '@utils/animation/animation';
import { Toast } from '../toast';
describe('toast: custom html', () => {
it('should not allow for custom html by default', async () => {
@ -12,8 +12,8 @@ describe('toast: custom html', () => {
html: `<ion-toast message="<button class='custom-html'>Custom Text</button>"></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const content = toast.shadowRoot.querySelector('.toast-message');
const toast = page.body.querySelector('ion-toast')!;
const content = toast.shadowRoot!.querySelector('.toast-message')!;
expect(content.textContent).toContain('Custom Text');
expect(content.querySelector('button.custom-html')).toBe(null);
});
@ -25,8 +25,8 @@ describe('toast: custom html', () => {
html: `<ion-toast message="<button class='custom-html'>Custom Text</button>"></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const content = toast.shadowRoot.querySelector('.toast-message');
const toast = page.body.querySelector('ion-toast')!;
const content = toast.shadowRoot!.querySelector('.toast-message')!;
expect(content.textContent).toContain('Custom Text');
expect(content.querySelector('button.custom-html')).not.toBe(null);
});
@ -38,8 +38,8 @@ describe('toast: custom html', () => {
html: `<ion-toast message="<button class='custom-html'>Custom Text</button>"></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const content = toast.shadowRoot.querySelector('.toast-message');
const toast = page.body.querySelector('ion-toast')!;
const content = toast.shadowRoot!.querySelector('.toast-message')!;
expect(content.textContent).toContain('Custom Text');
expect(content.querySelector('button.custom-html')).toBe(null);
});
@ -57,9 +57,9 @@ describe('toast: a11y smoke test', () => {
html: `<ion-toast message="Message" header="Header"></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast');
const header = toast.shadowRoot.querySelector('.toast-header');
const message = toast.shadowRoot.querySelector('.toast-message');
const toast = page.body.querySelector('ion-toast')!;
const header = toast.shadowRoot!.querySelector('.toast-header')!;
const message = toast.shadowRoot!.querySelector('.toast-message')!;
expect(header.getAttribute('aria-hidden')).toBe('true');
expect(message.getAttribute('aria-hidden')).toBe('true');
@ -75,7 +75,7 @@ describe('toast: a11y smoke test', () => {
`,
});
const toast = page.body.querySelector('ion-toast');
const toast = page.body.querySelector('ion-toast')!;
/**
* Wait for present method to resolve
@ -84,22 +84,48 @@ describe('toast: a11y smoke test', () => {
await toast.present();
await page.waitForChanges();
const header = toast.shadowRoot.querySelector('.toast-header');
const message = toast.shadowRoot.querySelector('.toast-message');
const header = toast.shadowRoot!.querySelector('.toast-header')!;
const message = toast.shadowRoot!.querySelector('.toast-message')!;
expect(header.getAttribute('aria-hidden')).toBe(null);
expect(message.getAttribute('aria-hidden')).toBe(null);
});
});
describe('toast: duration config', () => {
it('should have duration set to 0', async () => {
const page = await newSpecPage({
components: [Toast],
html: `<ion-toast></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast')!;
expect(toast.duration).toBe(0);
});
it('should have duration set to 5000', async () => {
config.reset({ toastDuration: 5000 });
const page = await newSpecPage({
components: [Toast],
html: `<ion-toast></ion-toast>`,
});
const toast = page.body.querySelector('ion-toast')!;
expect(toast.duration).toBe(5000);
});
});
describe('toast: htmlAttributes', () => {
it('should correctly inherit attributes on host', async () => {
const page = await newSpecPage({
components: [Toast],
template: () => <ion-toast htmlAttributes={{ 'data-testid': 'basic-toast' }}></ion-toast>,
template: () => <ion-toast overlayIndex={1} htmlAttributes={{ 'data-testid': 'basic-toast' }}></ion-toast>,
});
const toast = page.body.querySelector('ion-toast');
const toast = page.body.querySelector('ion-toast')!;
await expect(toast.getAttribute('data-testid')).toBe('basic-toast');
});
@ -109,12 +135,12 @@ describe('toast: button cancel', () => {
it('should render the cancel button with part button-cancel', async () => {
const page = await newSpecPage({
components: [Toast],
template: () => <ion-toast buttons={[{ text: 'Cancel', role: 'cancel' }]}></ion-toast>,
template: () => <ion-toast overlayIndex={1} buttons={[{ text: 'Cancel', role: 'cancel' }]}></ion-toast>,
});
const toast = page.body.querySelector('ion-toast');
const toast = page.body.querySelector('ion-toast')!;
const buttonCancel = toast?.shadowRoot?.querySelector('.toast-button-cancel');
const buttonCancel = toast.shadowRoot!.querySelector('.toast-button-cancel')!;
expect(buttonCancel.getAttribute('part')).toBe('button cancel');
});
@ -128,19 +154,19 @@ describe('toast: swipe gesture', () => {
});
it('should return true if set to a valid swipe value', () => {
toast.swipeGesture = 'vertical';
expect(toast.prefersSwipeGesture()).toBe(true);
expect((toast as any).prefersSwipeGesture()).toBe(true);
});
it('should return false if set to undefined', () => {
toast.swipeGesture = undefined;
expect(toast.prefersSwipeGesture()).toBe(false);
expect((toast as any).prefersSwipeGesture()).toBe(false);
});
it('should return false if set to null', () => {
toast.swipeGesture = null;
expect(toast.prefersSwipeGesture()).toBe(false);
(toast as any).swipeGesture = null;
expect((toast as any).prefersSwipeGesture()).toBe(false);
});
it('should return false if set to invalid string', () => {
toast.swipeGesture = 'limit'; // `'limit'` doesn't exist
expect(toast.prefersSwipeGesture()).toBe(false);
(toast as any).swipeGesture = 'limit'; // `'limit'` doesn't exist
expect((toast as any).prefersSwipeGesture()).toBe(false);
});
});
describe('swipeGesture property', () => {
@ -151,35 +177,35 @@ describe('toast: swipe gesture', () => {
toast.enterAnimation = () => createAnimation();
});
it('should not create a swipe gesture on present if swipeGesture is undefined', async () => {
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
await toast.present();
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
});
it('should create a swipe gesture on present', async () => {
toast.swipeGesture = 'vertical';
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
await toast.present();
expect(toast.gesture).not.toBe(undefined);
expect((toast as any).gesture).not.toBe(undefined);
});
it('should destroy a swipe gesture on dismiss', async () => {
toast.swipeGesture = 'vertical';
await toast.present();
expect(toast.gesture).not.toBe(undefined);
expect((toast as any).gesture).not.toBe(undefined);
await toast.dismiss();
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
});
it('should create a swipe gesture if swipeGesture is set after present', async () => {
await toast.present();
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
/**
* Manually invoke the watch
@ -188,13 +214,13 @@ describe('toast: swipe gesture', () => {
toast.swipeGesture = 'vertical';
toast.swipeGestureChanged();
expect(toast.gesture).not.toBe(undefined);
expect((toast as any).gesture).not.toBe(undefined);
});
it('should destroy a swipe gesture if swipeGesture is cleared after present', async () => {
toast.swipeGesture = 'vertical';
await toast.present();
expect(toast.gesture).not.toBe(undefined);
expect((toast as any).gesture).not.toBe(undefined);
/**
* Manually invoke the watch
@ -203,15 +229,15 @@ describe('toast: swipe gesture', () => {
toast.swipeGesture = undefined;
toast.swipeGestureChanged();
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
});
it('should not create a swipe gesture if the toast is not presented', async () => {
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
toast.swipeGesture = 'vertical';
toast.swipeGestureChanged();
expect(toast.gesture).toBe(undefined);
expect((toast as any).gesture).toBe(undefined);
});
});
});