Vue template: Object is possibly 'undefined' errors & unexpected token

[marcianos]

I try to use Vite + Vue + Vite plugin vue 2 + Typescript with Volar plugin.

Vue version: 2.6.14
Typescript version: 4.5.5
Vite version: 2.8.0
Vue-tsc: 0.33.9

Example link

I generate: const testing: Ref<string | undefined> = ref();.

At beginning this value is undefined and in onBeforeMount() I set this value to a string. In vue template the div should only be generated when testing has a value (v-if="testing"). For the input field the v-model has type string and not string or undefined (which should be right).

The button click event errors with the message:

Argument of type 'string | undefined' is not assignable to parameter of type 'string'. Type 'undefined' is not assignable to type 'string'.

In the example you can see this error message when you run vue-tsc --noEmit.

When I change the click handler in HelloWorld component to <button @click="testClick(testing!)" />
I get the error message: Unexpected token
So I can not use ! in vue (2) template? or is there any possibility?