29 lines
1.7 KiB
TypeScript
29 lines
1.7 KiB
TypeScript
// @vitest-environment happy-dom
|
|
import { afterEach, expect, it, vi } from 'vitest'
|
|
import { mount, type VueWrapper } from '@vue/test-utils'
|
|
import { createPinia, setActivePinia } from 'pinia'
|
|
import { getMarkdown } from '@milkdown/kit/utils'
|
|
import type { Editor } from '@milkdown/kit/core'
|
|
import VisualMarkdownEditor from './VisualMarkdownEditor.vue'
|
|
|
|
vi.mock('@/services/mermaidService', () => ({ renderMermaid: vi.fn(async () => ({ svg: '<svg viewBox="0 0 400 200"><text>Diagram</text></svg>', warnings: [], width: 400, height: 200 })) }))
|
|
let wrapper: VueWrapper
|
|
afterEach(() => { wrapper?.unmount(); document.body.innerHTML = ''; vi.unstubAllGlobals() })
|
|
it('keeps diagram buttons usable after real Milkdown preview copying without changing Markdown', async () => {
|
|
localStorage.clear()
|
|
setActivePinia(createPinia())
|
|
vi.stubGlobal('IntersectionObserver', class {
|
|
constructor(private callback: IntersectionObserverCallback) {}
|
|
observe(target: Element) { queueMicrotask(() => this.callback([{ isIntersecting: true, target } as IntersectionObserverEntry], this as unknown as IntersectionObserver)) }
|
|
unobserve() {}
|
|
disconnect() {}
|
|
})
|
|
wrapper = mount(VisualMarkdownEditor, { props: { initialContent: '```mermaid\ngraph TD; A-->B\n```' }, attachTo: document.body })
|
|
await vi.waitFor(() => expect(wrapper.find('[data-diagram-action="in"]').exists()).toBe(true), { timeout: 3000 })
|
|
const editor = (wrapper.vm as unknown as { getEditor(): Editor }).getEditor()
|
|
const before = editor.action(getMarkdown())
|
|
await wrapper.get('[data-diagram-action="in"]').trigger('click')
|
|
expect((wrapper.get('.editor-mermaid-preview svg').element as SVGSVGElement).style.width).toBe('480px')
|
|
expect(editor.action(getMarkdown())).toBe(before)
|
|
})
|