Reactivesearch: vue: Selected Filters component is broken starting on version 1.4.2-vue

[acosta-edgar]

Affected Projects
Vue.JS

Library Version: 1.4.2
It is still an issue

Describe the bug
Starting on version 1.4.2-vue removing a selected filter by clicking the "x" button on the respective bubble does not remove the bubble and creates an illegal query.

Steps To Reproduce
This code sandbox uses version 1.4.2, but it can be replaced on package.json (line 16) for any newer version
https://codesandbox.io/s/booksearch-all-components-gdj5n

2 variations of the behaviour:

Ugliest behaviour

• type something in the Search for a book search box (the first one)
  e.g. Artemis
• search for it and you'll get books that match the search (3 results if we typed Artemis)
• you will also see a selected filter bubble that starts with "title:" followed by the search term
• click on the "x" button of the selected filter bubble
• Problem 1: the bubble didn't disappear and it no longer contains the search term,
• Problem 2: the search results were not updated
• Problem 3: the search box now shows "[object Object]"

What is going on?

• instead of clearing the filter, the filter value is now set to some value that is represented as "[object Object]", but it evaluates as null, and in elasticsearch it is illegal to match null. Therefore, the bubble is still visible and the query fails, which results in not updating the results

Another behaviour that is not as bad

• clear all the filters
• select one author from the author filter
  e.g. Nora Roberts, which yields 59 results
• the results are shown
• you will also see a selected filter bubble that starts with "Authors:" followed by the selected author name
• click on the "x" button of the selected filter bubble
• the results are updated, however
• Problem 1: the bubble didn't disappear and it no longer contains the search term

Expected behavior
When clicking the "x" button:

• the bubble disappears
• the results are updated accordingly
• if the filter is a search term, then the search box should be cleared.

You can observe the right behaviour by simple downgrading to version 1.4.1 in file package.json (line 16)

Additional context

Commit 667c41c64d8fb17ebee887c2594190352803dbe6 (released on 1.4.2-vue)introduces this bug
Note: @bietkul authored this change

[bietkul]

Thanks @acosta-edgar for reporting this, we'll check on that.

[bietkul]

@acosta-edgar Fixed in v1.6.2.