Merge branch 'v4-dev' into v4-split-buttons

10 files changed, 16 insertions, 29 deletions

diff --git a/js/tests/visual/alert.html b/js/tests/visual/alert.html
index 60a140452..15fb3091a 100644
--- a/js/tests/visual/alert.html
+++ b/js/tests/visual/alert.html
@@ -11,9 +11,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Alert <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Alert <small>Bootstrap Visual Test</small></h1>
 
   <div class="alert alert-warning fade in">
     <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
diff --git a/js/tests/visual/button.html b/js/tests/visual/button.html
index a0388e777..570c9addd 100644
--- a/js/tests/visual/button.html
+++ b/js/tests/visual/button.html
@@ -11,12 +11,13 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Button <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Button <small>Bootstrap Visual Test</small></h1>
 
   <button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button>
 
+  <p>For checkboxes and radio buttons, ensure that keyboard behavior is functioning correctly.</p>
+  <p>Navigate to the checkboxes with the keyboard (generally, using <kbd>TAB</kbd> / <kbd>SHIFT + TAB</kbd>), and ensure that <kbd>SPACE</kbd> toggles the currently focused checkbox. Click on one of the checkboxes using the mouse, ensure that focus was correctly set on the actual checkbox, and that <kbd>SPACE</kbd> toggles the checkbox again.</p>
+
   <div class="btn-group" data-toggle="buttons">
     <label class="btn btn-primary">
       <input type="checkbox"> checkbox 1
@@ -29,6 +30,8 @@
     </label>
   </div>
 
+  <p>Navigate to the radio button group with the keyboard (generally, using <kbd>TAB</kbd> / <kbd>SHIFT + TAB</kbd>). If no radio button was initially set to be selected, the first/last radio button should receive focus (depending on whether you navigated "forward" to the group with <kbd>TAB</kbd> or "backwards" using <kbd>SHIFT + TAB</kbd>). If a radio button was already selected, navigating with the keyboard should set focus to that particular radio button. Only one radio button in a group should receive focus at any given time.  Ensure that the selected radio button can be changed by using the <kbd>←</kbd> and <kbd>→</kbd> arrow keys. Click on one of the radio buttons with the mouse,  ensure that focus was correctly set on the actual radio button, and that <kbd>←</kbd> and <kbd>→</kbd> change the selected radio button again.</p>
+
   <div class="btn-group" data-toggle="buttons">
     <label class="btn btn-primary">
       <input type="radio" name="options" id="option1"> Radio 1
diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html
index 3930755b7..dec42c9cb 100644
--- a/js/tests/visual/carousel.html
+++ b/js/tests/visual/carousel.html
@@ -11,9 +11,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Carousel <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Carousel <small>Bootstrap Visual Test</small></h1>
   <p>Also, the carousel shouldn't slide when its window/tab is hidden. Check the console log.</p>
   <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
     <ol class="carousel-indicators">
diff --git a/js/tests/visual/collapse.html b/js/tests/visual/collapse.html
index a930ab0c6..57c5562c0 100644
--- a/js/tests/visual/collapse.html
+++ b/js/tests/visual/collapse.html
@@ -11,9 +11,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Collapse <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Collapse <small>Bootstrap Visual Test</small></h1>
 
   <div class="panel-group" id="accordion">
     <div class="panel panel-default">
diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html
index f0d6f159e..10cf6dad9 100644
--- a/js/tests/visual/dropdown.html
+++ b/js/tests/visual/dropdown.html
@@ -11,11 +11,9 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Dropdown <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Dropdown <small>Bootstrap Visual Test</small></h1>
 
-  <nav id="navbar-example" class="navbar navbar-light bg-faded" role="navigation">
+  <nav id="navbar-example" class="navbar navbar-light bg-faded">
     <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar2">
       &#9776;
     </button>
diff --git a/js/tests/visual/modal.html b/js/tests/visual/modal.html
index 7e54f7aa2..bfc95ad5d 100644
--- a/js/tests/visual/modal.html
+++ b/js/tests/visual/modal.html
@@ -42,9 +42,7 @@
 
 <div class="container m-t-lg">
 
-  <div class="page-header">
-    <h1>Modal <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Modal <small>Bootstrap Visual Test</small></h1>
 
   <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
     <div class="modal-dialog" role="document">
diff --git a/js/tests/visual/popover.html b/js/tests/visual/popover.html
index 533af2bbd..927e71b00 100644
--- a/js/tests/visual/popover.html
+++ b/js/tests/visual/popover.html
@@ -11,9 +11,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Popover <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Popover <small>Bootstrap Visual Test</small></h1>
 
   <button type="button" class="btn btn-default js-popover" data-container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">
     Popover on left
diff --git a/js/tests/visual/scrollspy.html b/js/tests/visual/scrollspy.html
index dc1dfc82f..efe6f593b 100644
--- a/js/tests/visual/scrollspy.html
+++ b/js/tests/visual/scrollspy.html
@@ -14,7 +14,7 @@
 
 <div class="container">
 
-  <nav class="navbar navbar-dark navbar-fixed-top bg-inverse" role="navigation">
+  <nav class="navbar navbar-dark navbar-fixed-top bg-inverse">
     <div class="js-navbar-scrollspy">
       <ul class="nav navbar-nav">
         <li class="nav-item"><a class="nav-link active" href="#fat">@fat</a></li>
diff --git a/js/tests/visual/tab.html b/js/tests/visual/tab.html
index ae7511f55..d09622d72 100644
--- a/js/tests/visual/tab.html
+++ b/js/tests/visual/tab.html
@@ -20,9 +20,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Tab <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Tab <small>Bootstrap Visual Test</small></h1>
 
   <h4>Tabs without fade</h4>
 
diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html
index 96ede67ef..f6b64ce95 100644
--- a/js/tests/visual/tooltip.html
+++ b/js/tests/visual/tooltip.html
@@ -11,9 +11,7 @@
 
 <div class="container">
 
-  <div class="page-header">
-    <h1>Tooltip <small>Bootstrap Visual Test</small></h1>
-  </div>
+  <h1>Tooltip <small>Bootstrap Visual Test</small></h1>
 
   <p class="muted" style="margin-bottom: 0;">Tight pants next level keffiyeh <a href="#" data-toggle="tooltip" title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" data-toggle="tooltip" title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" data-toggle="tooltip" title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" data-toggle="tooltip" title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
   </p>