chore: bump git permissions-per-group to vue 3.4

Vue 3.4 announcement: https://blog.vuejs.org/posts/vue-3-4

This allows us to use `defineModel` macro. This remove an eslint-disable
but introduce a new one 😒 since eslint needs to be updated upstream to
support defineModel. See following issue for details:
vuejs/eslint-plugin-vue#2130

Jest doesn't know defineModel either, therefore we take the opportunity to switch to vitest. One bird two stones 😅

See documentation about defineModel: https://vuejs.org/guide/components/v-model.html

No functional changes: in project » admin » permissions per group.

Part of request #31168: Migration Vue2 => Vue3

Change-Id: Idbd1a1519460391cc4438a951865415745ff2dd5

Author: nterray

plugins/git/scripts/permissions-per-group/jest.config.js

@@ -10,20 +10,20 @@
     "@tuleap/fetch-result": "workspace:*",
     "@tuleap/vue3-permissions-per-group-badge": "workspace:*",
     "@tuleap/vue3-gettext-init": "workspace:*",
-    "vue": "3.3.4",
+    "vue": "3.4.5",
     "vue3-gettext": "^2.4.0"
   },
   "devDependencies": {
     "@tuleap/build-system-configurator": "workspace:*",
     "@tuleap/po-gettext-plugin": "workspace:*",
-    "@vitejs/plugin-vue": "^4.2.3",
+    "@vitejs/plugin-vue": "^5.0.2",
     "@vue/test-utils": "^2.2.10",
     "neverthrow": "6.0.0"
   },
   "scripts": {
     "typecheck": "vue-tsc --noEmit",
     "build": "vite build",
     "watch": "vite build --watch --mode development --minify false",
-    "test": "jest"
+    "test": "vitest"
   }
 }

plugins/git/scripts/permissions-per-group/package.json

@@ -17,6 +17,7 @@
  * along with Tuleap. If not, see http://www.gnu.org/licenses/.
  */
 
+import { describe, it, expect } from "vitest";
 import { shallowMount } from "@vue/test-utils";
 import GitInlineFilter from "./GitInlineFilter.vue";
 import { createGettext } from "vue3-gettext";
@@ -31,7 +32,7 @@ describe("GitInlineFilter", () => {
                 plugins: [createGettext({ silent: true })],
             },
         });
-        wrapper.find("[data-test=git-inline-filter-input]").trigger("keyup");
+        wrapper.find("[data-test=git-inline-filter-input]").trigger("input");
         expect(wrapper.emitted("update:modelValue")).toBeTruthy();
     });
 });

plugins/git/scripts/permissions-per-group/pnpm-lock.yaml

@@ -26,8 +26,7 @@
                 class="tlp-search"
                 autocomplete="off"
                 v-bind:placeholder="placeholder"
-                v-bind:value="modelValue"
-                v-on:keyup="search"
+                v-model="model"
                 data-test="git-inline-filter-input"
             />
         </div>
@@ -38,21 +37,11 @@
 import { computed } from "vue";
 import { useGettext } from "vue3-gettext";
 
-// modelValue in camel case is needed for v-model until vue 3.4 (replaced by defineModel)
-// eslint-disable-next-line vue/prop-name-casing
-defineProps<{ modelValue?: string }>();
+// eslint doesn't know yet defineModel: https://github.com/vuejs/eslint-plugin-vue/issues/2130
+// eslint-disable-next-line no-undef
+const model = defineModel();
 
 const { $gettext } = useGettext();
 
 const placeholder = computed(() => $gettext("Repository name"));
-
-const emit = defineEmits<{
-    "update:modelValue": [value: string];
-}>();
-
-function search(event: Event): void {
-    if (event.target instanceof HTMLInputElement) {
-        emit("update:modelValue", event.target.value);
-    }
-}
 </script>