Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/vitest-dev/vitest. Next generation testing framework powered by Vite. vitest.dev
test testing-tools vite
Something went wrong. Try again.
2.2 kB · 82 lines
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283<script setup lang="ts">import type { EditorConfiguration, EditorFromTextArea } from 'codemirror'import type { Ref } from 'vue'import { onMounted, ref } from 'vue'import { codemirrorRef, useCodeMirror } from '~/composables/codemirror'
const { mode, options, readOnly } = defineProps<{ mode?: string options?: EditorConfiguration readOnly?: boolean saving?: boolean}>()
const emit = defineEmits<{ (event: 'save', content: string): void (event: 'codemirror', codemirror: EditorFromTextArea): void}>()
const modelValue = defineModel<string>()
const modeMap: Record<string, any> = { html: 'htmlmixed', vue: 'htmlmixed', svelte: 'htmlmixed', js: 'javascript', mjs: 'javascript', cjs: 'javascript', ts: { name: 'javascript', typescript: true }, mts: { name: 'javascript', typescript: true }, cts: { name: 'javascript', typescript: true }, jsx: { name: 'text/jsx' }, tsx: { name: 'text/typescript-jsx' },}
const el = ref<HTMLTextAreaElement>()
onMounted(async () => { // useCodeMirror will remove the codemirrorRef.value on onUnmounted callback const codemirror = useCodeMirror(el, modelValue as unknown as Ref<string>, { ...options, mode: modeMap[mode || ''] || mode, readOnly: readOnly ? true : undefined, extraKeys: { 'Cmd-S': function (cm) { const isReadonly = cm.getOption('readOnly') if (!isReadonly) { emit('save', cm.getValue()) } }, 'Ctrl-S': function (cm) { const isReadonly = cm.getOption('readOnly') if (!isReadonly) { emit('save', cm.getValue()) } }, }, })
codemirror.on('refresh', () => { emit('codemirror', codemirror) }) codemirror.on('change', () => { emit('codemirror', codemirror) }) codemirror.setSize('100%', '100%') codemirror.clearHistory() codemirrorRef.value = codemirror setTimeout(() => codemirrorRef.value?.refresh(), 100)})</script>
<template> <div class="codemirror-scrolls relative font-mono text-sm" :class="{ 'codemirror-busy': saving, 'codemirror-hide-cursor': readOnly, }" > <textarea ref="el" /> </div></template>