diff --git a/core/modules/outside_in/css/offcanvas.css b/core/modules/outside_in/css/off-canvas.css
similarity index 51%
rename from core/modules/outside_in/css/offcanvas.css
rename to core/modules/outside_in/css/off-canvas.css
index fb671dbbf377e042a3d3dd37763aa7ccdf4596f9..05ab5398742eca323dccd19b40609579e8347589 100644
--- a/core/modules/outside_in/css/offcanvas.css
+++ b/core/modules/outside_in/css/off-canvas.css
@@ -1,23 +1,23 @@
 /**
  * @file
- * CSS for Offcanvas tray.
+ * CSS for off-canvas dialog.
  *
  * @todo Move CSS into core dialog library https://www.drupal.org/node/2784443.
  */
-/* Position the dialog-offcanvas tray container outside the right of the viewport. */
-.ui-dialog-offcanvas {
+/* Position the off-canvas dialog container outside the right of the viewport. */
+.ui-dialog-off-canvas {
     box-sizing: border-box;
     height: 100%;
     overflow: visible;
 }
 
-/* Wrap the form that's inside the dialog-offcanvas tray. */
-.ui-dialog-offcanvas .ui-dialog-content {
+/* Wrap the form that's inside the off-canvas dialog. */
+.ui-dialog-off-canvas .ui-dialog-content {
     padding: 0 20px;
     /* Prevent horizontal scrollbar. */
     overflow-x: hidden;
     overflow-y: auto;
 }
-[dir="rtl"] .ui-dialog-offcanvas .ui-dialog-content {
+[dir="rtl"] .ui-dialog-off-canvas .ui-dialog-content {
     text-align: right;
 }
diff --git a/core/modules/outside_in/css/offcanvas.motion.css b/core/modules/outside_in/css/off-canvas.motion.css
similarity index 72%
rename from core/modules/outside_in/css/offcanvas.motion.css
rename to core/modules/outside_in/css/off-canvas.motion.css
index 1c069940717bad7d433469317488a35e5868a457..a6217eec720f2701fb04ca8939ea5697c1cb9678 100644
--- a/core/modules/outside_in/css/offcanvas.motion.css
+++ b/core/modules/outside_in/css/off-canvas.motion.css
@@ -1,6 +1,6 @@
 /**
  * @file
- * Motion effects for off-canvas tray dialog.
+ * Motion effects for off-canvas dialog.
  *
  * Motion effects are in a separate file so that they can be easily turned off
  * to improve performance if desired.
@@ -10,22 +10,22 @@
  *   file: https://www.drupal.org/node/2784443.
  */
 
-/* Transition the dialog-offcanvas tray container, with 2s delay to match main canvas speed. */
-.ui-dialog-offcanvas .ui-dialog-content {
+/* Transition the off-canvas dialog container, with 2s delay to match main canvas speed. */
+.ui-dialog-off-canvas .ui-dialog-content {
     -webkit-transition: all .7s ease 2s;
     -moz-transition: all .7s ease 2s;
     transition: all .7s ease 2s;
 }
 
 @media (max-width: 700px) {
-    .ui-dialog-offcanvas .ui-dialog-content {
+    .ui-dialog-off-canvas .ui-dialog-content {
         -webkit-transition: all .7s ease;
         -moz-transition: all .7s ease;
         transition: all .7s ease;
     }
 }
 
-.dialog-offcanvas__main-canvas {
+.dialog-off-canvas__main-canvas {
   -webkit-transition: all .7s ease;
   -moz-transition: all .7s ease;
   transition: all .7s ease;
diff --git a/core/modules/outside_in/css/outside_in.module.css b/core/modules/outside_in/css/outside_in.module.css
index 5ac00ab42e50aa2f60a8f2de1cd12934be3fc4ca..9d90bf227d4517d2748e261e57102c4bbea01a41 100644
--- a/core/modules/outside_in/css/outside_in.module.css
+++ b/core/modules/outside_in/css/outside_in.module.css
@@ -27,7 +27,7 @@
  * to expand dialog widths.
  */
 @media all and (max-width: 48em) { /* 768px */
-  .ui-dialog.ui-dialog-offcanvas {
+  .ui-dialog.ui-dialog-off-canvas {
     width: 100% !important;
   }
   /* When tray is at 100% width stop the body from scrolling */
diff --git a/core/modules/outside_in/css/outside_in.motion.css b/core/modules/outside_in/css/outside_in.motion.css
index 450bffe77ba041ae2bb3bf6af35fa083d6810ecc..3c86aca36397648d2a1ff48b5cba2f5d825e034d 100644
--- a/core/modules/outside_in/css/outside_in.motion.css
+++ b/core/modules/outside_in/css/outside_in.motion.css
@@ -19,9 +19,9 @@
 }
 
 /* Transition the editables on the page, their contextual links and their hover states. */
-.dialog-offcanvas__main-canvas .contextual,
-.dialog-offcanvas__main-canvas .js-outside-in-edit-mode .outside-in-editable,
-.dialog-offcanvas__main-canvas.js-tray-open .js-outside-in-edit-mode .outside-in-editable {
+.dialog-off-canvas__main-canvas .contextual,
+.dialog-off-canvas__main-canvas .js-outside-in-edit-mode .outside-in-editable,
+.dialog-off-canvas__main-canvas.js-tray-open .js-outside-in-edit-mode .outside-in-editable {
   -webkit-transition: all .7s ease;
   -moz-transition: all .7s ease;
   transition: all .7s ease;
diff --git a/core/modules/outside_in/css/outside_in.theme.css b/core/modules/outside_in/css/outside_in.theme.css
index 91c01abfd8c066fb3f2a6d72f71e06f1c78506b1..011d198daed209e0d449c54ad3222934f04c98e5 100644
--- a/core/modules/outside_in/css/outside_in.theme.css
+++ b/core/modules/outside_in/css/outside_in.theme.css
@@ -60,16 +60,16 @@
 }
 
 /* Style the editables while in edit mode. */
-.dialog-offcanvas__main-canvas.js-outside-in-edit-mode .outside-in-editable {
+.dialog-off-canvas__main-canvas.js-outside-in-edit-mode .outside-in-editable {
   outline: 1px dashed rgba(0,0,0,0.5);
   box-shadow: 0 0 0 1px rgba(255,255,255,0.7);
 }
-.dialog-offcanvas__main-canvas.js-outside-in-edit-mode .outside-in-editable:hover,
-.dialog-offcanvas__main-canvas.js-outside-in-edit-mode .outside-in-editable.outside-in-active-editable {
+.dialog-off-canvas__main-canvas.js-outside-in-edit-mode .outside-in-editable:hover,
+.dialog-off-canvas__main-canvas.js-outside-in-edit-mode .outside-in-editable.outside-in-active-editable {
   background-color: rgba(0,0,0,0.2);
 }
 
-/* Style the dialog-offcanvas container. */
+/* Style the dialog-off-canvas container. */
 .ui-dialog-outside-in {
   background: #444;
   border: 0 solid transparent;
diff --git a/core/modules/outside_in/js/offcanvas.js b/core/modules/outside_in/js/off-canvas.js
similarity index 77%
rename from core/modules/outside_in/js/offcanvas.js
rename to core/modules/outside_in/js/off-canvas.js
index 74cd32c964390ab46285b7fac44cca25d10e6aba..d7c8d906f6ba21a4d93978e2ecf1808971a25d38 100644
--- a/core/modules/outside_in/js/offcanvas.js
+++ b/core/modules/outside_in/js/off-canvas.js
@@ -22,7 +22,7 @@
    */
   var edge = document.documentElement.dir === 'rtl' ? 'left' : 'right';
 
-  var $mainCanvasWrapper = $('[data-offcanvas-main-canvas]');
+  var $mainCanvasWrapper = $('[data-off-canvas-main-canvas]');
 
   /**
    * Resets the size of the dialog.
@@ -51,7 +51,7 @@
 
     $element
       .dialog('option', adjustedOptions)
-      .trigger('dialogContentResize.offcanvas');
+      .trigger('dialogContentResize.off-canvas');
   }
 
   /**
@@ -64,7 +64,7 @@
     var $element = event.data.$element;
     var $widget = $element.dialog('widget');
 
-    var $offsets = $widget.find('> :not(#drupal-offcanvas, .ui-resizable-handle)');
+    var $offsets = $widget.find('> :not(#drupal-off-canvas, .ui-resizable-handle)');
     var offset = 0;
     var modalHeight;
 
@@ -112,25 +112,25 @@
     attach: function () {
       $(window).once('off-canvas').on({
         'dialog:aftercreate': function (event, dialog, $element, settings) {
-          if ($element.is('#drupal-offcanvas')) {
+          if ($element.is('#drupal-off-canvas')) {
             var eventData = {settings: settings, $element: $element};
-            $('.ui-dialog-offcanvas, .ui-dialog-offcanvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title);
+            $('.ui-dialog-off-canvas, .ui-dialog-off-canvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title);
 
             $element
-              .on('dialogresize.offcanvas', eventData, debounce(bodyPadding, 100))
-              .on('dialogContentResize.offcanvas', eventData, handleDialogResize)
-              .on('dialogContentResize.offcanvas', eventData, debounce(bodyPadding, 100))
-              .trigger('dialogresize.offcanvas');
+              .on('dialogresize.off-canvas', eventData, debounce(bodyPadding, 100))
+              .on('dialogContentResize.off-canvas', eventData, handleDialogResize)
+              .on('dialogContentResize.off-canvas', eventData, debounce(bodyPadding, 100))
+              .trigger('dialogresize.off-canvas');
 
             $element.dialog('widget').attr('data-offset-' + edge, '');
 
             $(window)
-              .on('resize.offcanvas scroll.offcanvas', eventData, debounce(resetSize, 100))
-              .trigger('resize.offcanvas');
+              .on('resize.off-canvas scroll.off-canvas', eventData, debounce(resetSize, 100))
+              .trigger('resize.off-canvas');
           }
         },
         'dialog:beforecreate': function (event, dialog, $element, settings) {
-          if ($element.is('#drupal-offcanvas')) {
+          if ($element.is('#drupal-off-canvas')) {
             $('body').addClass('js-tray-open');
             // @see http://api.jqueryui.com/position/
             settings.position = {
@@ -138,18 +138,18 @@
               at: edge + ' top',
               of: window
             };
-            settings.dialogClass += ' ui-dialog-offcanvas';
+            settings.dialogClass += ' ui-dialog-off-canvas';
             // Applies initial height to dialog based on window height.
             // See http://api.jqueryui.com/dialog for all dialog options.
             settings.height = $(window).height();
           }
         },
         'dialog:beforeclose': function (event, dialog, $element) {
-          if ($element.is('#drupal-offcanvas')) {
+          if ($element.is('#drupal-off-canvas')) {
             $('body').removeClass('js-tray-open');
-            // Remove all *.offcanvas events
-            $(document).off('.offcanvas');
-            $(window).off('.offcanvas');
+            // Remove all *.off-canvas events
+            $(document).off('.off-canvas');
+            $(window).off('.off-canvas');
             $mainCanvasWrapper.css('padding-' + edge, 0);
           }
         }
diff --git a/core/modules/outside_in/js/outside_in.js b/core/modules/outside_in/js/outside_in.js
index c038cd21d08426c5ac0d79f9afb4b35a5a6e22a1..b4bca7d0180eab8caef8f2a943278ebcd8ee5b94 100644
--- a/core/modules/outside_in/js/outside_in.js
+++ b/core/modules/outside_in/js/outside_in.js
@@ -9,7 +9,7 @@
 
   var blockConfigureSelector = '[data-outside-in-edit]';
   var toggleEditSelector = '[data-drupal-outsidein="toggle"]';
-  var itemsToToggleSelector = '[data-offcanvas-main-canvas], #toolbar-bar, [data-drupal-outsidein="editable"] a, [data-drupal-outsidein="editable"] button';
+  var itemsToToggleSelector = '[data-off-canvas-main-canvas], #toolbar-bar, [data-drupal-outsidein="editable"] a, [data-drupal-outsidein="editable"] button';
   var contextualItemsSelector = '[data-contextual-id] a, [data-contextual-id] button';
   var quickEditItemSelector = '[data-quickedit-entity-id]';
 
@@ -111,10 +111,10 @@
   }
 
   /**
-   * Closes/removes offcanvas.
+   * Closes/removes off-canvas.
    */
   function closeOffCanvas() {
-    $('.ui-dialog-offcanvas .ui-dialog-titlebar-close').trigger('click');
+    $('.ui-dialog-off-canvas .ui-dialog-titlebar-close').trigger('click');
   }
 
   /**
@@ -135,7 +135,7 @@
       $editables = $('[data-drupal-outsidein="editable"]').once('outsidein');
       if ($editables.length) {
         // Use event capture to prevent clicks on links.
-        document.querySelector('[data-offcanvas-main-canvas]').addEventListener('click', preventClick, true);
+        document.querySelector('[data-off-canvas-main-canvas]').addEventListener('click', preventClick, true);
 
         // When a click occurs try and find the outside-in edit link
         // and click it.
@@ -152,7 +152,7 @@
         $(quickEditItemSelector)
           .not(contextualItemsSelector)
           .on('click.outsidein', function (e) {
-            // For all non-contextual links or the contextual QuickEdit link close the off-canvas tray.
+            // For all non-contextual links or the contextual QuickEdit link close the off-canvas dialog.
             if (!$(e.target).parent().hasClass('contextual') || $(e.target).parent().hasClass('quickedit')) {
               closeOffCanvas();
             }
@@ -168,7 +168,7 @@
     else {
       $editables = $('[data-drupal-outsidein="editable"]').removeOnce('outsidein');
       if ($editables.length) {
-        document.querySelector('[data-offcanvas-main-canvas]').removeEventListener('click', preventClick, true);
+        document.querySelector('[data-off-canvas-main-canvas]').removeEventListener('click', preventClick, true);
         $editables.off('.outsidein');
         $(quickEditItemSelector).off('.outsidein');
       }
@@ -212,19 +212,19 @@
       $(toggleEditSelector).once('outsidein').on('click.outsidein', toggleEditMode);
 
       var search = Drupal.ajax.WRAPPER_FORMAT + '=drupal_dialog';
-      var replace = Drupal.ajax.WRAPPER_FORMAT + '=drupal_dialog_offcanvas';
-      // Loop through all Ajax links and change the format to dialog-offcanvas when
+      var replace = Drupal.ajax.WRAPPER_FORMAT + '=drupal_dialog_off_canvas';
+      // Loop through all Ajax links and change the format to dialog-off-canvas when
       // needed.
       Drupal.ajax.instances
         .filter(function (instance) {
           var hasElement = instance && !!instance.element;
-          var rendererOffcanvas = false;
-          var wrapperOffcanvas = false;
+          var rendererOffCanvas = false;
+          var wrapperOffCanvas = false;
           if (hasElement) {
-            rendererOffcanvas = $(instance.element).attr('data-dialog-renderer') === 'offcanvas';
-            wrapperOffcanvas = instance.options.url.indexOf('drupal_dialog_offcanvas') === -1;
+            rendererOffCanvas = $(instance.element).attr('data-dialog-renderer') === 'off_canvas';
+            wrapperOffCanvas = instance.options.url.indexOf('drupal_dialog_off_canvas') === -1;
           }
-          return hasElement && rendererOffcanvas && wrapperOffcanvas;
+          return hasElement && rendererOffCanvas && wrapperOffCanvas;
         })
         .forEach(function (instance) {
           // @todo Move logic for data-dialog-renderer attribute into ajax.js
@@ -243,7 +243,7 @@
   // Manage Active editable class on opening and closing of the dialog.
   $(window).on({
     'dialog:beforecreate': function (event, dialog, $element, settings) {
-      if ($element.is('#drupal-offcanvas')) {
+      if ($element.is('#drupal-off-canvas')) {
         $('body .outside-in-active-editable').removeClass('outside-in-active-editable');
         var $activeElement = $('#' + settings.outsideInActiveEditableId);
         if ($activeElement.length) {
@@ -253,7 +253,7 @@
       }
     },
     'dialog:beforeclose': function (event, dialog, $element) {
-      if ($element.is('#drupal-offcanvas')) {
+      if ($element.is('#drupal-off-canvas')) {
         $('body .outside-in-active-editable').removeClass('outside-in-active-editable');
       }
     }
diff --git a/core/modules/outside_in/outside_in.libraries.yml b/core/modules/outside_in/outside_in.libraries.yml
index 5eddea4ca6ea1f3409bc5302855b94908aa50179..5c388b82f140842a92b0d4176b60f28e652eb7ce 100644
--- a/core/modules/outside_in/outside_in.libraries.yml
+++ b/core/modules/outside_in/outside_in.libraries.yml
@@ -23,7 +23,7 @@ drupal.outside_in:
 drupal.off_canvas:
   version: VERSION
   js:
-    js/offcanvas.js: {}
+    js/off-canvas.js: {}
   dependencies:
     - core/jquery
     - core/drupal
diff --git a/core/modules/outside_in/outside_in.links.contextual.yml b/core/modules/outside_in/outside_in.links.contextual.yml
index 99b36eff00c376ac314a6189047de8f7bcda861b..b0c0f13d1ef95030710b5c75d847c3f7c563b16a 100644
--- a/core/modules/outside_in/outside_in.links.contextual.yml
+++ b/core/modules/outside_in/outside_in.links.contextual.yml
@@ -1,4 +1,4 @@
 outside_in.block_configure:
   title: 'Quick edit'
-  route_name: 'entity.block.offcanvas_form'
+  route_name: 'entity.block.off_canvas_form'
   group: 'block'
diff --git a/core/modules/outside_in/outside_in.module b/core/modules/outside_in/outside_in.module
index 9a0e629465003045c3129ad8ac5e60f2feb81275..6673fa37185c100c85c2a2ab0ea3259f330fd329 100644
--- a/core/modules/outside_in/outside_in.module
+++ b/core/modules/outside_in/outside_in.module
@@ -30,7 +30,7 @@ function outside_in_help($route_name, RouteMatchInterface $route_match) {
 /**
  * Implements hook_contextual_links_view_alter().
  *
- * Change Configure Blocks into offcanvas links.
+ * Change Configure Blocks into off_canvas links.
  */
 function outside_in_contextual_links_view_alter(&$element, $items) {
   if (isset($element['#links']['outside-inblock-configure'])) {
@@ -42,7 +42,7 @@ function outside_in_contextual_links_view_alter(&$element, $items) {
     $element['#links']['outside-inblock-configure']['attributes'] = [
       'class' => ['use-ajax'],
       'data-dialog-type' => 'dialog',
-      'data-dialog-renderer' => 'offcanvas',
+      'data-dialog-renderer' => 'off_canvas',
       'data-outside-in-edit' => TRUE,
     ];
     // If this is content block change title to avoid duplicate "Quick Edit".
@@ -92,8 +92,8 @@ function outside_in_theme() {
 function outside_in_entity_type_build(array &$entity_types) {
   /* @var $entity_types \Drupal\Core\Entity\EntityTypeInterface[] */
   $entity_types['block']
-    ->setFormClass('offcanvas', BlockEntityOffCanvasForm::class)
-    ->setLinkTemplate('offcanvas-form', '/admin/structure/block/manage/{block}/offcanvas');
+    ->setFormClass('off_canvas', BlockEntityOffCanvasForm::class)
+    ->setLinkTemplate('off_canvas-form', '/admin/structure/block/manage/{block}/off-canvas');
 }
 
 /**
@@ -139,14 +139,14 @@ function outside_in_toolbar_alter(&$items) {
  */
 function outside_in_block_alter(&$definitions) {
   if (!empty($definitions['system_branding_block'])) {
-    $definitions['system_branding_block']['forms']['offcanvas'] = SystemBrandingOffCanvasForm::class;
+    $definitions['system_branding_block']['forms']['off_canvas'] = SystemBrandingOffCanvasForm::class;
   }
 
   // Since menu blocks use derivatives, check the definition ID instead of
   // relying on the plugin ID.
   foreach ($definitions as &$definition) {
     if ($definition['id'] === 'system_menu_block') {
-      $definition['forms']['offcanvas'] = SystemMenuOffCanvasForm::class;
+      $definition['forms']['off_canvas'] = SystemMenuOffCanvasForm::class;
     }
   }
 }
diff --git a/core/modules/outside_in/outside_in.routing.yml b/core/modules/outside_in/outside_in.routing.yml
index 79bc38d90b6cd2d6d1205c893d883ab6e0f46c90..18a564c304815cda799b6c1c54b2b79593a8e934 100644
--- a/core/modules/outside_in/outside_in.routing.yml
+++ b/core/modules/outside_in/outside_in.routing.yml
@@ -1,7 +1,7 @@
-entity.block.offcanvas_form:
-  path: '/admin/structure/block/manage/{block}/offcanvas'
+entity.block.off_canvas_form:
+  path: '/admin/structure/block/manage/{block}/off-canvas'
   defaults:
-    _entity_form: 'block.offcanvas'
+    _entity_form: 'block.off_canvas'
     _title_callback: '\Drupal\outside_in\Block\BlockEntityOffCanvasForm::title'
   requirements:
     _permission: 'administer blocks'
diff --git a/core/modules/outside_in/outside_in.services.yml b/core/modules/outside_in/outside_in.services.yml
index 48f58242f9d75896ea8b7299564b26d7f7e72bf7..37ba1b351a3694b6f86ef07be14db98a77efa071 100644
--- a/core/modules/outside_in/outside_in.services.yml
+++ b/core/modules/outside_in/outside_in.services.yml
@@ -3,7 +3,7 @@ services:
     class: Drupal\outside_in\Render\MainContent\OffCanvasRender
     arguments: ['@title_resolver', '@renderer']
     tags:
-      - { name: render.main_content_renderer, format: drupal_dialog_offcanvas }
+      - { name: render.main_content_renderer, format: drupal_dialog_off_canvas }
 
   outside_in.manager:
     class: Drupal\outside_in\OutsideInManager
diff --git a/core/modules/outside_in/src/Ajax/OpenOffCanvasDialogCommand.php b/core/modules/outside_in/src/Ajax/OpenOffCanvasDialogCommand.php
index d78dc3539e21b824fb18ab221547ce71aeefa10b..9989d91f652745abb9cd4f84d3776d82c0feadb0 100644
--- a/core/modules/outside_in/src/Ajax/OpenOffCanvasDialogCommand.php
+++ b/core/modules/outside_in/src/Ajax/OpenOffCanvasDialogCommand.php
@@ -5,7 +5,7 @@
 use Drupal\Core\Ajax\OpenDialogCommand;
 
 /**
- * Defines an AJAX command to open content in a dialog in a off-canvas tray.
+ * Defines an AJAX command to open content in a dialog in a off-canvas dialog.
  *
  * @ingroup ajax
  */
@@ -16,7 +16,7 @@ class OpenOffCanvasDialogCommand extends OpenDialogCommand {
    *
    * The off-canvas dialog differs from the normal modal provided by
    * OpenDialogCommand in that a off-canvas has built in positioning and
-   * behaviours. Drupal provides a built-in off-canvas tray for this purpose,
+   * behaviours. Drupal provides a built-in off-canvas dialog for this purpose,
    * so the selector is hard-coded in the call to the parent constructor.
    *
    * @param string $title
@@ -33,7 +33,7 @@ class OpenOffCanvasDialogCommand extends OpenDialogCommand {
    *   populated automatically from the current request.
    */
   public function __construct($title, $content, array $dialog_options = [], $settings = NULL) {
-    parent::__construct('#drupal-offcanvas', $title, $content, $dialog_options, $settings);
+    parent::__construct('#drupal-off-canvas', $title, $content, $dialog_options, $settings);
     $this->dialogOptions['modal'] = FALSE;
     $this->dialogOptions['autoResize'] = FALSE;
     $this->dialogOptions['resizable'] = 'w';
diff --git a/core/modules/outside_in/src/Block/BlockEntityOffCanvasForm.php b/core/modules/outside_in/src/Block/BlockEntityOffCanvasForm.php
index a77f51fca8e86c424cfb0f1dbfa2002a9a491bcb..4e0f081fb5c840a14560cbcac263131b79f2e19d 100644
--- a/core/modules/outside_in/src/Block/BlockEntityOffCanvasForm.php
+++ b/core/modules/outside_in/src/Block/BlockEntityOffCanvasForm.php
@@ -9,7 +9,7 @@
 use Drupal\Core\Plugin\PluginWithFormsInterface;
 
 /**
- * Provides form for block instance forms when used in the off-canvas tray.
+ * Provides form for block instance forms when used in the off-canvas dialog.
  *
  * This form removes advanced sections of regular block form such as the
  * visibility settings, machine ID and region.
@@ -92,7 +92,7 @@ protected function submitVisibility(array $form, FormStateInterface $form_state)
    */
   protected function getPluginForm(BlockPluginInterface $block) {
     if ($block instanceof PluginWithFormsInterface) {
-      return $this->pluginFormFactory->createInstance($block, 'offcanvas', 'configure');
+      return $this->pluginFormFactory->createInstance($block, 'off_canvas', 'configure');
     }
     return $block;
   }
diff --git a/core/modules/outside_in/src/Render/MainContent/OffCanvasRender.php b/core/modules/outside_in/src/Render/MainContent/OffCanvasRender.php
index 5d24c09a7990c885f3e738ac1ad62814209a4db3..9119c9b8cf3d832b2738b8363d3366fff1a70eb8 100644
--- a/core/modules/outside_in/src/Render/MainContent/OffCanvasRender.php
+++ b/core/modules/outside_in/src/Render/MainContent/OffCanvasRender.php
@@ -11,7 +11,7 @@
 use Symfony\Component\HttpFoundation\Request;
 
 /**
- * Default main content renderer for offcanvas dialog requests.
+ * Default main content renderer for off-canvas dialog requests.
  */
 class OffCanvasRender extends DialogRenderer {
 
@@ -43,7 +43,6 @@ public function renderResponse(array $main_content, Request $request, RouteMatch
 
     // First render the main content, because it might provide a title.
     $content = $this->renderer->renderRoot($main_content);
-
     // Attach the library necessary for using the OpenOffCanvasDialogCommand and
     // set the attachments for this Ajax response.
     $main_content['#attached']['library'][] = 'outside_in/drupal.off_canvas';
@@ -55,7 +54,6 @@ public function renderResponse(array $main_content, Request $request, RouteMatch
     // Determine the title: use the title provided by the main content if any,
     // otherwise get it from the routing information.
     $options = $request->request->get('dialogOptions', []);
-
     $response->addCommand(new OpenOffCanvasDialogCommand($title, $content, $options));
     return $response;
   }
diff --git a/core/modules/outside_in/src/Tests/Ajax/OffCanvasDialogTest.php b/core/modules/outside_in/src/Tests/Ajax/OffCanvasDialogTest.php
index f3510427bd100be12652243bac5b00e201d5a5f8..41d66dde3f00a3b4faa9e8725d38f8bace976674 100644
--- a/core/modules/outside_in/src/Tests/Ajax/OffCanvasDialogTest.php
+++ b/core/modules/outside_in/src/Tests/Ajax/OffCanvasDialogTest.php
@@ -21,7 +21,7 @@ class OffCanvasDialogTest extends AjaxTestBase {
   public static $modules = ['outside_in'];
 
   /**
-   * Test sending AJAX requests to open and manipulate offcanvas dialog.
+   * Test sending AJAX requests to open and manipulate off-canvas dialog.
    */
   public function testDialog() {
     $this->drupalLogin($this->drupalCreateUser(['administer contact forms']));
@@ -32,9 +32,9 @@ public function testDialog() {
     $dialog_renderable = AjaxTestController::dialogContents();
     $dialog_contents = \Drupal::service('renderer')->renderRoot($dialog_renderable);
 
-    $offcanvas_expected_response = [
+    $off_canvas_expected_response = [
       'command' => 'openDialog',
-      'selector' => '#drupal-offcanvas',
+      'selector' => '#drupal-off-canvas',
       'settings' => NULL,
       'data' => $dialog_contents,
       'dialogOptions' =>
@@ -52,8 +52,8 @@ public function testDialog() {
     ];
 
     // Emulate going to the JS version of the page and check the JSON response.
-    $ajax_result = $this->drupalGetAjax('ajax-test/dialog-contents', ['query' => [MainContentViewSubscriber::WRAPPER_FORMAT => 'drupal_dialog_offcanvas']]);
-    $this->assertEqual($offcanvas_expected_response, $ajax_result[3], 'Off-canvas dialog JSON response matches.');
+    $ajax_result = $this->drupalGetAjax('ajax-test/dialog-contents', ['query' => [MainContentViewSubscriber::WRAPPER_FORMAT => 'drupal_dialog_off_canvas']]);
+    $this->assertEqual($off_canvas_expected_response, $ajax_result[3], 'off-canvas dialog JSON response matches.');
   }
 
 }
diff --git a/core/modules/outside_in/templates/outside-in-page-wrapper.html.twig b/core/modules/outside_in/templates/outside-in-page-wrapper.html.twig
index adedc6bb341e90b267383bf33a509d728d74a146..c2f5fb9a3f320f90e049c44d9076b18ee9aa5f7a 100644
--- a/core/modules/outside_in/templates/outside-in-page-wrapper.html.twig
+++ b/core/modules/outside_in/templates/outside-in-page-wrapper.html.twig
@@ -12,7 +12,7 @@
  */
 #}
 {% if children %}
-  <div class="dialog-offcanvas__main-canvas" data-offcanvas-main-canvas >
+  <div class="dialog-off-canvas__main-canvas" data-off-canvas-main-canvas >
     {{ children }}
   </div>
 {% endif %}
diff --git a/core/modules/outside_in/tests/modules/offcanvas_test/offcanvas_test.info.yml b/core/modules/outside_in/tests/modules/off_canvas_test/off_canvas_test.info.yml
similarity index 100%
rename from core/modules/outside_in/tests/modules/offcanvas_test/offcanvas_test.info.yml
rename to core/modules/outside_in/tests/modules/off_canvas_test/off_canvas_test.info.yml
diff --git a/core/modules/outside_in/tests/modules/off_canvas_test/off_canvas_test.routing.yml b/core/modules/outside_in/tests/modules/off_canvas_test/off_canvas_test.routing.yml
new file mode 100644
index 0000000000000000000000000000000000000000..4ae56c4ee8912497623a9d8fb7a4439d69e53476
--- /dev/null
+++ b/core/modules/outside_in/tests/modules/off_canvas_test/off_canvas_test.routing.yml
@@ -0,0 +1,29 @@
+off_canvas_test.links:
+  path: '/off-canvas-test-links'
+  defaults:
+    _controller: '\Drupal\off_canvas_test\Controller\TestController::linksDisplay'
+    _title: 'Links'
+  requirements:
+    _access: 'TRUE'
+
+off_canvas_test.thing1:
+  path: '/off-canvas-thing1'
+  defaults:
+    _controller: '\Drupal\off_canvas_test\Controller\TestController::thing1'
+    _title: 'Thing 1'
+  requirements:
+    _access: 'TRUE'
+
+off_canvas_test.thing2:
+  path: '/off-canvas-thing2'
+  defaults:
+    _controller: '\Drupal\off_canvas_test\Controller\TestController::thing2'
+  requirements:
+    _access: 'TRUE'
+
+off_canvas_test.dialog_links:
+  path: '/off-canvas-dialog-links'
+  defaults:
+    _controller: '\Drupal\off_canvas_test\Controller\TestController::otherDialogLinks'
+  requirements:
+    _access: 'TRUE'
diff --git a/core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php b/core/modules/outside_in/tests/modules/off_canvas_test/src/Controller/TestController.php
similarity index 72%
rename from core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php
rename to core/modules/outside_in/tests/modules/off_canvas_test/src/Controller/TestController.php
index 9ee8e1768f88b72534e5212694300550a44bc480..6164b06fc2538165c38a35b417868458daf82220 100644
--- a/core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php
+++ b/core/modules/outside_in/tests/modules/off_canvas_test/src/Controller/TestController.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Drupal\offcanvas_test\Controller;
+namespace Drupal\off_canvas_test\Controller;
 
 use Drupal\Component\Serialization\Json;
 use Drupal\Core\Url;
@@ -37,21 +37,21 @@ public function thing2() {
   }
 
   /**
-   * Displays test links that will open in offcanvas tray.
+   * Displays test links that will open in off-canvas dialog.
    *
    * @return array
    *   Render array with links.
    */
   public function linksDisplay() {
     return [
-      'offcanvas_link_1' => [
+      'off_canvas_link_1' => [
         '#title' => 'Click Me 1!',
         '#type' => 'link',
-        '#url' => Url::fromRoute('offcanvas_test.thing1'),
+        '#url' => Url::fromRoute('off_canvas_test.thing1'),
         '#attributes' => [
           'class' => ['use-ajax'],
           'data-dialog-type' => 'dialog',
-          'data-dialog-renderer' => 'offcanvas',
+          'data-dialog-renderer' => 'off_canvas',
         ],
         '#attached' => [
           'library' => [
@@ -59,14 +59,14 @@ public function linksDisplay() {
           ],
         ],
       ],
-      'offcanvas_link_2' => [
+      'off_canvas_link_2' => [
         '#title' => 'Click Me 2!',
         '#type' => 'link',
-        '#url' => Url::fromRoute('offcanvas_test.thing2'),
+        '#url' => Url::fromRoute('off_canvas_test.thing2'),
         '#attributes' => [
           'class' => ['use-ajax'],
           'data-dialog-type' => 'dialog',
-          'data-dialog-renderer' => 'offcanvas',
+          'data-dialog-renderer' => 'off_canvas',
           'data-dialog-options' => Json::encode([
             'width' => 555,
           ]),
@@ -80,11 +80,11 @@ public function linksDisplay() {
       'other_dialog_links' => [
         '#title' => 'Display more links!',
         '#type' => 'link',
-        '#url' => Url::fromRoute('offcanvas_test.dialog_links'),
+        '#url' => Url::fromRoute('off_canvas_test.dialog_links'),
         '#attributes' => [
           'class' => ['use-ajax'],
           'data-dialog-type' => 'dialog',
-          'data-dialog-renderer' => 'offcanvas',
+          'data-dialog-renderer' => 'off_canvas',
         ],
         '#attached' => [
           'library' => [
@@ -96,12 +96,12 @@ public function linksDisplay() {
   }
 
   /**
-   * Displays dialogs links to be displayed inside the offcanvas tray.
+   * Displays dialogs links to be displayed inside the off-canvas dialog.
    *
-   * This links are used to test opening a modal and another offcanvas link from
-   * inside the offcanvas tray.
+   * This links are used to test opening a modal and another off_canvas link from
+   * inside the off-canvas dialog.
    *
-   * @todo Update tests to check these links work in the offcanvas tray.
+   * @todo Update tests to check these links work in the off-canvas dialog.
    *       https://www.drupal.org/node/2790073
    *
    * @return array
@@ -113,19 +113,19 @@ public function otherDialogLinks() {
       '#links' => [
         'modal_link' => [
           'title' => 'Open modal!',
-          'url' => Url::fromRoute('offcanvas_test.thing2'),
+          'url' => Url::fromRoute('off_canvas_test.thing2'),
           'attributes' => [
             'class' => ['use-ajax'],
             'data-dialog-type' => 'modal',
           ],
         ],
-        'offcanvas_link' => [
-          'title' => 'Offcanvas link!',
-          'url' => Url::fromRoute('offcanvas_test.thing2'),
+        'off_canvas_link' => [
+          'title' => 'Off_canvas link!',
+          'url' => Url::fromRoute('off_canvas_test.thing2'),
           'attributes' => [
             'class' => ['use-ajax'],
             'data-dialog-type' => 'dialog',
-            'data-dialog-renderer' => 'offcanvas',
+            'data-dialog-renderer' => 'off_canvas',
           ],
         ],
       ],
diff --git a/core/modules/outside_in/tests/modules/offcanvas_test/offcanvas_test.routing.yml b/core/modules/outside_in/tests/modules/offcanvas_test/offcanvas_test.routing.yml
deleted file mode 100644
index 761693b7b3d7ed4038337cdead021d8a0cf58bd9..0000000000000000000000000000000000000000
--- a/core/modules/outside_in/tests/modules/offcanvas_test/offcanvas_test.routing.yml
+++ /dev/null
@@ -1,29 +0,0 @@
-offcanvas_test.links:
-  path: '/offcanvas-test-links'
-  defaults:
-    _controller: '\Drupal\offcanvas_test\Controller\TestController::linksDisplay'
-    _title: 'Links'
-  requirements:
-    _access: 'TRUE'
-
-offcanvas_test.thing1:
-  path: '/offcanvas-thing1'
-  defaults:
-    _controller: '\Drupal\offcanvas_test\Controller\TestController::thing1'
-    _title: 'Thing 1'
-  requirements:
-    _access: 'TRUE'
-
-offcanvas_test.thing2:
-  path: '/offcanvas-thing2'
-  defaults:
-    _controller: '\Drupal\offcanvas_test\Controller\TestController::thing2'
-  requirements:
-    _access: 'TRUE'
-
-offcanvas_test.dialog_links:
-  path: '/offcanvas-dialog-links'
-  defaults:
-    _controller: '\Drupal\offcanvas_test\Controller\TestController::otherDialogLinks'
-  requirements:
-    _access: 'TRUE'
diff --git a/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php b/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php
index b81c723e3989b0282eac0e80e1ea6c23aea1f875..21004c10a5576958222ee1230d0cf332a3046576 100644
--- a/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php
+++ b/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php
@@ -3,7 +3,7 @@
 namespace Drupal\Tests\outside_in\FunctionalJavascript;
 
 /**
- * Tests the off-canvas tray functionality.
+ * Tests the off-canvas dialog functionality.
  *
  * @group outside_in
  */
@@ -12,23 +12,23 @@ class OffCanvasTest extends OutsideInJavascriptTestBase {
   /**
    * {@inheritdoc}
    */
-  public static $modules = ['block', 'system', 'toolbar', 'outside_in', 'offcanvas_test'];
+  public static $modules = ['block', 'system', 'toolbar', 'outside_in', 'off_canvas_test'];
 
   /**
-   * Tests that regular non-contextual links will work with the off-canvas tray.
+   * Tests that regular non-contextual links will work with the off-canvas dialog.
    */
   public function testOffCanvasLinks() {
     $themes = ['bartik', 'stark'];
     // Test the same functionality on multiple themes.
     foreach ($themes as $theme) {
       $this->enableTheme($theme);
-      $this->drupalGet('/offcanvas-test-links');
+      $this->drupalGet('/off-canvas-test-links');
 
       $page = $this->getSession()->getPage();
       $web_assert = $this->assertSession();
 
-      // Make sure off-canvas tray is on page when first loaded.
-      $web_assert->elementNotExists('css', '#drupal-offcanvas');
+      // 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.
@@ -40,16 +40,16 @@ public function testOffCanvasLinks() {
         $this->waitForOffCanvasToOpen();
 
         // Check that the canvas is not on the page.
-        $web_assert->elementExists('css', '#drupal-offcanvas');
+        $web_assert->elementExists('css', '#drupal-off-canvas');
         // Check that response text is on page.
         $web_assert->pageTextContains("Thing $link_index says hello");
-        $offcanvas_tray = $this->getTray();
+        $off_canvas_tray = $this->getTray();
 
         // Check that tray is visible.
-        $this->assertEquals(TRUE, $offcanvas_tray->isVisible());
-        $header_text = $offcanvas_tray->find('css', '.ui-dialog-title')->getText();
+        $this->assertEquals(TRUE, $off_canvas_tray->isVisible());
+        $header_text = $off_canvas_tray->find('css', '.ui-dialog-title')->getText();
 
-        $tray_text = $offcanvas_tray->findById('drupal-offcanvas')->getText();
+        $tray_text = $off_canvas_tray->findById('drupal-off-canvas')->getText();
         $this->assertEquals("Thing $link_index says hello", $tray_text);
 
         if ($link_index == '2') {
@@ -57,7 +57,7 @@ public function testOffCanvasLinks() {
           $web_assert->elementExists('css', '.ui-dialog-empty-title');
           $this->assertEquals('', $header_text);
 
-          $style = $page->find('css', '.ui-dialog-offcanvas')->getAttribute('style');
+          $style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
           self::assertTrue(strstr($style, 'width: 555px;') !== FALSE, 'Dialog width respected.');
         }
         else {
@@ -85,21 +85,21 @@ public function testNarrowWidth() {
       $this->enableTheme($theme);
       // Testing at the wider width.
       $this->getSession()->resizeWindow($narrow_width_breakpoint + $offset, $height);
-      $this->drupalGet('/offcanvas-test-links');
-      $this->assertFalse($page->find('css', '.dialog-offcanvas__main-canvas')->hasAttribute('style'), 'Body not padded on wide page load.');
+      $this->drupalGet('/off-canvas-test-links');
+      $this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on wide page load.');
       $page->clickLink("Click Me 1!");
       $this->waitForOffCanvasToOpen();
       // Check that the main canvas is padded when page is not narrow width and
       // tray is open.
-      $web_assert->elementAttributeContains('css', '.dialog-offcanvas__main-canvas', 'style', 'padding-right');
+      $web_assert->elementAttributeContains('css', '.dialog-off-canvas__main-canvas', 'style', 'padding-right');
 
       // Testing at the narrower width.
       $this->getSession()->resizeWindow($narrow_width_breakpoint - $offset, $height);
-      $this->drupalGet('/offcanvas-test-links');
-      $this->assertFalse($page->find('css', '.dialog-offcanvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page load.');
+      $this->drupalGet('/off-canvas-test-links');
+      $this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page load.');
       $page->clickLink("Click Me 1!");
       $this->waitForOffCanvasToOpen();
-      $this->assertFalse($page->find('css', '.dialog-offcanvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page with tray open.');
+      $this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page with tray open.');
     }
   }
 
diff --git a/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInBlockFormTest.php b/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInBlockFormTest.php
index 8aa7ba4c2a0ac44e76db27bc3af8405f5b4399cc..01e44b7194abd8680b00da2eb744361fbfe4a31b 100644
--- a/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInBlockFormTest.php
+++ b/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInBlockFormTest.php
@@ -7,7 +7,7 @@
 use Drupal\user\Entity\Role;
 
 /**
- * Testing opening and saving block forms in the off-canvas tray.
+ * Testing opening and saving block forms in the off-canvas dialog.
  *
  * @group outside_in
  */
@@ -63,7 +63,7 @@ protected function setUp() {
   }
 
   /**
-   * Tests opening Offcanvas tray by click blocks and elements in the blocks.
+   * Tests opening off-canvas dialog by click blocks and elements in the blocks.
    *
    * @dataProvider providerTestBlocks
    */
@@ -75,7 +75,7 @@ public function testBlocks($block_id, $new_page_text, $element_selector, $label_
 
     $link = $page->find('css', "$block_selector .contextual-links li a");
     $this->assertEquals('Quick edit', $link->getText(), "'Quick edit' is the first contextual link for the block.");
-    $this->assertContains("/admin/structure/block/manage/$block_id/offcanvas?destination=user/2", $link->getAttribute('href'));
+    $this->assertContains("/admin/structure/block/manage/$block_id/off-canvas?destination=user/2", $link->getAttribute('href'));
 
     if (isset($toolbar_item)) {
       // Check that you can open a toolbar tray and it will be closed after
@@ -133,7 +133,7 @@ public function testBlocks($block_id, $new_page_text, $element_selector, $label_
 
     // Exit edit mode using ESC.
     $web_assert->elementTextContains('css', '.contextual-toolbar-tab button', 'Editing');
-    $web_assert->elementAttributeContains('css', '.dialog-offcanvas__main-canvas', 'class', 'js-outside-in-edit-mode');
+    $web_assert->elementAttributeContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-outside-in-edit-mode');
     // Simulate press the Escape key.
     $this->getSession()->executeScript('jQuery("body").trigger(jQuery.Event("keyup", { keyCode: 27 }));');
     $this->waitForOffCanvasToClose();
@@ -141,7 +141,7 @@ public function testBlocks($block_id, $new_page_text, $element_selector, $label_
     $this->assertEditModeDisabled();
     $web_assert->elementTextContains('css', '#drupal-live-announce', 'Exited edit mode.');
     $web_assert->elementTextNotContains('css', '.contextual-toolbar-tab button', 'Editing');
-    $web_assert->elementAttributeNotContains('css', '.dialog-offcanvas__main-canvas', 'class', 'js-outside-in-edit-mode');
+    $web_assert->elementAttributeNotContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-outside-in-edit-mode');
   }
 
   /**
@@ -274,11 +274,11 @@ public function testQuickEditLinks() {
       $this->openBlockForm($block_selector);
       $page->find('css', $body_selector)->click();
       $web_assert->waitForElementVisible('css', $quick_edit_selector);
-      // Offcanvas should be closed when opening QuickEdit toolbar.
+      // OffCanvas should be closed when opening QuickEdit toolbar.
       $this->waitForOffCanvasToClose();
 
       $this->openBlockForm($block_selector);
-      // QuickEdit toolbar should be closed when opening Offcanvas.
+      // QuickEdit toolbar should be closed when opening off-canvas dialog.
       $web_assert->elementNotExists('css', $quick_edit_selector);
     }
 
@@ -292,7 +292,7 @@ public function testQuickEditLinks() {
     // Open off-canvas and enter Edit mode via contextual link.
     $this->clickContextualLink($block_selector, "Quick edit");
     $this->waitForOffCanvasToOpen();
-    // QuickEdit toolbar should be closed when opening Offcanvas.
+    // QuickEdit toolbar should be closed when opening off-canvas dialog.
     $web_assert->elementNotExists('css', $quick_edit_selector);
     // Open QuickEdit toolbar via contextual link while in Edit mode.
     $this->clickContextualLink('.node', "Quick edit", FALSE);
@@ -341,7 +341,7 @@ protected function assertEditModeEnabled() {
     // The toolbar edit button should read "Editing".
     $web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Editing');
     // The main canvas element should have the "js-outside-in-edit-mode" class.
-    $web_assert->elementExists('css', '.dialog-offcanvas__main-canvas.js-outside-in-edit-mode');
+    $web_assert->elementExists('css', '.dialog-off-canvas__main-canvas.js-outside-in-edit-mode');
   }
 
   /**
@@ -357,7 +357,7 @@ protected function assertEditModeDisabled() {
     $web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Edit');
     // The main canvas element should NOT have the "js-outside-in-edit-mode"
     // class.
-    $web_assert->elementNotExists('css', '.dialog-offcanvas__main-canvas.js-outside-in-edit-mode');
+    $web_assert->elementNotExists('css', '.dialog-off-canvas__main-canvas.js-outside-in-edit-mode');
   }
 
   /**
@@ -446,7 +446,7 @@ public function testCustomBlockLinks() {
     $href = array_search('Quick edit', $link_labels);
     $this->assertEquals('', $href);
     $href = array_search('Quick edit settings', $link_labels);
-    $this->assertTrue(strstr($href, '/admin/structure/block/manage/custom/offcanvas?destination=user/2') !== FALSE);
+    $this->assertTrue(strstr($href, '/admin/structure/block/manage/custom/off-canvas?destination=user/2') !== FALSE);
   }
 
 }
diff --git a/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInJavascriptTestBase.php b/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInJavascriptTestBase.php
index 236d75e5f11e08c9bc4fb1b38319a1ceb3d1eafc..2fd5f54f0b79f66da141b8585c09c3f6b0922a25 100644
--- a/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInJavascriptTestBase.php
+++ b/core/modules/outside_in/tests/src/FunctionalJavascript/OutsideInJavascriptTestBase.php
@@ -37,28 +37,28 @@ public function enableTheme($theme) {
   }
 
   /**
-   * Waits for Off-canvas tray to open.
+   * Waits for off-canvas dialog to open.
    */
   protected function waitForOffCanvasToOpen() {
     $web_assert = $this->assertSession();
     $web_assert->assertWaitOnAjaxRequest();
-    $web_assert->waitForElementVisible('css', '#drupal-offcanvas');
+    $web_assert->waitForElementVisible('css', '#drupal-off-canvas');
   }
 
   /**
-   * Waits for Off-canvas tray to close.
+   * Waits for off-canvas dialog to close.
    */
   protected function waitForOffCanvasToClose() {
-    $this->waitForNoElement('#drupal-offcanvas');
+    $this->waitForNoElement('#drupal-off-canvas');
   }
 
   /**
-   * Gets the Off-Canvas tray element.
+   * Gets the off-canvas dialog element.
    *
    * @return \Behat\Mink\Element\NodeElement|null
    */
   protected function getTray() {
-    $tray = $this->getSession()->getPage()->find('css', '.ui-dialog[aria-describedby="drupal-offcanvas"]');
+    $tray = $this->getSession()->getPage()->find('css', '.ui-dialog[aria-describedby="drupal-off-canvas"]');
     $this->assertEquals(FALSE, empty($tray), 'The tray was found.');
     return $tray;
   }
diff --git a/core/modules/outside_in/tests/src/Unit/Ajax/OpenOffCanvasDialogCommandTest.php b/core/modules/outside_in/tests/src/Unit/Ajax/OpenOffCanvasDialogCommandTest.php
index cd14d6dfbd7d8535619bbdbdd990da4d2357466f..92103b401a1ebf8b6637c4b92fecdad62520b5de 100644
--- a/core/modules/outside_in/tests/src/Unit/Ajax/OpenOffCanvasDialogCommandTest.php
+++ b/core/modules/outside_in/tests/src/Unit/Ajax/OpenOffCanvasDialogCommandTest.php
@@ -19,7 +19,7 @@ public function testRender() {
 
     $expected = [
       'command' => 'openDialog',
-      'selector' => '#drupal-offcanvas',
+      'selector' => '#drupal-off-canvas',
       'settings' => NULL,
       'data' => '<p>Text!</p>',
       'dialogOptions' => [