131 lines
3.8 KiB
JavaScript
131 lines
3.8 KiB
JavaScript
// eslint-disable-next-line no-shadow-restricted-names
|
|
(function (undefined) {
|
|
"use strict";
|
|
|
|
describe("Collapsible", function () {
|
|
var $el,
|
|
html,
|
|
html_custom,
|
|
initialize = function (template) {
|
|
setFixtures(template);
|
|
$el = $(".collapsible");
|
|
Collapsible.setCollapsibles($el);
|
|
},
|
|
disableFx = function () {
|
|
$.fx.off = true;
|
|
},
|
|
enableFx = function () {
|
|
$.fx.off = false;
|
|
};
|
|
|
|
beforeEach(function () {
|
|
html =
|
|
"" +
|
|
'<section class="collapsible">' +
|
|
'<div class="shortform">shortform message</div>' +
|
|
'<div class="longform">' +
|
|
"<p>longform is visible</p>" +
|
|
"</div>" +
|
|
"</section>";
|
|
html_custom =
|
|
"" +
|
|
'<section class="collapsible">' +
|
|
"<div " +
|
|
'class="shortform-custom" ' +
|
|
'data-open-text="Show shortform-custom" ' +
|
|
'data-close-text="Hide shortform-custom"' +
|
|
">shortform message</div>" +
|
|
'<div class="longform">' +
|
|
"<p>longform is visible</p>" +
|
|
"</div>" +
|
|
"</section>";
|
|
});
|
|
|
|
describe("setCollapsibles", function () {
|
|
it("Default container initialized correctly", function () {
|
|
initialize(html);
|
|
|
|
expect($el.find(".shortform")).toContainElement(".full-top");
|
|
expect($el.find(".shortform")).toContainElement(".full-bottom");
|
|
expect($el.find(".longform")).toBeHidden();
|
|
expect($el.find(".full")).toHandle("click");
|
|
});
|
|
|
|
it("Custom container initialized correctly", function () {
|
|
initialize(html_custom);
|
|
|
|
expect($el.find(".shortform-custom")).toContainElement(".full-custom");
|
|
expect($el.find(".full-custom")).toHaveText("Show shortform-custom");
|
|
expect($el.find(".longform")).toBeHidden();
|
|
expect($el.find(".full-custom")).toHandle("click");
|
|
});
|
|
});
|
|
|
|
describe("toggleFull", function () {
|
|
var assertChanges = function (state, anchorsElClass, showText, hideText) {
|
|
var anchors, text;
|
|
|
|
if (state == null) {
|
|
state = "closed";
|
|
}
|
|
|
|
anchors = $el.find("." + anchorsElClass);
|
|
|
|
if (state === "closed") {
|
|
expect($el.find(".longform")).toBeHidden();
|
|
expect($el).not.toHaveClass("open");
|
|
text = showText;
|
|
} else {
|
|
expect($el.find(".longform")).toBeVisible();
|
|
expect($el).toHaveClass("open");
|
|
text = hideText;
|
|
}
|
|
|
|
$.each(anchors, function (index, el) {
|
|
expect(el).toHaveText(text);
|
|
});
|
|
};
|
|
|
|
beforeEach(function () {
|
|
disableFx();
|
|
});
|
|
|
|
afterEach(function () {
|
|
enableFx();
|
|
});
|
|
|
|
it("Default container", function () {
|
|
var event;
|
|
|
|
initialize(html);
|
|
|
|
event = jQuery.Event("click", {
|
|
target: $el.find(".full").get(0),
|
|
});
|
|
|
|
Collapsible.toggleFull(event, "See full output", "Hide output");
|
|
assertChanges("opened", "full", "See full output", "Hide output");
|
|
|
|
Collapsible.toggleFull(event, "See full output", "Hide output");
|
|
assertChanges("closed", "full", "See full output", "Hide output");
|
|
});
|
|
|
|
it("Custom container", function () {
|
|
var event;
|
|
|
|
initialize(html_custom);
|
|
|
|
event = jQuery.Event("click", {
|
|
target: $el.find(".full-custom").get(0),
|
|
});
|
|
|
|
Collapsible.toggleFull(event, "Show shortform-custom", "Hide shortform-custom");
|
|
assertChanges("opened", "full-custom", "Show shortform-custom", "Hide shortform-custom");
|
|
|
|
Collapsible.toggleFull(event, "Show shortform-custom", "Hide shortform-custom");
|
|
assertChanges("closed", "full-custom", "Show shortform-custom", "Hide shortform-custom");
|
|
});
|
|
});
|
|
});
|
|
}).call(this);
|