"focus" event does not fire for handler, "onfocus" does

greyvugrin commented 2 years ago

What is the current behavior?

The vue component does not fire events for @focus, @blur, etc. It only fires them to their "on*" counterparts. E.g. "onfocus".
This conflicts with the event docs here: https://www.tiny.cloud/docs/integrations/vue/#eventbinding

Please provide the steps to reproduce and if possible a minimal demo of the problem via codesandbox.io or similar. Steps to repro:

Set up an @focus handler on the editor component. It does not fire.
Set up an @onfocus handler. It does

Reproduced here: https://codesandbox.io/s/tinymce-focus-event-8gf8y4?file=/src/App.vue

What is the expected behavior? focus events should be triggered, or the docs should be updated to reflect the "on*" event list.

Which versions of TinyMCE, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE or tinymce-vue?

Tinymce version 5.10.3. Chrome, Mac

"@tinymce/tinymce-vue": "^3.0.1",
 "vue": "^2.5.22"

exalate-issue-sync[bot] commented 2 years ago

Ref: INT-2781

jscasca commented 2 years ago

@greyvugrin the docs represent the latest version of the integration (v4.0) which supports Vue 3. In this version events are wired used the @focus handler. For example

For version 3.0 which supports Vue 2, the events were wired having the v-on:focus in mind which wired them to use the @onfocus notation. For example

Thanks for bringing this up. I will update this ticket once the docs represent this issue for version 3. Unfortunately, the docs page is getting an overhaul so it might take a bit to reflect this changes.

jscasca commented 1 year ago

This behaviour has been documented in https://www.tiny.cloud/docs/tinymce/6/vue-ref/#event-binding

tinymce / tinymce-vue

"focus" event does not fire for handler, "onfocus" does #301