fix(NcPopover): check trigger a11y compatible with Vue 3

[ShGKme]

☑️ Resolves

• Fix [next] Adjust warning in NcPopoverTriggerProvider #5108
• Alternative to fix(NcPopoverTriggerProvider): Make debugging code more defensive #5104 to keep check in Vue 3

Popover content is usually only the trigger. So no need to check content in a slot component.

Trigger's parent DOM node is accessible by $refs of Floating-Vue.

For Vue 3 only requires to change refs from Floating-Vue.

🏁 Checklist

• ⛑️ Tests are included or are not applicable
• 📘 Component documentation has been extended, updated or is not applicable

[raimund-schluessler]

Shouldn't this trigger the warning? But it does not in the docs (unless they aren't built as debug, but I think they are). It also gives no warning for master.

<template>
	<div style="display: flex">
		<NcPopover>
			<!-- Take "attrs" from the slot props -->
			<template #trigger>
				<!-- Bind attrs as the button attrs -->
				<button>
					I am a custom button in the trigger2
				</button>
			</template>

			Hi! 🚀
		</NcPopover>
	</div>
</template>

[ShGKme]

Works for me...

[raimund-schluessler]

Shouldn't this trigger the warning? But it does not in the docs (unless they aren't built as debug, but I think they are). It also gives no warning for master.

<template>
	<div style="display: flex">
		<NcPopover>
			<!-- Take "attrs" from the slot props -->
			<template #trigger>
				<!-- Bind attrs as the button attrs -->
				<button>
					I am a custom button in the trigger2
				</button>
			</template>

			Hi! 🚀
		</NcPopover>
	</div>
</template>

On an unrelated note, this example triggers a focus-trap warning: 🙈
Your focus-trap must have at least one container with at least one tabbable node in it at all times.

[raimund-schluessler]

Works for me...

Weird. I guess https://deploy-preview-5110--nextcloud-vue-components.netlify.app/#/Components/NcPopover is not debug mode then.

[ShGKme]

Weird. I guess https://deploy-preview-5110--nextcloud-vue-components.netlify.app/#/Components/NcPopover is not debug mode then.

It is... Let me check

[ShGKme]

Weird. I guess https://deploy-preview-5110--nextcloud-vue-components.netlify.app/#/Components/NcPopover is not debug mode then.

Oh, yes.

It is in OC.debug mode, but it uses production mode of Vue, so there is no Vue warnings.

[raimund-schluessler]

Works locally 👍