diff --git a/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTest.php b/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTest.php
index 65ede4cfb3..3baeb2162f 100644
--- a/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTest.php
+++ b/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTest.php
@@ -18,56 +18,55 @@ class OffCanvasTest extends OffCanvasTestBase {
 
   /**
    * Tests that non-contextual links will work with the off-canvas dialog.
+   *
+   * @dataProvider themeDataProvider
    */
-  public function testOffCanvasLinks() {
-    // Test the same functionality on multiple themes.
-    foreach ($this->getTestThemes() as $theme) {
-      $this->enableTheme($theme);
-      $this->drupalGet('/off-canvas-test-links');
+  public function testOffCanvasLinks($theme) {
+    $this->enableTheme($theme);
+    $this->drupalGet('/off-canvas-test-links');
 
-      $page = $this->getSession()->getPage();
-      $web_assert = $this->assertSession();
-
-      // Make sure off-canvas dialog is on page when first loaded.
-      $web_assert->elementNotExists('css', '#drupal-off-canvas');
-
-      // Check opening and closing with two separate links.
-      // Make sure tray updates to new content.
-      // Check the first link again to make sure the empty title class is
-      // removed.
-      foreach (['1', '2', '1'] as $link_index) {
-        $this->assertOffCanvasDialog($link_index, 'side');
-        $header_text = $this->getOffCanvasDialog()->find('css', '.ui-dialog-title')->getText();
-        if ($link_index == '2') {
-          // Check no title behavior.
-          $web_assert->elementExists('css', '.ui-dialog-empty-title');
-          $this->assertEquals("\xc2\xa0", $header_text);
-
-          $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
-          $this->assertTrue(strstr($style, 'width: 555px;') !== FALSE, 'Dialog width respected.');
-          $page->clickLink("Click Me 1!");
-          $this->waitForOffCanvasToOpen();
-          $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
-          $this->assertTrue(strstr($style, 'width: 555px;') === FALSE, 'Dialog width reset to default.');
-        }
-        else {
-          // Check that header is correct.
-          $this->assertEquals("Thing $link_index", $header_text);
-          $web_assert->elementNotExists('css', '.ui-dialog-empty-title');
-        }
-      }
+    $page = $this->getSession()->getPage();
+    $web_assert = $this->assertSession();
 
-      // Test the off_canvas_top tray.
-      foreach ([1, 2] as $link_index) {
-        $this->assertOffCanvasDialog($link_index, 'top');
-        $this->clickLink("Open top panel $link_index");
+    // Make sure off-canvas dialog is on page when first loaded.
+    $web_assert->elementNotExists('css', '#drupal-off-canvas');
+
+    // Check opening and closing with two separate links.
+    // Make sure tray updates to new content.
+    // Check the first link again to make sure the empty title class is
+    // removed.
+    foreach (['1', '2', '1'] as $link_index) {
+      $this->assertOffCanvasDialog($link_index, 'side');
+      $header_text = $this->getOffCanvasDialog()->find('css', '.ui-dialog-title')->getText();
+      if ($link_index == '2') {
+        // Check no title behavior.
+        $web_assert->elementExists('css', '.ui-dialog-empty-title');
+        $this->assertEquals("\xc2\xa0", $header_text);
+
+        $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
+        $this->assertTrue(strstr($style, 'width: 555px;') !== FALSE, 'Dialog width respected.');
+        $page->clickLink("Click Me 1!");
+        $this->waitForOffCanvasToOpen();
         $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
-        if ($link_index === 1) {
-          $this->assertTrue((bool) strstr($style, 'height: auto;'));
-        }
-        else {
-          $this->assertTrue((bool) strstr($style, 'height: 421px;'));
-        }
+        $this->assertTrue(strstr($style, 'width: 555px;') === FALSE, 'Dialog width reset to default.');
+      }
+      else {
+        // Check that header is correct.
+        $this->assertEquals("Thing $link_index", $header_text);
+        $web_assert->elementNotExists('css', '.ui-dialog-empty-title');
+      }
+    }
+
+    // Test the off_canvas_top tray.
+    foreach ([1, 2] as $link_index) {
+      $this->assertOffCanvasDialog($link_index, 'top');
+      $this->clickLink("Open top panel $link_index");
+      $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
+      if ($link_index === 1) {
+        $this->assertTrue((bool) strstr($style, 'height: auto;'));
+      }
+      else {
+        $this->assertTrue((bool) strstr($style, 'height: 421px;'));
       }
     }
   }
diff --git a/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTestBase.php b/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTestBase.php
index 525e61b508..d1be71537d 100644
--- a/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTestBase.php
+++ b/core/modules/system/tests/src/FunctionalJavascript/OffCanvasTestBase.php
@@ -62,7 +62,11 @@ protected function enableTheme($theme) {
    * Waits for off-canvas dialog to open.
    */
   protected function waitForOffCanvasToOpen() {
-    $this->assertSession()->waitForId('#drupal-off-canvas');
+    $web_assert = $this->assertSession();
+    // Wait just slightly longer than the off-canvas dialog CSS animation.
+    // @see core/misc/dialog/off-canvas.motion.css
+    $this->getSession()->wait(800);
+    $web_assert->assertWaitOnAjaxRequest();
     $this->assertElementVisibleAfterWait('css', '#drupal-off-canvas');
   }
 
@@ -124,4 +128,18 @@ protected function assertElementVisibleAfterWait($selector, $locator, $timeout =
     $this->assertNotEmpty($this->assertSession()->waitForElementVisible($selector, $locator, $timeout));
   }
 
+  /**
+   * Dataprovider that returns theme name as the sole argument.
+   */
+  public function themeDataProvider() {
+    $themes = $this->getTestThemes();
+    $data = [];
+    foreach ($themes as $theme) {
+      $data[$theme] = [
+        $theme,
+      ];
+    }
+    return $data;
+  }
+
 }