hl037 / vue-contenteditable

Bug Report

Hello, I guess I found a bug unless I'm doing something wrong with v-if behaving differently with Vue 3.

Description:
When a <contenteditable/> component is wrapped inside a conditionally displayed element, the value of the ref element can be null which is not handled an generates an error. It is asserted element is never null here :

vue-contenteditable/src/components/contenteditable.vue

Line 56 in 7dacb2b

element.value!.innerText

Steps to Reproduce:

Wrap a <conteneditable /> inside a <div v-if="condition"></div>
Make the condition false for example when @returned event is caught (see code below)

Expected Behavior:
element should not be asserted to be not null and null cases should be handled

Actual Behavior:
You get the following error :

Uncaught TypeError: Cannot read properties of null (reading 'innerText')
    at currentContent (vue-contenteditable.es.js:31:43)
    at update (vue-contenteditable.es.js:41:33)
    at callWithErrorHandling (runtime-core.esm-bundler.js:158:18)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:166:17)
    at HTMLDivElement.invoker (runtime-dom.esm-bundler.js:278:5)
    at remove (runtime-dom.esm-bundler.js:15:14)
    at performRemove (runtime-core.esm-bundler.js:6257:7)
    at remove2 (runtime-core.esm-bundler.js:6271:7)
    at unmount (runtime-core.esm-bundler.js:6226:9)
    at patch (runtime-core.esm-bundler.js:4991:7)

Reproducible Code Snippet:

<script setup lang="ts">
import { ref } from 'vue'

const condition = ref(true)
const msg = ref("Hello world")
</script>

<template>
  <div v-if="condition">
    <contenteditable-component tag="div" :contenteditable="true" v-model="msg" :no-nl="true" :no-html="true" @returned="condition = !condition" />
  </div>
</template>

** Environment:**
"vue": "^3.2.47",
"vue-contenteditable": "^4.1.0"
Node : v18.16.0

Interesting ! thanks for the report !

I would expect the contenteditable to be destroyed if the cond is false, I have to investigate it

[Bug] Template ref to "element" null value is not handle (upon unmouting)