Skip to content

fix(VCombobox): keep highlighted item on filteredItems change#14196

Merged
KaelWD merged 3 commits intovuetifyjs:masterfrom
yuwu9145:fix/14194-combobox-list-index
Oct 31, 2021
Merged

fix(VCombobox): keep highlighted item on filteredItems change#14196
KaelWD merged 3 commits intovuetifyjs:masterfrom
yuwu9145:fix/14194-combobox-list-index

Conversation

@yuwu9145
Copy link
Copy Markdown
Member

@yuwu9145 yuwu9145 commented Sep 26, 2021

fixes #14194 #6607

Description

This pull request fixes #14194 as well as keeps fixing #6607

Test cases are added to cover both #14194 & #6607

Motivation and Context

resolves #14194

How Has This Been Tested?

visually | unit

Markup:

Details
// Paste your FULL Playground.vue here
<template>
  <v-container>
     <v-combobox
        clearable
        dense
        filled
        hide-selected
        multiple
        persistent-hint
        small-chips
        :items="['a', 'aa', 'aaa', 'bar']"
        @update:list-index="console.log($event)"
      ></v-combobox>

      <v-combobox :items="todos" :auto-select-first="true"></v-combobox>
  </v-container>
</template>

<script>
export default {
   data: () => ({
    console,
    todos: [
      { text: "Learn JavaScript", done: false },
      { text: "Learn Vue", done: false },
      { text: "Play around in JSFiddle", done: true },
      { text: "Build something awesome", done: true }
    ]
  }),
  mounted () {
  }
};
</script>

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Improvement/refactoring (non-breaking change that doesn't add any features but makes things better)

Checklist:

  • The PR title is no longer than 64 characters.
  • The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and backwards compatible changes and next for non-backwards compatible changes).
  • My code follows the code style of this project.
  • I've added relevant changes to the documentation (applies to new features and breaking changes in core library)

@KaelWD
Copy link
Copy Markdown
Member

KaelWD commented Oct 12, 2021

This does fix example 3 from #14194, but example 1 isn't fixed and example 2 is fixed visually but still emits the incorrect index.

@yuwu9145
Copy link
Copy Markdown
Member Author

@KaelWD A comment was left in issue #14194.

Generally speaking, the issue is from Autocomplete (sample link has similar issue) and I will make one more fix in Autocomplete which shall cover Combobox as well.

@yuwu9145 yuwu9145 marked this pull request as draft October 13, 2021 09:57
@yuwu9145 yuwu9145 marked this pull request as ready for review October 15, 2021 11:49
@yuwu9145
Copy link
Copy Markdown
Member Author

yuwu9145 commented Oct 15, 2021

Fix has been done in VAutocomplete that covers both VAutocomplete & VCombobox. Therefore, sample link in VAutocomplete shall have the same behaviour of keep previous selection.

In addition, test cases are added to simulate both #14194 & #6607 to ensure this pull request does fix #14194 and does not introduce breaking changes to #6607

@yuwu9145 yuwu9145 changed the title fix(VCombobox): remove custom onFilteredItemsChanged fix(VCombobox): keep previous selection while menu list changed by new input Oct 15, 2021
@yuwu9145 yuwu9145 marked this pull request as draft October 21, 2021 21:08
@yuwu9145 yuwu9145 marked this pull request as ready for review October 27, 2021 21:44

this.$nextTick(this.updateSelf)
},
onFilteredItemsChanged (val: never[], oldVal: never[]) {
Copy link
Copy Markdown
Member Author

@yuwu9145 yuwu9145 Oct 27, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Initial purpose of having this function overrided can be found from this commit c84c2fb
image

As per my testing, after removing this function, in combobox, entering custom words that may loosely match items in the list remains working correctly.

In addition, ultimately, in terms of filteredItems watcher which is used to handle auto selection logic, it should behave the same for VAutocomplete & VCombobox ?

@KaelWD KaelWD added this to the v2.5.x milestone Oct 31, 2021
@KaelWD KaelWD changed the title fix(VCombobox): keep previous selection while menu list changed by new input fix(VCombobox): keep highlighted item on filteredItems change Oct 31, 2021
@KaelWD KaelWD merged commit da5493b into vuetifyjs:master Oct 31, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

C: VAutocomplete C: VCombobox T: bug Functionality that does not work as intended/expected

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug Report][2.5.8] Combobox list-index doesn't update correctly on input

3 participants