Touch End Hold Directive

[zN3utr4l]

What happened?

I wanted to create a component that when I press it changes a variable to true and when I lift the touch or click it changes that variable back to false.

I found this issue that says to add the events directly (#3876), but in this file (

quasar/ui/playground/src/pages/touch-directives/touch-hold.vue

Line 18 in 27ce4f8

@mouseup="onEvt('mouseup')"

) I saw that events are supported, but there are some problems with touch, the mouse works, both up and down, while the touchend doesn't is triggered.

What did you expect to happen?

touch end when I release the button click

Reproduction URL

https://codepen.io/zN3utral/pen/bGyMXjK?editors=111

How to reproduce?

Touch event on button

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar), Directives (quasar)

Platforms/Browsers

Chrome

Quasar info output

No response

Relevant log output

No response

Additional context

No response

[zN3utr4l]

I found some more information, before executing the function in v-touch-hold the touchend is triggered, but once the function is executed it no longer works

[zN3utr4l]

For the moment I bypassed the error with:

@touchstart="() => writeValue('toggle', true)"
@mousedown="() => writeValue('toggle', true)"
@touchend="() => writeValue('toggle', false)"
@mouseup="() => writeValue('toggle', false)"

[zN3utr4l]

quasar/ui/src/directives/touch-hold/TouchHold.js

Line 111 in 7e2de90

evt !== void 0 && stopAndPrevent(evt)

Could this be the problem?