Hide other options when select another combobox

All the option listing should be hidden when a user select a different
combobox instead.
Switch ul to react to focus instead of click

The option list now should react to the focus event instead of click.
This allows the tab into and out of to trigger the display option of the
option listing as well.
The test had to be changed over since .focus() method uses focus event
which doesn't bubble from shadow elements. Instead, I had to create JS's
FocusEvent and dispatch it manually.
Since focusout is dependant on the element itself, the document event
handler is no longer needed. This also means I'm  no longer testing two
comboboxes scenario since focusout should always fire when loses focus
on the original combobox before moving to the next anyway.