search

shentao / vue-multiselect

Universal select/multiselect/tagging component for Vue.js
https://vue-multiselect.js.org/
MIT License
6.73k stars 993 forks source link

Prevent flash of select content before closing select #1479

Open nathanaelbice opened 3 years ago

nathanaelbice commented 3 years ago

Reproduction Link

https://jsfiddle.net/0jsen7h6/ Also can be seen in the documentation here. https://vue-multiselect.js.org/#sub-single-select-object

Steps to reproduce

  1. Create a single select with options and include any deselectLabel, including the default value.
  2. Open the select and pick an option
  3. Notice the flash of red from the deselectLabel appearing before the select fully closes

Expected behaviour

The select should close before displaying the deselectLabel, since the css is quite jarring and out of place.

Actual behaviour

The deselectLabel appears with a red background before select fully closes, giving a flash of content that is out of place.

akki-jat commented 2 years ago

@nathanaelbice - Unable to reproduce this and your reproduction link is not working.

nathanael-bice commented 2 years ago

@akki-jat The demo in the documentation at this link is also reproducing this issue. https://vue-multiselect.js.org/#sub-single-select-object

akki-jat commented 2 years ago

@nathanael-bice - Not able to see any flash.

@mattelen - See if you see any flash.

nathanael-bice commented 2 years ago

I attempted to create a GIF demonstrating the flash. This was creating using a screen recording program while working in Chrome on the above link.

2022-10-28_13-39-06

akki-jat commented 2 years ago

@nathanael-bice Thanks for this. I can see what the issue is.