import { Toast, Icon, Button, ToastFactory } from '../../index';
import { advanceBy, advanceTo, clear } from 'jest-date-mock';
import ToastItem from '../toast';
import sleep from '@douyinfe/semi-ui/_test_/utils/function/sleep';
import { BASE_CLASS_PREFIX } from '../../../semi-foundation/base/constants';
import { IconWifi } from '@douyinfe/semi-icons';
describe('Toast', () => {
beforeEach(async () => {
// semi-animation会使用Date.now(),所以这里需要clear掉全局的advanceTo对Date的修改
clear();
const tw = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-wrapper`);
if (tw) {
tw.innerHTML = '';
}
});
afterEach(async () => {
// await sleep(500);
});
it('basically show toast, test content', () => {
Toast.info('semi');
let toast = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-info`);
expect(toast.textContent).toEqual('semi');
});
it('theme: light', () => {
Toast.info({
content: 'semi',
theme: 'light',
});
let toast = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-info`);
expect(toast.classList.contains(`${BASE_CLASS_PREFIX}-toast-light`)).toEqual(true);
});
it('duration, >0', done => {
let opts = {
duration: 1,
content: 'dur1',
};
Toast.info(opts);
let toast = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-info`);
expect(toast.textContent).toEqual('dur1');
setTimeout(() => {
let toast = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-info`); // expect toast had been remove
expect(toast).toEqual(null);
done();
}, 1500);
});
it('should trigger onClose after duration', done => {
let spyOnClose = sinon.spy(() => {});
let opts = {
onClose: spyOnClose,
content: 'bytedance',
duration: 0.8,
};
Toast.info(opts);
let toast = document.querySelector(`.${BASE_CLASS_PREFIX}-toast-info`);
setTimeout(() => {
expect(spyOnClose.calledOnce).toEqual(true);
done();
}, 1000);
});
it('should trigger onClose when click close btn', () => {
let spyOnClose = sinon.spy(() => {});
let opts = {
onClose: spyOnClose,
content: 'bytedance',
};
let toast = mount();
let closeBtn = toast.find(`.${BASE_CLASS_PREFIX}-toast-close-button .${BASE_CLASS_PREFIX}-button`);
closeBtn.simulate('click', {});
expect(spyOnClose.calledOnce).toEqual(true);
});
it('showClear = false', () => {
let opts = {
showClose: false,
duration: 1,
content: 'showCloseToast',
};
let toast = mount();
expect(toast.exists(`.${BASE_CLASS_PREFIX}-toast-close-button`)).toEqual(false);
});
it('custom icon', () => {
let customIcon = ;
let opts = {
icon: customIcon,
content: 'semi',
};
let toast = mount();
expect(toast.exists(`.${BASE_CLASS_PREFIX}-icon-wifi`)).toEqual(true);
});
it('specific getPopupContainer', () => {
const container = document.createElement('div');
container.id = 'toast-container';
document.body.appendChild(container);
const ContainerToast = ToastFactory.create({
getPopupContainer: () => document.querySelector(`#toast-container`),
});
ContainerToast.info('specific getPopupContainer');
expect(
document.querySelector(`#${ContainerToast.getWrapperId()}`).parentNode ===
document.querySelector(`#toast-container`)
).toEqual(true);
});
});