[ui5-combobox, Angular 18]: selection-change event is not fired when the matched text as available option is written in the input and clicked on the dropdown

[TsvetomirGT]

Bug Description

In an Angular 18 application using SAP UI5's ComboBox component, a bug occurs when the user types text into the input field that matches one of the options in the dropdown and then selects that option by clicking on it. The issue is that the selection-change event is not triggered as expected.

Affected Component

ui5-combobox

Expected Behaviour

When the user clicks on the matching option in the dropdown, the selection-change event should fire, regardless of whether the text was pre-typed in the input field.

Isolated Example

No response

Steps to Reproduce

1. Integrate a ui5-combobox component into an Angular 18 application using the SAP UI5 framework.
2. Add ui-cb-items.
3. Add a listener for the selection-change event to handle the selection logic.
4. Type a value into the ComboBox input field that matches an available option (e.g., "Option 1").
5. Select the matching option from the dropdown by clicking on it.
   ...
   (Optional steps)
6. Type a value into the ComboBox input field that matches an available option (e.g., "Option 1").
7. Add one or more spaces after (e.g., "Option 1 ")
8. Remove the spaces
9. Select the matching option from the dropdown by clicking on it.

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

2.3.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[s-todorova]

Hello @TsvetomirGT,

It would be especially helpful if you could share a code snippet or a live example that demonstrates the problem. This will help us better understand the issue and offer an appropriate solution. I attempted to reproduce the problem locally with regular version of WebComponents, but was unable to reproduce the issue. Could you maybe provide an isolated example? You can use https://stackblitz.com/

Best regards,
Siyana

[TsvetomirGT]

Hello @s-todorova ,

Ive created a stackblitz example: Here

In the following example you can see the combobox component. Ive added a console log to the (selection-change) event. Also there is a noTypeahead property set to true.

1. Type for example "Bulga", the dropdown will list "Bulgaria" and when you click it the event is fired.
2. Reload the page
3. Type "Bulgaria", the dropdown will list "Bulgaria" but when you click it the event is not firing anything.

There are other variations of the issue, for example if you type "Bulgaria " (with space after it), then delete the space and the dropdown will list again "Bulgaria". When you click it, again the event is not firing anything.

Hope this description is helpful.

Best regards,
Tsvetomir

[s-todorova]

Thank you for providing a sample.

Hello @SAP/ui5-webcomponents-topic-rl ,
Issue is reproducible in the linked stackblitz example. Could you please take a look at this?

Best regards,
Siyana