fix: wrapped button

This somehow weirdly fixes the test. I have no clue why. Regardless it should be better than before, because a button  (DropdownItem) should never contain another interactive element (the setBucketLimit input and save button).

The test failed because I replaced a v-if with v-show. I do not know _why_ this made the test fail. When I reproduced the test step by step it worked for me…

frontend/cypress/e2e/project/project-view-kanban.spec.ts

@@ -116,9 +116,9 @@ describe('Project View Kanban', () => {
 		cy.get('.kanban .bucket .bucket-header .dropdown.options .dropdown-menu .dropdown-item')
 			.contains('Limit: Not Set')
 			.click()
-		cy.get('.kanban .bucket .bucket-header .dropdown.options .dropdown-menu .dropdown-item .field input.input')
+		cy.get('.kanban .bucket .bucket-header .dropdown.options .dropdown-menu .field input.input')
 			.first()
-			.type(3)
+			.type('3')
 		cy.get('[data-cy="setBucketLimit"]')
 			.first()
 			.click()

frontend/src/components/misc/Dropdown.vue

@@ -2,6 +2,7 @@
 	<div
 		ref="dropdown"
 		class="dropdown"
+		@pointerenter="initialMount = true"
 	>
 		<slot
 			name="trigger"
@@ -22,6 +23,7 @@
 
 		<CustomTransition name="fade">
 			<div
+				v-if="initialMount || open"
 				v-show="open"
 				class="dropdown-menu"
 			>
@@ -49,6 +51,8 @@ defineProps({
 })
 const emit = defineEmits(['close'])
 
+
+const initialMount = ref(false)
 const open = ref(false)
 
 function close() {

frontend/src/components/project/views/ProjectKanban.vue

@@ -71,9 +71,7 @@
 										trigger-icon="ellipsis-v"
 										@close="() => showSetLimitInput = false"
 									>
-										<DropdownItem
+
-											@click.stop="showSetLimitInput = true"
-										>
 										<div
 											v-if="showSetLimitInput"
 											class="field has-addons"
@@ -97,15 +95,17 @@
 													:disabled="bucket.limit < 0"
 													:icon="['far', 'save']"
 													:shadow="false"
-														@click="setBucketLimit(bucket.id, true)"
+													@click="() => {setBucketLimit(bucket.id, true); showSetLimitInput = false}"
 												/>
 											</div>
 										</div>
-											<template v-else>
+										<DropdownItem
+											v-else
+											@click.stop="showSetLimitInput = true"
+										>
 											{{
 												$t('project.kanban.limit', {limit: bucket.limit > 0 ? bucket.limit : $t('project.kanban.noLimit')})
 											}}
-											</template>
 										</DropdownItem>
 										<DropdownItem
 											v-tooltip="$t('project.kanban.doneBucketHintExtended')"