Cannot use color inputs in b-dropdown with Chrome

[edtownend]

Hi, first, thanks for a great package! We've got a color input inside a b-dropdown that has stopped working in Chrome since updating to the 2.0.x version. The reason appears to be that Chrome's colour picker opens a new window, which triggers a loss of focus to the dropdown and it, therefore, closes before the user can

Steps to reproduce the bug

1. Go to the JSFiddle example
2. Click on 'Dropdown'
3. Click the color input
4. Choose a color
5. The chosen colour will not be reflected next to 'selected color:' or if you reopen the drodown

Expected behavior

The dropdown should remain open while the user chooses a colour.

Versions

Libraries:

• BootstrapVue: 2.0.4#
• Bootstrap: 4.3.1
• Vue: 2.6.10

Environment:

• Device: Mac
• OS: 10.14.6
• Browser: Chrome
• Version: 78

Demo link

https://jsfiddle.net/1xkv45nh/

[Hiws]

There might be a better way, but this seems to be a working workaround for the time being.
Hope it helps.

https://jsfiddle.net/rao4m8gv/
I've only tested it in Chrome.

[tmorehouse]

This appears to be a race condition with the menu closing when the focus moves out of the menu to the native color picker dialog, as the menu normally closes when it looses focus.

Although I don't understand by Vue doesn't update the v-model when the menu is closes, as the input still exists in the DOM

I'm guessing that there might be a similar issue with a file input (which also opens a broswer native dialog)

[edtownend]

Cheers @Hiws, that does work so I'll use that for now. It doesn't seem the second color input outside of the dropdown is necessary, just the isPickingColor.

[Hiws]

Cheers @Hiws, that does work so I'll use that for now. It doesn't seem the second color input outside of the dropdown is necessary, just the isPickingColor.

Yeah sorry, i went through a few edits after posting the first one since i realised i made a mistake. The current one in the reply should be the most recent one

[tmorehouse]

It appears that PR #4329 will also fix this issue.

It will be available in the next release v2.1.0

[tmorehouse]

BootstrapVue v2.1.0 has been released, which has a fix for this issue.