Add aria-live announcement to notify users of the route change (#14284)

* Add aria-live to search results

* Add aria-live inside page-content-inner

* Update title variable and aria-live attribute

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>

app/assets/javascripts/base.js.erb

@@ -132,6 +132,7 @@ var instantClick
           skipLink.focus();
         }
       }
+      document.getElementById('page-route-change').textContent = title;
       history.pushState(null, null, newUrl.replace("?samepage=true","").replace("&samepage=true",""))
 
       var hashIndex = newUrl.indexOf('#'),

app/views/layouts/application.html.erb

@@ -92,6 +92,7 @@
     </div>
   <% end %>
   <div id="page-content-inner">
+    <div id="page-route-change" class="screen-reader-only" aria-live="polite" aria-atomic="true"></div>
     <% if @hero_html %>
       <div id="hero-html-wrapper" class="overflow-x-hidden" data-name="<%= @hero_area.name %>">
         <script>