[TikiWiki-commits] [Git][tikiwiki/tiki][master] [FIX] Module search: search field losing keywords on Enter key press

Merci Jacob pushed to branch master at Tiki Wiki CMS Groupware / Tiki


Commits:
8ff29d85 by Landry Bitege at 2025-12-19T09:22:59+00:00
[FIX] Module search: search field losing keywords on Enter key press
---
* [FIX] Module search: search field losing keywords on Enter key press

See merge request tikiwiki/tiki!9233

- - - - -


3 changed files:

- src/js/vue-widgets/element-plus-ui/src/components/Autocomplete/Autocomplete.vue
- src/js/vue-widgets/element-plus-ui/src/elements/autocomplete.js
- src/js/vue-widgets/element-plus-ui/src/tests/components/Autocomplete.test.js


Changes:

=====================================
src/js/vue-widgets/element-plus-ui/src/components/Autocomplete/Autocomplete.vue
=====================================
@@ -1,9 +1,9 @@
 <script setup>
-import { onMounted, ref } from 'vue';
+import { onMounted, ref, watchEffect } from 'vue';
 import { fetchSuggestions } from '../../helpers/autocomplete/remote';
 import ConfigWrapper from '../ConfigWrapper.vue';
 
-const props = defineProps(['value', 'remoteSourceUrl', 'sourceList', 'emitCustomEvent', 'placeholder', 'valueKey', 'language']);
+const props = defineProps(['_expose', 'value', 'remoteSourceUrl', 'sourceList', 'emitCustomEvent', 'placeholder', 'valueKey', 'language']);
 
 const valueKey = props.valueKey || 'value';
 const placeholder = props.placeholder || TEXT.INPUT_PLACEHOLDER;
@@ -12,6 +12,8 @@ const shouldRefocusOnBlur = ref(false);
 const modelValue = ref(props.value);
 const autocompleteRef = ref(null);
 
+props._expose({ value: modelValue });
+
 const handleFetchSuggestions = (query, callback) => {
     const wrappedCallback = (results) => {
         callback(results);
@@ -49,6 +51,10 @@ onMounted(() => {
         console.error(TEXT.ERROR_NO_REQUIRED_PROPS);
     }
 })
+
+watchEffect(() => {
+    modelValue.value = props.value;
+});
 </script>
 
 <script>


=====================================
src/js/vue-widgets/element-plus-ui/src/elements/autocomplete.js
=====================================
@@ -22,7 +22,7 @@ customElements.define(
                 },
                 { immediate: true, deep: true }
             );
-            return () => h(Autocomplete, { ...internalState, emitCustomEvent }, ctx.slots);
+            return () => h(Autocomplete, { ...internalState, emitCustomEvent, _expose: ctx.expose }, ctx.slots);
         },
         {
             styles: [styles],


=====================================
src/js/vue-widgets/element-plus-ui/src/tests/components/Autocomplete.test.js
=====================================
@@ -40,6 +40,7 @@ describe("Autocomplete", () => {
         test("renders correctly with default props value", () => {
             const givenProps = {
                 remoteSourceUrl: "https://foo/bar",
+                _expose: vi.fn(),
             };
 
             render(Autocomplete, { props: givenProps });
@@ -60,10 +61,11 @@ describe("Autocomplete", () => {
 
             expect(consoleErrorSpy).not.toHaveBeenCalled();
             expect(consoleWarnSpy).not.toHaveBeenCalled();
+            expect(givenProps._expose).toHaveBeenCalled({ value: expect.objectContaining({ _value: givenProps.value, __v_isRef: true }) });
         });
 
         test("logs an error to the console when required props are not provided", () => {
-            render(Autocomplete, { props: {} });
+            render(Autocomplete, { props: { _expose: vi.fn() } });
 
             expect(consoleErrorSpy).toHaveBeenCalledWith(TEXT.ERROR_NO_REQUIRED_PROPS);
             expect(consoleWarnSpy).not.toHaveBeenCalled();
@@ -77,6 +79,7 @@ describe("Autocomplete", () => {
                 placeholder: "Search",
                 valueKey: "name",
                 language: "en",
+                _expose: vi.fn(),
             };
 
             render(Autocomplete, { props: givenProps });
@@ -101,6 +104,7 @@ describe("Autocomplete", () => {
 
             expect(consoleErrorSpy).not.toHaveBeenCalled();
             expect(consoleWarnSpy).not.toHaveBeenCalled();
+            expect(givenProps._expose).toHaveBeenCalled({ value: expect.objectContaining({ _value: givenProps.value, __v_isRef: true }) });
         });
     });
 
@@ -109,6 +113,7 @@ describe("Autocomplete", () => {
             const givenProps = {
                 remoteSourceUrl: "https://foo/bar",
                 emitCustomEvent: vi.fn(),
+                _expose: vi.fn(),
             };
 
             ElAutocomplete = {
@@ -145,6 +150,7 @@ describe("Autocomplete", () => {
             const givenProps = {
                 remoteSourceUrl,
                 sourceList,
+                _expose: vi.fn(),
             };
 
             ElAutocomplete = {
@@ -164,12 +170,14 @@ describe("Autocomplete", () => {
             await fireEvent.change(input, { target: { value: "foo" } });
 
             expect(fetchSuggestions).toHaveBeenCalledWith("foo", expect.any(Function), remoteSourceUrl, sourceList ? JSON.parse(sourceList) : []);
+            expect(givenProps._expose).toHaveBeenCalled({ value: expect.objectContaining({ _value: givenProps.value, __v_isRef: true }) });
         });
 
         test("calls props.emitCustomEvent when ElAutocomplete emits a select event", async () => {
             const givenProps = {
                 remoteSourceUrl: "https://foo/bar",
                 emitCustomEvent: vi.fn(),
+                _expose: vi.fn(),
             };
 
             ElAutocomplete = {
@@ -190,12 +198,14 @@ describe("Autocomplete", () => {
             await fireEvent.click(suggestion);
 
             expect(givenProps.emitCustomEvent).toHaveBeenCalledWith("select", "suggestion");
+            expect(givenProps._expose).toHaveBeenCalled({ value: expect.objectContaining({ _value: givenProps.value, __v_isRef: true }) });
         });
 
         test("calls props.emitCustomEvent when ElAutocomplete emits a input event", async () => {
             const givenProps = {
                 remoteSourceUrl: "https://foo/bar",
                 emitCustomEvent: vi.fn(),
+                _expose: vi.fn(),
             };
 
             ElAutocomplete = {
@@ -219,6 +229,7 @@ describe("Autocomplete", () => {
             await fireEvent.change(input, { target: { value: "foo" } });
 
             expect(givenProps.emitCustomEvent).toHaveBeenCalledWith("input", "foo");
+            expect(givenProps._expose).toHaveBeenCalled({ value: expect.objectContaining({ _value: givenProps.value, __v_isRef: true }) });
         });
     });
 });



View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/8ff29d855b773096a2ed483a42b3a69ff8ec41b2

-- 
View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/8ff29d855b773096a2ed483a42b3a69ff8ec41b2
You're receiving this email because of your account on gitlab.com.

_______________________________________________
TikiWiki-cvs mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/tikiwiki-cvs