biofriction-wp-theme/node_modules/foundation-sites/test/javascript/components/accordionMenu.js

191 lines
6.0 KiB
JavaScript

describe('Accordion Menu', function() {
var plugin;
var $html;
var template = `
<ul class="vertical menu">
<li>
<a href="#">Item 1</a>
<ul class="menu vertical nested">
<li>
<a href="#">Item 1A</a>
<ul class="menu vertical nested">
<li><a href="#">Item 1Ai</a></li>
<li><a href="#">Item 1Aii</a></li>
<li><a href="#">Item 1Aiii</a></li>
</ul>
</li>
<li><a href="#">Item 1B</a></li>
<li><a href="#">Item 1C</a></li>
</ul>
</li>
<li>
<a href="#">Item 2</a>
<ul class="menu vertical nested">
<li><a href="#">Item 2A</a></li>
<li><a href="#">Item 2B</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
</ul>`;
Foundation.AccordionMenu.defaults.slideSpeed = 0;
afterEach(function() {
plugin.destroy();
$html.remove();
});
describe('constructor()', function() {
it('stores the element and plugin options', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
plugin.$element.should.be.an('object');
plugin.options.should.be.an('object');
});
});
describe('up()', function() {
it('closes the targeted submenu', function(done) {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html);
const $submenu = $html.find('.is-accordion-submenu').eq(0);
// Open it first
plugin.down($submenu);
plugin.up($submenu);
setTimeout(() => {
// Should be hidden
$submenu.should.be.hidden;
// Should have attributes updated and without active classe
$submenu.should.have.attr('aria-hidden', 'true');
$submenu.should.not.have.class('is-active');
done();
}, 1);
});
it('toggles attributes of title of the targeted container', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
// Open it first
plugin.down($html.find('.is-accordion-submenu').eq(0));
plugin.up($html.find('.is-accordion-submenu').eq(0));
$html.find('.is-accordion-submenu-parent').eq(0).should.have.attr('aria-expanded', 'false');
});
it('fires up.zf.accordionMenu event', function(done) {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {slideSpeed: 200});
// Open it first
plugin.down($html.find('.is-accordion-submenu').eq(0));
$html.on('up.zf.accordionMenu', function() {
$html.find('.is-accordion-submenu').eq(0).should.be.hidden;
done();
});
plugin.up($html.find('.is-accordion-submenu').eq(0));
});
});
describe('down()', function() {
it('opens the targeted submenu', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
const $submenu = $html.find('.is-accordion-submenu').eq(0);
plugin.down($submenu);
// Should be visible
$submenu.should.be.visible;
// Should have attributes updated and with an active classe
$submenu.should.have.attr('aria-hidden', 'false');
$submenu.should.have.class('is-active');
});
it('toggles attributes of title of the targeted submenu', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
plugin.down($html.find('.is-accordion-submenu').eq(0));
$html.find('.is-accordion-submenu-parent').eq(0).should.have.attr('aria-expanded', 'true');
});
it('closes open submenu if multiOpen is false', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {multiOpen: false});
// Open another one first
plugin.down($html.find('.is-accordion-submenu').eq(0));
plugin.down($html.find('.is-accordion-submenu').eq(2));
$html.find('.is-accordion-submenu').eq(0).should.be.hidden;
});
it('not closes open submenu if multiOpen is true', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {multiOpen: true});
// Open another one first
plugin.down($html.find('.is-accordion-submenu').eq(0));
plugin.down($html.find('.is-accordion-submenu').eq(2));
$html.find('.is-accordion-submenu').eq(0).should.be.visible;
});
it('fires down.zf.accordionMenu event', function(done) {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {slideSpeed: 200});
$html.on('down.zf.accordionMenu', function() {
$html.find('.is-accordion-submenu').eq(0).should.be.visible;
done();
});
plugin.down($html.find('.is-accordion-submenu').eq(0));
});
});
describe('toggle()', function() {
it('opens a closed container', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
plugin.toggle($html.find('.is-accordion-submenu').eq(0));
$html.find('.is-accordion-submenu').eq(0).should.be.visible;
});
it('closes an open container', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
// Open first
plugin.down($html.find('.is-accordion-submenu').eq(0));
plugin.toggle($html.find('.is-accordion-submenu').eq(0));
$html.find('.is-accordion-submenu').eq(0).should.be.hidden;
});
});
describe('hideAll()', function() {
it('closes all accordions', function() {
$html = $(template).appendTo('body');
plugin = new Foundation.AccordionMenu($html, {});
// Open some first
plugin.down($html.find('.is-accordion-submenu').eq(0));
plugin.down($html.find('.is-accordion-submenu').eq(1));
plugin.down($html.find('.is-accordion-submenu').eq(2));
plugin.hideAll();
$html.find('[data-submenu]').each(function() {
$(this).should.be.hidden;
});
});
});
});