diff --git a/core/modules/outside_in/js/offcanvas.js b/core/modules/outside_in/js/offcanvas.js index de166ca..9361513 100644 --- a/core/modules/outside_in/js/offcanvas.js +++ b/core/modules/outside_in/js/offcanvas.js @@ -62,7 +62,7 @@ var modalHeight; // Let scroll element take all the height available. - $element.css({overflow: 'visible', height: 'auto'}); + $element.css({height: 'auto'}); modalHeight = $widget.height(); $offsets.each(function () { offset += $(this).outerHeight(); }); @@ -92,18 +92,10 @@ } $(window).on({ - /** - * - * @param {jQuery.Event} event - * The event triggered. - * @param {jQuery.Ddialog - * - * @param $element - * @param settings - */ 'dialog:aftercreate': function (event, dialog, $element, settings) { if ($element.is('#drupal-offcanvas')) { var eventData = {settings: settings, $element: $element}; + $('.ui-dialog-offcanvas, .ui-dialog-offcanvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title); $element .on('dialogresize.outsidein', eventData, debounce(bodyPadding, 100)) @@ -128,9 +120,11 @@ } }, 'dialog:beforeclose': function (event, dialog, $element) { - $(document).off('.outsidein'); - $(window).off('.outsidein'); - $('body').css('padding-' + edge, 0); + if ($element.is('#drupal-offcanvas')) { + $(document).off('.outsidein'); + $(window).off('.outsidein'); + $('body').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 ece4d52..78dcedb 100644 --- a/core/modules/outside_in/js/outside_in.js +++ b/core/modules/outside_in/js/outside_in.js @@ -129,7 +129,7 @@ // Loop through all Ajax links change the from to offcanvas when needed. Drupal.ajax.instances .filter(function (instance) { - var hasElement = !!instance.element; + var hasElement = instance && !!instance.element; var rendererOffcanvas = false; var wrapperOffcanvas = false; if (hasElement) { @@ -141,7 +141,7 @@ .forEach(function (instance) { // @todo Move logic for data-dialog-renderer attribute into ajax.js // https://www.drupal.org/node/2784443 - instance.options.url = instance.options.url.replace(search, replace); + instance.options.url = instance.options.url.replace(search, replace); }); } }; 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 index 7bfd52b..761693b 100644 --- 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 @@ -18,6 +18,12 @@ offcanvas_test.thing2: path: '/offcanvas-thing2' defaults: _controller: '\Drupal\offcanvas_test\Controller\TestController::thing2' - _title: 'Thing 2' + 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/modules/offcanvas_test/src/Controller/TestController.php b/core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php index 269158a..a984c73 100644 --- a/core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php +++ b/core/modules/outside_in/tests/modules/offcanvas_test/src/Controller/TestController.php @@ -50,7 +50,7 @@ public function linksDisplay() { '#attributes' => [ 'class' => ['use-ajax'], 'data-dialog-type' => 'dialog', - 'data-dialog-renderer' => 'offcanvas' + 'data-dialog-renderer' => 'offcanvas', ], '#attached' => [ 'library' => [ @@ -65,7 +65,7 @@ public function linksDisplay() { '#attributes' => [ 'class' => ['use-ajax'], 'data-dialog-type' => 'dialog', - 'data-dialog-renderer' => 'offcanvas' + 'data-dialog-renderer' => 'offcanvas', ], '#attached' => [ 'library' => [ @@ -73,7 +73,62 @@ public function linksDisplay() { ], ], ], + 'other_dialog_links' => [ + '#title' => 'Display more links!', + '#type' => 'link', + '#url' => Url::fromRoute('offcanvas_test.dialog_links'), + '#attributes' => [ + 'class' => ['use-ajax'], + 'data-dialog-type' => 'dialog', + 'data-dialog-renderer' => 'offcanvas', + ], + '#attached' => [ + 'library' => [ + 'outside_in/drupal.outside_in', + ], + ], + ], + ]; + } + /** + * Displays dialogs links to be displayed inside the offcanvas tray. + * + * This links are used to test opening a modal and another offcanvas link from + * inside the offcanvas tray. + * + * @todo + * + * @return array + * Render array with links. + */ + public function otherDialogLinks() { + return [ + '#theme' => 'links', + '#links' => [ + 'modal_link' => [ + 'title' => 'Open modal!', + 'url' => Url::fromRoute('offcanvas_test.thing2'), + 'attributes' => [ + 'class' => ['use-ajax'], + 'data-dialog-type' => 'modal', + ], + ], + 'offcanvas_link' => [ + 'title' => 'Offcanvas link!', + 'url' => Url::fromRoute('offcanvas_test.thing2'), + 'attributes' => [ + 'class' => ['use-ajax'], + 'data-dialog-type' => 'dialog', + 'data-dialog-renderer' => 'offcanvas', + ], + ], + ], + '#attached' => [ + 'library' => [ + 'outside_in/drupal.outside_in', + ], + ], ]; } diff --git a/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php b/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php index 7ca575d..a2a9514 100644 --- a/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php +++ b/core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php @@ -19,7 +19,7 @@ class OffCanvasTest extends OutsideInJavascriptTestBase { */ public function testOffCanvasLinks() { $themes = ['bartik', 'stark']; - // Test the same functionality on multiple themes + // Test the same functionality on multiple themes. foreach ($themes as $theme) { $this->enableTheme($theme); $this->drupalGet('/offcanvas-test-links'); @@ -32,7 +32,9 @@ public function testOffCanvasLinks() { // Check opening and closing with two separate links. // Make sure tray updates to new content. - foreach (['1', '2'] as $link_index) { + // Check the first link again to make sure the empty title class is + // removed. + foreach (['1', '2', '1'] as $link_index) { // Click the first test like that should open the page. $page->clickLink("Click Me $link_index!"); $this->waitForOffCanvasToOpen(); @@ -47,10 +49,19 @@ public function testOffCanvasLinks() { $this->assertEquals(TRUE, $offcanvas_tray->isVisible()); $header_text = $offcanvas_tray->find('css', '.ui-dialog-title')->getText(); - // Check that header is correct. - $this->assertEquals("Thing $link_index", $header_text); $tray_text = $offcanvas_tray->findById('drupal-offcanvas')->getText(); $this->assertEquals("Thing $link_index says hello", $tray_text); + + // Check no title behavior. + if ($link_index == '2') { + $web_assert->elementExists('css', '.ui-dialog-empty-title'); + $this->assertEquals('', $header_text); + } + else { + // Check that header is correct. + $this->assertEquals("Thing $link_index", $header_text); + $web_assert->elementNotExists('css', '.ui-dialog-empty-title'); + } } } }