Skip to content

Combobox - filter search is inconsistent between single and multi-select versions #1701

Open
@yashgarg17

Description

@yashgarg17

Title line template: [Title]: Brief description

For the Combobox component, there is an inconsistency observed while searching for options between single and multi-select versions.

Detailed description

Describe in detail the issue you're having.
There are primarily 2 versions of the Combobox component are available -
single-selection - https://angular.carbondesignsystem.com/?path=/story/components-combobox--basic
multi-selection - https://angular.carbondesignsystem.com/?path=/story/components-combobox--multi-select

We have observed inconsistent behaviour while applying same filter in both the versions.
In case of single-select, if the search value is not present, then all the options are displayed -

image

But in case of multi-select, if the searched value is not present, then no options are listed -

image

Filtering should be consistent across the versions.

Is this a feature request (new component, new icon), a bug, or a general issue?
BUG

Is this issue related to a specific component?
It is specific to Combobox component

What did you expect to happen? What happened instead? What would you like to see changed?

Expected behaviour -
If the searched value is not matching with any of the options available, then it should show nothing as in case of multi-select version of Combobox component

Actual behaviour -
In case of single-select, if the search value is not present, then all the options are displayed

What browser are you working in?
Chrome

What version of the Carbon Design System are you using?
4.36.1

What offering/product do you work on? Any pressing ship or release dates we should be aware of?
IBM Cloud Brokerage - Cost and Asset Management

Steps to reproduce the issue

  1. Go to https://angular.carbondesignsystem.com/?path=/story/components-combobox--basic
  2. Search for any text which is not matching with any of the options. For example - test
  3. Observe that all the available options are displayed, even though test is not matching with any of the options

image

  1. Now go to https://angular.carbondesignsystem.com/?path=/story/components-combobox--multi-select
  2. Search for any text which is not matching with any of the options. For example - test
  3. Observe that no option is displayed, because test is not matching with any of the options

image

Metadata

Metadata

Assignees

No one assigned

    Labels

    component: ComboboxFor Combobox issuesstyleMight need a change in carbon-components CSS

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions