Olivero: Wide search form should close on blur

I had to use the focusout event, but this patch is working great.

Looks good to me! Still needs review from someone else as I wrote the majority of the code.

Thanks for the fix @Gauravmahlawat

Adding testing instructions, and tugboat link: https://3226785-wide-search-blur-ndgukawgpielewnzaznw3cxtmoia97gi.tugboa...

Added tests. Also, we had a click event listener on the document that was used to close the search form when something other than the search form was clicked. Since we're now closing the search form on focusout. I refactored this to put the event listener on the search disclosure button, and have that simply toggle the form visibility.

Note I'm also applying these changes to the Tugboat preview: https://3226785-wide-search-blur-ndgukawgpielewnzaznw3cxtmoia97gi.tugboa...

Updated tests.

The searchWideButton isn't being added by this patch, so lets defer that.

I'm just going to remove the timeout. It's not needed.

Tests are failing :(

[0;32m✔[0m Testing if attribute [0;33m'aria-expanded'[0m of element [0;33m<button.block-search-wide__button>[0m equals [0;33m'false'[0m [0;90m(14ms)[0m
 [1;31mError while running .clickElement() protocol action: An element command could not be completed because the element is not visible on the page. – element not visible
[0m
[0;31m✖[0m Timed out while waiting for element <#edit-keys--2> to be visible for 5000 milliseconds. - expected [0;32m"visible"[0m but got: [0;31m"not visible"[0m [0;90m(5119ms)[0m
[0;90m    at Object.search wide form is accessible and altered (/var/www/html/core/tests/Drupal/Nightwatch/Tests/Olivero/oliveroSearchFormTest.js:69:8)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)[0m 


[0;31mFAILED:[0m [0;31m1[0m assertions failed, [0;31m1[0m errors and  [0;32m10[0m passed (6.314s)

Fixed tests (hopefully)!

Still failing

[0;32m✔[0m Element <.block-search-wide__wrapper> was not visible after 536 milliseconds.
[0;32m✔[0m Testing if attribute [0;33m'aria-expanded'[0m of element [0;33m<button.block-search-wide__button>[0m equals [0;33m'false'[0m [0;90m(14ms)[0m
 [1;31mError while running .clickElement() protocol action: An element command could not be completed because the element is not visible on the page. – element not visible
[0m
[0;31m✖[0m Timed out while waiting for element <#edit-keys--2> to be visible for 5000 milliseconds. - expected [0;32m"visible"[0m but got: [0;31m"not visible"[0m [0;90m(5109ms)[0m
[0;90m    at Object.search wide form is accessible and altered (/var/www/html/core/tests/Drupal/Nightwatch/Tests/Olivero/oliveroSearchFormTest.js:70:8)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)[0m 


[0;31mFAILED:[0m [0;31m1[0m assertions failed, [0;31m1[0m errors and  [0;32m10[0m passed (6.691s)

[0;36m[Olivero/Olivero Sticky Header Toggle Test] Test Suite[0m
[0;35m======================================================[0m

These tests pass on my local, so it's hard to debug.

I think we're running into another CSS transition animation issue. Adding delay.

🤞🤞🤞🤞🤞🤞🤞

Yay!

Re-uploading the same patch along with the test by itself (so committers can see the failure).

Tugboat preview at https://3226785-wide-search-blur-2-u5r32gkuptbfrviscfbruwee2wditkcl.tugb...

Updating tugboat link in summary.