Skip to content

Commit

Permalink
fix(quantic): Clear icon not being displayed after selecting a sugges…
Browse files Browse the repository at this point in the history
…tion in quantic searchbox (#4481)

[SFINT-5711](https://coveord.atlassian.net/browse/SFINT-5711)

### ISSUE:

**Description:**

The clear input button is not being displayed on first render when the
query is not empty after selecting a suggestion/recent query on first
render


https://github.com/user-attachments/assets/633ddd45-f993-454c-b571-42c8b8e55b34


### SOLUTION PROPOSED:

Modified the `isQueryEmpty` getter to add the `&& !this.inputValue;` to
the check. This makes the `isQueryEmpty` getter evaluate properly and
therefore display the clear icon.


### DEMO:



https://github.com/user-attachments/assets/a7b878c4-aaca-47ee-b3b7-3cebb07277ee




[SFINT-5711]:
https://coveord.atlassian.net/browse/SFINT-5711?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ
  • Loading branch information
SimonMilord authored Oct 3, 2024
1 parent 5ba9101 commit 80e6ba1
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -802,6 +802,22 @@ describe('c-quantic-search-box-input', () => {
expect(input.style.height).toEqual(expectedCollapsedInputHeight);
});
});

describe('when the component renders with a value in the input', () => {
it('should display the clear icon', async () => {
const element = createTestComponent({
...defaultOptions,
inputValue: mockInputValue,
textarea: textareaValue,
});
await flushPromises();

const clearIcon = element.shadowRoot.querySelector(
selectors.searchBoxClearIcon
);
expect(clearIcon).not.toBeNull();
});
});
});
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -348,7 +348,7 @@ export default class QuanticSearchBoxInput extends LightningElement {
}

get isQueryEmpty() {
return !this.input?.value?.length;
return !this.input?.value && !this.inputValue;
}

/**
Expand Down

0 comments on commit 80e6ba1

Please sign in to comment.