Дмитрий
75 lines
2.5 KiB
TypeScript
75 lines
2.5 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from 'vitest';
|
|
import { mount } from '@vue/test-utils';
|
|
import { nextTick } from 'vue';
|
|
import DevIndexOverlay from '../../resources/js/components/DevIndexOverlay.vue';
|
|
import { useDevIndices } from '../../resources/js/composables/useDevIndices';
|
|
|
|
describe('DevIndexOverlay', () => {
|
|
beforeEach(() => useDevIndices().reset());
|
|
|
|
it('hidden when no current target', () => {
|
|
mount(DevIndexOverlay, { attachTo: document.body });
|
|
expect(document.querySelector('.dx-badge')).toBeNull();
|
|
});
|
|
|
|
it('shows badge with id + tag when target is set', async () => {
|
|
const el = document.createElement('button');
|
|
el.setAttribute('data-dx', '1030');
|
|
el.textContent = 'Создать';
|
|
document.body.appendChild(el);
|
|
|
|
const dx = useDevIndices();
|
|
dx.setTarget(el);
|
|
|
|
mount(DevIndexOverlay, { attachTo: document.body });
|
|
await nextTick();
|
|
const badge = document.querySelector('.dx-badge');
|
|
expect(badge).not.toBeNull();
|
|
expect(badge!.textContent).toContain('1030');
|
|
expect(badge!.textContent!.toLowerCase()).toContain('button');
|
|
|
|
document.body.removeChild(el);
|
|
});
|
|
|
|
it('Esc clears the target', async () => {
|
|
const el = document.createElement('div');
|
|
el.setAttribute('data-dx', '5');
|
|
document.body.appendChild(el);
|
|
const dx = useDevIndices();
|
|
dx.setTarget(el);
|
|
|
|
mount(DevIndexOverlay, { attachTo: document.body });
|
|
await nextTick();
|
|
|
|
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' }));
|
|
await nextTick();
|
|
|
|
expect(dx.currentId.value).toBeNull();
|
|
document.body.removeChild(el);
|
|
});
|
|
|
|
it('clicking the badge copies "#<id>" to clipboard', async () => {
|
|
const writeText = vi.fn().mockResolvedValue(undefined);
|
|
Object.defineProperty(navigator, 'clipboard', {
|
|
value: { writeText },
|
|
configurable: true,
|
|
});
|
|
|
|
const el = document.createElement('button');
|
|
el.setAttribute('data-dx', '1030');
|
|
document.body.appendChild(el);
|
|
useDevIndices().setTarget(el);
|
|
|
|
mount(DevIndexOverlay, { attachTo: document.body });
|
|
await nextTick();
|
|
|
|
const badge = document.querySelector('.dx-badge') as HTMLElement;
|
|
expect(badge).not.toBeNull();
|
|
badge.click();
|
|
await nextTick();
|
|
expect(writeText).toHaveBeenCalledWith('#1030');
|
|
|
|
document.body.removeChild(el);
|
|
});
|
|
});
|