summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorwebchick2018-01-03 20:29:21 (GMT)
committerwebchick2018-01-03 20:29:21 (GMT)
commitf9445b466bd19c6bf4b017ac6582fb0c85794117 (patch)
tree8a98027fc0b410126335468e8f6ed1d163a6509d
parent35de151d0ef048ed588dacf0c8bf022ee208abcd (diff)
Issue #2919147 by tedbow, tim.plunkett: When edit mode is enabled new page loads will not have Contextual tabbing constrained
-rw-r--r--core/modules/contextual/js/toolbar/views/AuralView.es6.js1
-rw-r--r--core/modules/contextual/js/toolbar/views/AuralView.js1
-rw-r--r--core/modules/contextual/tests/src/FunctionalJavascript/EditModeTest.php72
3 files changed, 55 insertions, 19 deletions
diff --git a/core/modules/contextual/js/toolbar/views/AuralView.es6.js b/core/modules/contextual/js/toolbar/views/AuralView.es6.js
index f243e4b..757c886 100644
--- a/core/modules/contextual/js/toolbar/views/AuralView.es6.js
+++ b/core/modules/contextual/js/toolbar/views/AuralView.es6.js
@@ -30,6 +30,7 @@
this.listenTo(this.model, 'change:isViewing', this.manageTabbing);
$(document).on('keyup', _.bind(this.onKeypress, this));
+ this.manageTabbing();
},
/**
diff --git a/core/modules/contextual/js/toolbar/views/AuralView.js b/core/modules/contextual/js/toolbar/views/AuralView.js
index 7bf7e40..d3af87b 100644
--- a/core/modules/contextual/js/toolbar/views/AuralView.js
+++ b/core/modules/contextual/js/toolbar/views/AuralView.js
@@ -16,6 +16,7 @@
this.listenTo(this.model, 'change:isViewing', this.manageTabbing);
$(document).on('keyup', _.bind(this.onKeypress, this));
+ this.manageTabbing();
},
render: function render() {
this.$el.find('button').attr('aria-pressed', !this.model.get('isViewing'));
diff --git a/core/modules/contextual/tests/src/FunctionalJavascript/EditModeTest.php b/core/modules/contextual/tests/src/FunctionalJavascript/EditModeTest.php
index dc978aa..a61ea8a 100644
--- a/core/modules/contextual/tests/src/FunctionalJavascript/EditModeTest.php
+++ b/core/modules/contextual/tests/src/FunctionalJavascript/EditModeTest.php
@@ -44,27 +44,45 @@ class EditModeTest extends JavascriptTestBase {
}
/**
- * Tests that Drupal.announce messages appear.
+ * Tests enabling and disabling edit mode.
*/
- public function testAnnounceEditMode() {
+ public function testEditModeEnableDisalbe() {
$web_assert = $this->assertSession();
- $this->drupalGet('user');
-
- // After the page loaded we need to additionally wait until the settings
- // tray Ajax activity is done.
- $web_assert->assertWaitOnAjaxRequest();
-
- // Enable edit mode.
- $this->pressToolbarEditButton();
- $this->assertAnnounceEditMode();
- // Disable edit mode.
- $this->pressToolbarEditButton();
- $this->assertAnnounceLeaveEditMode();
- // Enable edit mode again.
- $this->pressToolbarEditButton();
- // Finally assert that the 'edit mode enabled' announcement is still correct
- // after toggling the edit mode at least once.
- $this->assertAnnounceEditMode();
+ $page = $this->getSession()->getPage();
+ // Get the page twice to ensure edit mode remains enabled after a new page
+ // request.
+ for ($page_get_count = 0; $page_get_count < 2; $page_get_count++) {
+ $this->drupalGet('user');
+ $expected_restricted_tab_count = 1 + count($page->findAll('css', '[data-contextual-id]'));
+
+ // After the page loaded we need to additionally wait until the settings
+ // tray Ajax activity is done.
+ $web_assert->assertWaitOnAjaxRequest();
+
+ if ($page_get_count == 0) {
+ $unrestricted_tab_count = $this->getTabbableElementsCount();
+ $this->assertGreaterThan($expected_restricted_tab_count, $unrestricted_tab_count);
+
+ // Enable edit mode.
+ // After the first page load the page will be in edit mode when loaded.
+ $this->pressToolbarEditButton();
+ }
+
+ $this->assertAnnounceEditMode();
+ $this->assertSame($expected_restricted_tab_count, $this->getTabbableElementsCount());
+
+ // Disable edit mode.
+ $this->pressToolbarEditButton();
+ $this->assertAnnounceLeaveEditMode();
+ $this->assertSame($unrestricted_tab_count, $this->getTabbableElementsCount());
+ // Enable edit mode again.
+ $this->pressToolbarEditButton();
+ // Finally assert that the 'edit mode enabled' announcement is still
+ // correct after toggling the edit mode at least once.
+ $this->assertAnnounceEditMode();
+ $this->assertSame($expected_restricted_tab_count, $this->getTabbableElementsCount());
+ }
+
}
/**
@@ -100,4 +118,20 @@ class EditModeTest extends JavascriptTestBase {
$web_assert->elementNotContains('css', static::ANNOUNCE_SELECTOR, 'Tabbing is constrained to a set of');
}
+ /**
+ * Gets the number of elements that are tabbable.
+ *
+ * @return int
+ * The number of tabbable elements.
+ */
+ protected function getTabbableElementsCount() {
+ // Mark all tabbable elements.
+ $this->getSession()->executeScript("jQuery(':tabbable').attr('data-marked', '');");
+ // Count all marked elements.
+ $count = count($this->getSession()->getPage()->findAll('css', "[data-marked]"));
+ // Remove set attributes.
+ $this->getSession()->executeScript("jQuery('[data-marked]').removeAttr('data-marked');");
+ return $count;
+ }
+
}