jQuery .focus() not working in Safari (desktop) on search field
<p>I have a search field that is hidden, and when a user clicks on the search icon, it opens and I want to bring focus to the search input immediately so the user does not have to click twice. It works perfect in Chrome, but not in Safari (desktop). I saw some other suggestions that wrapping it in a timeout will work, but still no dice. Any thoughts?</p>

<p>jQuery:</p>

<pre><code>$search       = $('.header--search-container');
$searchInput  = $('.header--search-input input[type=search]');

  $search.click(function(){
    $searchInput.toggleClass('search-active');
    setTimeout(function(){
      $('header .header--search-input .search-field').focus();
    }, 1);
  });
</code></pre>

<p>HTML (Don't really think its needed but just so you can see... Also redacted is the <code>&lt;header&gt;</code> element) :</p>

<pre><code>&lt;div class="header--search-input"&gt;
      &lt;form role="search" method="get" class="search-form" action="http://example.com/"&gt;
       &lt;label&gt;
         &lt;span class="screen-reader-text"&gt;Search for:&lt;/span&gt;
         &lt;input type="search" class="search-field" placeholder="Search &amp;hellip;" value="" name="s" /&gt;
        &lt;/label&gt;
        &lt;input type="submit" class="search-submit" value="Search" /&gt;
       &lt;/form&gt;        
 &lt;/div&gt;
        &lt;div class="header--search-container"&gt;
          &lt;svg&gt; 
           .. redacted for legibility on stack overflow ..
          &lt;/svg&gt;

        &lt;/div&gt;
</code></pre>