Unverified Commit ff49ffc2 authored by alexpott's avatar alexpott

Issue #3205434 by mherchel, benjifisher, brianperry, mglaman, justafish,...

Issue #3205434 by mherchel, benjifisher, brianperry, mglaman, justafish, mradcliffe: Add Nightwatch Test Coverage for Olivero
parent d84f620c
name: 'Olivero tests'
type: module
description: 'Support module for testing the Olivero theme.'
package: Testing
version: VERSION
# Create items in the Main menu.
olivero_test.front_page:
title: Home
route_name: <front>
menu_name: main
weight: 100
olivero_test.child:
title: Child link
route_name: <front>
parent: olivero_test.front_page
menu_name: main
weight: 100
olivero_test.button:
title: Button
route_name: <button>
menu_name: main
weight: 200
olivero_test.child_button:
title: Child button link
route_name: <front>
parent: olivero_test.button
menu_name: main
weight: 100
const headerNavSelector = '#header-nav';
const linkSubMenuId = 'home-submenu-1';
const buttonSubMenuId = 'button-submenu-2';
module.exports = {
'@tags': ['core', 'olivero'],
before(browser) {
browser.drupalInstall({
setupFile:
'core/tests/Drupal/TestSite/TestSiteOliveroInstallTestScript.php',
installProfile: 'minimal',
});
browser.resizeWindow(1600, 800);
},
after(browser) {
browser.drupalUninstall();
},
'Verify Olivero desktop menu click functionality': (browser) => {
browser
.drupalRelativeURL('/node')
.waitForElementVisible(headerNavSelector)
.assert.not.visible(`#${linkSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${linkSubMenuId}"]`,
'aria-expanded',
'false',
)
.click(`[aria-controls="${linkSubMenuId}"]`)
.assert.visible(`#${linkSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${linkSubMenuId}"]`,
'aria-expanded',
'true',
)
// Test interactions for route:<button> menu links.
.assert.not.visible(`#${buttonSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${buttonSubMenuId}"]`,
'aria-expanded',
'false',
)
.click(`[aria-controls="${buttonSubMenuId}"]`)
.assert.visible(`#${buttonSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${buttonSubMenuId}"]`,
'aria-expanded',
'true',
);
},
'Verify Olivero desktop menu hover functionality': (browser) => {
browser
.drupalRelativeURL('/node')
.waitForElementVisible(headerNavSelector)
.assert.visible(headerNavSelector)
.moveToElement('link text', 'home')
.assert.visible(`#${linkSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${linkSubMenuId}"]`,
'aria-expanded',
'true',
)
.moveToElement('link text', 'button')
.assert.visible(`#${buttonSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${buttonSubMenuId}"]`,
'aria-expanded',
'true',
);
},
};
const mobileNavButtonSelector = 'button.mobile-nav-button';
const headerNavSelector = '#header-nav';
const linkSubMenuId = 'home-submenu-1';
const buttonSubMenuId = 'button-submenu-2';
module.exports = {
'@tags': ['core', 'olivero'],
before(browser) {
browser
.drupalInstall({
setupFile:
'core/tests/Drupal/TestSite/TestSiteOliveroInstallTestScript.php',
installProfile: 'minimal',
})
.resizeWindow(1000, 800);
},
after(browser) {
browser.drupalUninstall();
},
'Verify mobile menu and submenu functionality': (browser) => {
browser
.drupalRelativeURL('/')
.assert.not.visible(headerNavSelector)
.click(mobileNavButtonSelector)
.waitForElementVisible(headerNavSelector)
// Test interactions for normal <a> menu links.
.assert.not.visible(`#${linkSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${linkSubMenuId}"]`,
'aria-expanded',
'false',
)
.waitForElementVisible(`[aria-controls="${linkSubMenuId}"]`)
.click(`[aria-controls="${linkSubMenuId}"]`)
.waitForElementVisible(`#${linkSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${linkSubMenuId}"]`,
'aria-expanded',
'true',
)
// Test interactions for route:<button> menu links.
.assert.not.visible(`#${buttonSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${buttonSubMenuId}"]`,
'aria-expanded',
'false',
)
.click(`[aria-controls="${buttonSubMenuId}"]`)
.assert.visible(`#${buttonSubMenuId}`)
.assert.attributeEquals(
`[aria-controls="${buttonSubMenuId}"]`,
'aria-expanded',
'true',
);
},
'Verify mobile menu focus trap': (browser) => {
browser.drupalRelativeURL('/').click(mobileNavButtonSelector);
// Send the tab key 17 times.
// @todo test shift+tab functionality when
// https://www.drupal.org/project/drupal/issues/3191077 is committed.
for (let i = 0; i < 17; i++) {
browser.keys(browser.Keys.TAB).pause(50);
}
// Ensure that focus trap keeps focused element within the navigation.
browser.execute(
// eslint-disable-next-line func-names, prefer-arrow-callback, no-shadow
function (mobileNavButtonSelector, headerNavSelector) {
// Verify focused element is still within the focus trap.
return document.activeElement.matches(
`${headerNavSelector} *, ${mobileNavButtonSelector}`,
);
},
[mobileNavButtonSelector, headerNavSelector],
(result) => {
browser.assert.ok(result.value);
},
);
},
};
module.exports = {
'@tags': ['core', 'olivero'],
before(browser) {
browser.drupalInstall({
setupFile:
'core/tests/Drupal/TestSite/TestSiteOliveroInstallTestScript.php',
installProfile: 'minimal',
});
browser.resizeWindow(1400, 800);
},
after(browser) {
browser.drupalUninstall();
},
'On scroll, menu collapses to burger 🍔 menu': (browser) => {
browser
.drupalRelativeURL('/node')
.assert.containsText(
'#block-olivero-content h2',
'Congratulations and welcome to the Drupal community!',
)
.assert.not.visible('button.wide-nav-expand')
.getLocationInView('footer.site-footer', () => {
browser.assert.visible('button.wide-nav-expand');
browser.assert.not.visible('#site-header__inner');
})
.assert.not.visible('#block-olivero-main-menu')
.click('button.wide-nav-expand', () => {
browser.assert.visible('#block-olivero-main-menu');
});
},
};
<?php
namespace Drupal\TestSite;
use Drupal\Core\Extension\ModuleInstallerInterface;
use Drupal\Core\Extension\ThemeInstallerInterface;
/**
* Setup file used by TestSiteInstallTestScript.
*
* @see \Drupal\Tests\Scripts\TestSiteApplicationTest
*/
class TestSiteOliveroInstallTestScript implements TestSetupInterface {
/**
* {@inheritdoc}
*/
public function setup() {
// Install required module for the Olivero front page.
$module_installer = \Drupal::service('module_installer');
assert($module_installer instanceof ModuleInstallerInterface);
$module_installer->install(['views', 'olivero_test']);
// Install Olivero and set it as the default theme.
$theme_installer = \Drupal::service('theme_installer');
assert($theme_installer instanceof ThemeInstallerInterface);
$theme_installer->install(['olivero'], TRUE);
$system_theme_config = \Drupal::configFactory()->getEditable('system.theme');
$system_theme_config->set('default', 'olivero')->save();
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment