codemirror.js Uncaught TypeError: how can I solve?

[givemetarte]

Hi,

I got a trouble when I'm using the yasgui in my vue3 application. The three tabs are generated but when I clicked the sparql query lines, a error message is arising. The message is below:

Additionally, lots of blank lines are generated and the scroll bar is not at the beginning of the first line.

I have no idea how can I solve..😹 I'll be so pleased if you give me some clues.

The source codes are below:

<template> 
    <div id="yasgui"></div>
</template>

<script>
import { ref, onMounted } from 'vue';
import Yasgui from "@triply/yasgui";
import "@triply/yasgui/build/yasgui.min.css";

export default ({
    name: 'QuerySection',
    setup() {
        const yasgui = ref(null);

        // set queries
        const basicQuery = "blah blah blah..."
        const secQuery = "blah blah blah..."
        const thdQuery = "blah blah blah..."

        onMounted(() => {
            yasgui.value = new Yasgui(document.getElementById("yasgui"), {
                requestConfig: { endpoint: import.meta.env.VITE_KEY_SPARQL_ENDPOINT }, 
                copyEndpointOnNewTab: true,
                persistencyExpire: 1,
                yasqe: {
                    persistencyExpire: 1,
                }
            })

            // add tabs and queries
            yasgui.value.getTab().setQuery(basicQuery);
            yasgui.value.addTab('query2').setQuery(secQuery);
            yasgui.value.addTab('query3').setQuery(thdQuery);
        })

        return { yasgui }
    },
})
</script>

[givemetarte]

error fixed!