[A11y] Make screen readers start with packages list on Search Page. (#9465)

* focus when Search buttons are clicked.

* nit.

Author: Daniel Jacinto

src/NuGetGallery/Scripts/gallery/page-list-packages.js

@@ -3,6 +3,14 @@ $(function() {
 
     $(".reserved-indicator").each(window.nuget.setPopovers);
 
+    const storage = window['localStorage'];
+    const focusResultsColumnKey = 'focus_results_column';
+
+    if (storage && storage.getItem(focusResultsColumnKey)) {
+        storage.removeItem(focusResultsColumnKey);
+        document.getElementById('results-column').focus({ preventScroll: true });
+    }
+
     const searchForm = document.forms.search;
     const allFrameworks = document.querySelectorAll('.framework');
     const allTfms = document.querySelectorAll('.tfm');
@@ -69,6 +77,11 @@ $(function() {
     function submitSearchForm() {
         constructFilterParameter(searchForm.frameworks, allFrameworks);
         constructFilterParameter(searchForm.tfms, allTfms);
+
+        if (storage) {
+            storage.setItem(focusResultsColumnKey, true);
+        }
+
         searchForm.submit();
     }
 

src/NuGetGallery/Views/Shared/ListPackages.cshtml

@@ -135,7 +135,7 @@
                     </div>
                 }
             </div>
-            <div class="@(Model.IsAdvancedSearchFlightEnabled ? "col-md-9" : "col-md-12")" id="results-column">
+            <div class="@(Model.IsAdvancedSearchFlightEnabled ? "col-md-9" : "col-md-12")" id="results-column" tabindex="0">
                 <div class="row">
                     <div class="col-md-9">
                         <h1 tabindex="0">