mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-31 00:59:51 +02:00
Code Issues Releases Wiki Activity

Merge branch 'v4' of https://github.com/twbs/derpstrap into v4

Browse Source
This commit is contained in:
Mark Otto
2015-08-18 22:23:44 -07:00
parent d52755b3eb 08d2041c45
commit fc5d996e10
18 changed files with 295 additions and 357 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
dist/js/bootstrap.js
View File

@@ -2203,16 +2203,23 @@ var ScrollSpy = (function ($) {
}; };
var ClassName = { var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu', DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active' ACTIVE: 'active'
}; };
var Selector = { var Selector = {
DATA_SPY: '[data-spy="scroll"]', DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active', ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', LI_DROPDOWN: 'li.dropdown',
NAV_ANCHORS: '.nav li > a' NAV_LINKS: '.nav-link',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
}; };
var OffsetMethod = { var OffsetMethod = {
@@ -2233,7 +2240,7 @@ var ScrollSpy = (function ($) {
this._element = element; this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element; this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config); this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_ANCHORS; this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._offsets = []; this._offsets = [];
this._targets = []; this._targets = [];
this._activeTarget = null; this._activeTarget = null;
@@ -2381,20 +2388,20 @@ var ScrollSpy = (function ($) {
this._clear(); this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]'); var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
// todo (fat): getting all the raw li's up the tree is not great. var $link = $(queries.join(','));
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE); $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
var itemParent = parentListItems[i].parentNode; } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0]; $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
$(closestDropdown).addClass(ClassName.ACTIVE);
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -2404,11 +2411,7 @@ var ScrollSpy = (function ($) {
}, { }, {
key: '_clear', key: '_clear',
value: function _clear() { value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE); $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
} }
// static // static
@@ -2511,13 +2514,14 @@ var Tab = (function ($) {
var Selector = { var Selector = {
A: 'a', A: 'a',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)', UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade', FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active', ACTIVE: '.active',
ACTIVE_CHILD: '> .active', ACTIVE_CHILD: '> .nav-item > .active, > .active',
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu > .active' DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
}; };
/** /**
@@ -2549,7 +2553,7 @@ var Tab = (function ($) {
value: function show() { value: function show() {
var _this15 = this; var _this15 = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).parent().hasClass(ClassName.ACTIVE)) { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) {
return; return;
} }
@@ -2561,10 +2565,6 @@ var Tab = (function ($) {
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1]; previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
} }
var hideEvent = $.Event(Event.HIDE, { var hideEvent = $.Event(Event.HIDE, {
@@ -2589,7 +2589,7 @@ var Tab = (function ($) {
target = $(selector)[0]; target = $(selector)[0];
} }
this._activate($(this._element).closest(Selector.LI)[0], ulElement); this._activate(this._element, ulElement);
var complete = function complete() { var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, { var hiddenEvent = $.Event(Event.HIDDEN, {
@@ -2644,22 +2644,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE); $(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE); $(dropdownChild).removeClass(ClassName.ACTIVE);
} }
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]; active.setAttribute('aria-expanded', false);
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
} }
$(element).addClass(ClassName.ACTIVE); $(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
if (isTransitioning) { if (isTransitioning) {
Util.reflow(element); Util.reflow(element);
@@ -2670,15 +2664,12 @@ var Tab = (function ($) {
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]; var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE); $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]; element.setAttribute('aria-expanded', true);
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
} }
if (callback) { if (callback) {

5
dist/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

41
dist/js/umd/scrollspy.js vendored
View File

@@ -62,16 +62,23 @@
}; };
var ClassName = { var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu', DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active' ACTIVE: 'active'
}; };
var Selector = { var Selector = {
DATA_SPY: '[data-spy="scroll"]', DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active', ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', LI_DROPDOWN: 'li.dropdown',
NAV_ANCHORS: '.nav li > a' NAV_LINKS: '.nav-link',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
}; };
var OffsetMethod = { var OffsetMethod = {
@@ -92,7 +99,7 @@
this._element = element; this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element; this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config); this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_ANCHORS; this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._offsets = []; this._offsets = [];
this._targets = []; this._targets = [];
this._activeTarget = null; this._activeTarget = null;
@@ -240,20 +247,20 @@
this._clear(); this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]'); var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
// todo (fat): getting all the raw li's up the tree is not great. var $link = $(queries.join(','));
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE); $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
var itemParent = parentListItems[i].parentNode; } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0]; $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
$(closestDropdown).addClass(ClassName.ACTIVE);
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -263,11 +270,7 @@
}, { }, {
key: '_clear', key: '_clear',
value: function _clear() { value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE); $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
} }
// static // static

38
dist/js/umd/tab.js vendored
View File

@@ -62,13 +62,14 @@
var Selector = { var Selector = {
A: 'a', A: 'a',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)', UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade', FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active', ACTIVE: '.active',
ACTIVE_CHILD: '> .active', ACTIVE_CHILD: '> .nav-item > .active, > .active',
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu > .active' DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
}; };
/** /**
@@ -100,7 +101,7 @@
value: function show() { value: function show() {
var _this = this; var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).parent().hasClass(ClassName.ACTIVE)) { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) {
return; return;
} }
@@ -112,10 +113,6 @@
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1]; previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
} }
var hideEvent = $.Event(Event.HIDE, { var hideEvent = $.Event(Event.HIDE, {
@@ -140,7 +137,7 @@
target = $(selector)[0]; target = $(selector)[0];
} }
this._activate($(this._element).closest(Selector.LI)[0], ulElement); this._activate(this._element, ulElement);
var complete = function complete() { var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, { var hiddenEvent = $.Event(Event.HIDDEN, {
@@ -195,22 +192,16 @@
$(active).removeClass(ClassName.ACTIVE); $(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE); $(dropdownChild).removeClass(ClassName.ACTIVE);
} }
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]; active.setAttribute('aria-expanded', false);
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
} }
$(element).addClass(ClassName.ACTIVE); $(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
if (isTransitioning) { if (isTransitioning) {
_Util['default'].reflow(element); _Util['default'].reflow(element);
@@ -221,15 +212,12 @@
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]; var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE); $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]; element.setAttribute('aria-expanded', true);
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
} }
if (callback) { if (callback) {

79
docs/dist/js/bootstrap.js
View File

@@ -2203,16 +2203,23 @@ var ScrollSpy = (function ($) {
}; };
var ClassName = { var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu', DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active' ACTIVE: 'active'
}; };
var Selector = { var Selector = {
DATA_SPY: '[data-spy="scroll"]', DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active', ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', LI_DROPDOWN: 'li.dropdown',
NAV_ANCHORS: '.nav li > a' NAV_LINKS: '.nav-link',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
}; };
var OffsetMethod = { var OffsetMethod = {
@@ -2233,7 +2240,7 @@ var ScrollSpy = (function ($) {
this._element = element; this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element; this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config); this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_ANCHORS; this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._offsets = []; this._offsets = [];
this._targets = []; this._targets = [];
this._activeTarget = null; this._activeTarget = null;
@@ -2381,20 +2388,20 @@ var ScrollSpy = (function ($) {
this._clear(); this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]'); var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
// todo (fat): getting all the raw li's up the tree is not great. var $link = $(queries.join(','));
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE); $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
var itemParent = parentListItems[i].parentNode; } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0]; $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
$(closestDropdown).addClass(ClassName.ACTIVE);
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -2404,11 +2411,7 @@ var ScrollSpy = (function ($) {
}, { }, {
key: '_clear', key: '_clear',
value: function _clear() { value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE); $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
} }
// static // static
@@ -2511,13 +2514,14 @@ var Tab = (function ($) {
var Selector = { var Selector = {
A: 'a', A: 'a',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)', UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade', FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active', ACTIVE: '.active',
ACTIVE_CHILD: '> .active', ACTIVE_CHILD: '> .nav-item > .active, > .active',
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu > .active' DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
}; };
/** /**
@@ -2549,7 +2553,7 @@ var Tab = (function ($) {
value: function show() { value: function show() {
var _this15 = this; var _this15 = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).parent().hasClass(ClassName.ACTIVE)) { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) {
return; return;
} }
@@ -2561,10 +2565,6 @@ var Tab = (function ($) {
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1]; previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
} }
var hideEvent = $.Event(Event.HIDE, { var hideEvent = $.Event(Event.HIDE, {
@@ -2589,7 +2589,7 @@ var Tab = (function ($) {
target = $(selector)[0]; target = $(selector)[0];
} }
this._activate($(this._element).closest(Selector.LI)[0], ulElement); this._activate(this._element, ulElement);
var complete = function complete() { var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, { var hiddenEvent = $.Event(Event.HIDDEN, {
@@ -2644,22 +2644,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE); $(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE); $(dropdownChild).removeClass(ClassName.ACTIVE);
} }
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]; active.setAttribute('aria-expanded', false);
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
} }
$(element).addClass(ClassName.ACTIVE); $(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
if (isTransitioning) { if (isTransitioning) {
Util.reflow(element); Util.reflow(element);
@@ -2670,15 +2664,12 @@ var Tab = (function ($) {
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]; var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE); $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]; element.setAttribute('aria-expanded', true);
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
} }
if (callback) { if (callback) {

5
docs/dist/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

41
docs/dist/js/umd/scrollspy.js vendored
View File

@@ -62,16 +62,23 @@
}; };
var ClassName = { var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu', DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active' ACTIVE: 'active'
}; };
var Selector = { var Selector = {
DATA_SPY: '[data-spy="scroll"]', DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active', ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', LI_DROPDOWN: 'li.dropdown',
NAV_ANCHORS: '.nav li > a' NAV_LINKS: '.nav-link',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
}; };
var OffsetMethod = { var OffsetMethod = {
@@ -92,7 +99,7 @@
this._element = element; this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element; this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config); this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_ANCHORS; this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._offsets = []; this._offsets = [];
this._targets = []; this._targets = [];
this._activeTarget = null; this._activeTarget = null;
@@ -240,20 +247,20 @@
this._clear(); this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]'); var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
// todo (fat): getting all the raw li's up the tree is not great. var $link = $(queries.join(','));
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE); $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
var itemParent = parentListItems[i].parentNode; } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0]; $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
$(closestDropdown).addClass(ClassName.ACTIVE);
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -263,11 +270,7 @@
}, { }, {
key: '_clear', key: '_clear',
value: function _clear() { value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE); $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
} }
// static // static

38
docs/dist/js/umd/tab.js vendored
View File

@@ -62,13 +62,14 @@
var Selector = { var Selector = {
A: 'a', A: 'a',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)', UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade', FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active', ACTIVE: '.active',
ACTIVE_CHILD: '> .active', ACTIVE_CHILD: '> .nav-item > .active, > .active',
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu > .active' DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
}; };
/** /**
@@ -100,7 +101,7 @@
value: function show() { value: function show() {
var _this = this; var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).parent().hasClass(ClassName.ACTIVE)) { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) {
return; return;
} }
@@ -112,10 +113,6 @@
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1]; previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
} }
var hideEvent = $.Event(Event.HIDE, { var hideEvent = $.Event(Event.HIDE, {
@@ -140,7 +137,7 @@
target = $(selector)[0]; target = $(selector)[0];
} }
this._activate($(this._element).closest(Selector.LI)[0], ulElement); this._activate(this._element, ulElement);
var complete = function complete() { var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, { var hiddenEvent = $.Event(Event.HIDDEN, {
@@ -195,22 +192,16 @@
$(active).removeClass(ClassName.ACTIVE); $(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE); $(dropdownChild).removeClass(ClassName.ACTIVE);
} }
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]; active.setAttribute('aria-expanded', false);
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
} }
$(element).addClass(ClassName.ACTIVE); $(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
if (isTransitioning) { if (isTransitioning) {
_Util['default'].reflow(element); _Util['default'].reflow(element);
@@ -221,15 +212,12 @@
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]; var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE); $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]; element.setAttribute('aria-expanded', true);
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
} }
if (callback) { if (callback) {

41
js/dist/scrollspy.js vendored
View File

@@ -45,16 +45,23 @@ var ScrollSpy = (function ($) {
}; };
var ClassName = { var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu', DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active' ACTIVE: 'active'
}; };
var Selector = { var Selector = {
DATA_SPY: '[data-spy="scroll"]', DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active', ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', LI_DROPDOWN: 'li.dropdown',
NAV_ANCHORS: '.nav li > a' NAV_LINKS: '.nav-link',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
}; };
var OffsetMethod = { var OffsetMethod = {
@@ -75,7 +82,7 @@ var ScrollSpy = (function ($) {
this._element = element; this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element; this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config); this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_ANCHORS; this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._offsets = []; this._offsets = [];
this._targets = []; this._targets = [];
this._activeTarget = null; this._activeTarget = null;
@@ -223,20 +230,20 @@ var ScrollSpy = (function ($) {
this._clear(); this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]'); var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
// todo (fat): getting all the raw li's up the tree is not great. var $link = $(queries.join(','));
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE); $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
var itemParent = parentListItems[i].parentNode; } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0]; $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
$(closestDropdown).addClass(ClassName.ACTIVE);
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -246,11 +253,7 @@ var ScrollSpy = (function ($) {
}, { }, {
key: '_clear', key: '_clear',
value: function _clear() { value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE); $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
} }
// static // static

2
js/dist/scrollspy.js.map vendored
View File

File diff suppressed because one or more lines are too long

38
js/dist/tab.js vendored
View File

@@ -45,13 +45,14 @@ var Tab = (function ($) {
var Selector = { var Selector = {
A: 'a', A: 'a',
LI: 'li', LI: 'li',
LI_DROPDOWN: 'li.dropdown', DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)', UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade', FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active', ACTIVE: '.active',
ACTIVE_CHILD: '> .active', ACTIVE_CHILD: '> .nav-item > .active, > .active',
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu > .active' DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
}; };
/** /**
@@ -83,7 +84,7 @@ var Tab = (function ($) {
value: function show() { value: function show() {
var _this = this; var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).parent().hasClass(ClassName.ACTIVE)) { if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) {
return; return;
} }
@@ -95,10 +96,6 @@ var Tab = (function ($) {
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1]; previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
} }
var hideEvent = $.Event(Event.HIDE, { var hideEvent = $.Event(Event.HIDE, {
@@ -123,7 +120,7 @@ var Tab = (function ($) {
target = $(selector)[0]; target = $(selector)[0];
} }
this._activate($(this._element).closest(Selector.LI)[0], ulElement); this._activate(this._element, ulElement);
var complete = function complete() { var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, { var hiddenEvent = $.Event(Event.HIDDEN, {
@@ -178,22 +175,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE); $(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE); $(dropdownChild).removeClass(ClassName.ACTIVE);
} }
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]; active.setAttribute('aria-expanded', false);
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
} }
$(element).addClass(ClassName.ACTIVE); $(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
if (isTransitioning) { if (isTransitioning) {
Util.reflow(element); Util.reflow(element);
@@ -204,15 +195,12 @@ var Tab = (function ($) {
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]; var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE); $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]; element.setAttribute('aria-expanded', true);
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
} }
if (callback) { if (callback) {

2
js/dist/tab.js.map vendored
View File

File diff suppressed because one or more lines are too long

57
js/src/scrollspy.js
View File

@@ -43,16 +43,23 @@ const ScrollSpy = (($) => {
} }
const ClassName = { const ClassName = {
DROPDOWN_ITEM : 'dropdown-item',
DROPDOWN_MENU : 'dropdown-menu', DROPDOWN_MENU : 'dropdown-menu',
NAV_LINK : 'nav-link',
NAV : 'nav',
ACTIVE : 'active' ACTIVE : 'active'
} }
const Selector = { const Selector = {
DATA_SPY : '[data-spy="scroll"]', DATA_SPY : '[data-spy="scroll"]',
ACTIVE : '.active', ACTIVE : '.active',
LI : 'li', LIST_ITEM : '.list-item',
LI_DROPDOWN : 'li.dropdown', LI : 'li',
NAV_ANCHORS : '.nav li > a' LI_DROPDOWN : 'li.dropdown',
NAV_LINKS : '.nav-link',
DROPDOWN : '.dropdown',
DROPDOWN_ITEMS : '.dropdown-item',
DROPDOWN_TOGGLE : '.dropdown-toggle'
} }
const OffsetMethod = { const OffsetMethod = {
@@ -73,7 +80,8 @@ const ScrollSpy = (($) => {
this._element = element this._element = element
this._scrollElement = element.tagName === 'BODY' ? window : element this._scrollElement = element.tagName === 'BODY' ? window : element
this._config = this._getConfig(config) this._config = this._getConfig(config)
this._selector = `${this._config.target} ${Selector.NAV_ANCHORS}` this._selector = `${this._config.target} ${Selector.NAV_LINKS},`
+ `${this._config.target} ${Selector.DROPDOWN_ITEMS}`
this._offsets = [] this._offsets = []
this._targets = [] this._targets = []
this._activeTarget = null this._activeTarget = null
@@ -229,23 +237,21 @@ const ScrollSpy = (($) => {
this._clear() this._clear()
let selector = let queries = this._selector.split(',')
`${this._selector}[data-target="${target}"],` + queries = queries.map((selector) => {
`${this._selector}[href="${target}"]` return `${selector}[data-target="${target}"],` +
`${selector}[href="${target}"]`
})
// todo (fat): getting all the raw li's up the tree is not great. let $link = $(queries.join(','))
let parentListItems = $(selector).parents(Selector.LI)
for (let i = parentListItems.length; i--;) { if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$(parentListItems[i]).addClass(ClassName.ACTIVE) $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE)
$link.addClass(ClassName.ACTIVE)
let itemParent = parentListItems[i].parentNode } else {
// todo (fat) this is kinda sus…
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) { // recursively add actives to tested nav-links
let closestDropdown = $(itemParent) $link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE)
.closest(Selector.LI_DROPDOWN)[0]
$(closestDropdown).addClass(ClassName.ACTIVE)
}
} }
$(this._scrollElement).trigger(Event.ACTIVATE, { $(this._scrollElement).trigger(Event.ACTIVATE, {
@@ -254,14 +260,7 @@ const ScrollSpy = (($) => {
} }
_clear() { _clear() {
let activeParents = $(this._selector).parentsUntil( $(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE)
this._config.target,
Selector.ACTIVE
)
for (let i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE)
}
} }

38
js/src/tab.js
View File

@@ -43,13 +43,14 @@ const Tab = (($) => {
const Selector = { const Selector = {
A : 'a', A : 'a',
LI : 'li', LI : 'li',
LI_DROPDOWN : 'li.dropdown', DROPDOWN : '.dropdown',
UL : 'ul:not(.dropdown-menu)', UL : 'ul:not(.dropdown-menu)',
FADE_CHILD : '> .fade', FADE_CHILD : '> .nav-item .fade, > .fade',
ACTIVE : '.active', ACTIVE : '.active',
ACTIVE_CHILD : '> .active', ACTIVE_CHILD : '> .nav-item > .active, > .active',
DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"]', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"]',
DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu > .active' DROPDOWN_TOGGLE : '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active'
} }
@@ -78,7 +79,7 @@ const Tab = (($) => {
show() { show() {
if (this._element.parentNode && if (this._element.parentNode &&
(this._element.parentNode.nodeType === Node.ELEMENT_NODE) && (this._element.parentNode.nodeType === Node.ELEMENT_NODE) &&
($(this._element).parent().hasClass(ClassName.ACTIVE))) { ($(this._element).hasClass(ClassName.ACTIVE))) {
return return
} }
@@ -90,10 +91,6 @@ const Tab = (($) => {
if (ulElement) { if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE)) previous = $.makeArray($(ulElement).find(Selector.ACTIVE))
previous = previous[previous.length - 1] previous = previous[previous.length - 1]
if (previous) {
previous = $(previous).find(Selector.A)[0]
}
} }
let hideEvent = $.Event(Event.HIDE, { let hideEvent = $.Event(Event.HIDE, {
@@ -120,7 +117,7 @@ const Tab = (($) => {
} }
this._activate( this._activate(
$(this._element).closest(Selector.LI)[0], this._element,
ulElement ulElement
) )
@@ -189,22 +186,16 @@ const Tab = (($) => {
let dropdownChild = $(active).find( let dropdownChild = $(active).find(
Selector.DROPDOWN_ACTIVE_CHILD Selector.DROPDOWN_ACTIVE_CHILD
)[0] )[0]
if (dropdownChild) { if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE) $(dropdownChild).removeClass(ClassName.ACTIVE)
} }
let activeToggle = $(active).find(Selector.DATA_TOGGLE)[0] active.setAttribute('aria-expanded', false)
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false)
}
} }
$(element).addClass(ClassName.ACTIVE) $(element).addClass(ClassName.ACTIVE)
element.setAttribute('aria-expanded', true)
let elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true)
}
if (isTransitioning) { if (isTransitioning) {
Util.reflow(element) Util.reflow(element)
@@ -216,15 +207,12 @@ const Tab = (($) => {
if (element.parentNode && if (element.parentNode &&
($(element.parentNode).hasClass(ClassName.DROPDOWN_MENU))) { ($(element.parentNode).hasClass(ClassName.DROPDOWN_MENU))) {
let dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0] let dropdownElement = $(element).closest(Selector.DROPDOWN)[0]
if (dropdownElement) { if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE) $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE)
} }
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0] element.setAttribute('aria-expanded', true)
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true)
}
} }
if (callback) { if (callback) {

59
js/tests/unit/scrollspy.js
View File

@@ -129,9 +129,9 @@ $(function () {
var sectionHTML = '<div id="header" style="height: 500px;"></div>' var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">' + '<nav id="navigation" class="navbar">'
+ '<ul class="nav navbar-nav">' + '<ul class="nav navbar-nav">'
+ '<li class="active"><a id="one-link" href="#one">One</a></li>' + '<li class="active"><a class="nav-link" id="one-link" href="#one">One</a></li>'
+ '<li><a id="two-link" href="#two">Two</a></li>' + '<li><a class="nav-link" id="two-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" href="#three">Three</a></li>' + '<li><a class="nav-link" id="three-link" href="#three">Three</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
+ '<div id="content" style="height: 200px; overflow-y: auto;">' + '<div id="content" style="height: 200px; overflow-y: auto;">'
@@ -147,9 +147,9 @@ $(function () {
$scrollspy.bootstrapScrollspy({ target: '#navigation', offset: $scrollspy.position().top }) $scrollspy.bootstrapScrollspy({ target: '#navigation', offset: $scrollspy.position().top })
$scrollspy.on('scroll.bs.scrollspy', function () { $scrollspy.on('scroll.bs.scrollspy', function () {
assert.ok(!$section.find('#one-link').parent().hasClass('active'), '"active" class removed from first section') assert.ok(!$section.find('#one-link').hasClass('active'), '"active" class removed from first section')
assert.ok($section.find('#two-link').parent().hasClass('active'), '"active" class on middle section') assert.ok($section.find('#two-link').hasClass('active'), '"active" class on middle section')
assert.ok(!$section.find('#three-link').parent().hasClass('active'), '"active" class not on last section') assert.ok(!$section.find('#three-link').hasClass('active'), '"active" class not on last section')
done() done()
}) })
@@ -161,8 +161,8 @@ $(function () {
var navbarHtml = var navbarHtml =
'<nav class="navbar">' '<nav class="navbar">'
+ '<ul class="nav">' + '<ul class="nav">'
+ '<li id="li-1"><a href="#div-1">div 1</a></li>' + '<li><a class="nav-link" id="a-1" href="#div-1">div 1</a></li>'
+ '<li id="li-2"><a href="#div-2">div 2</a></li>' + '<li><a class="nav-link" id="a-2" href="#div-2">div 2</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
var contentHtml = var contentHtml =
@@ -189,8 +189,8 @@ $(function () {
return deferred.promise() return deferred.promise()
} }
$.when(testElementIsActiveAfterScroll('#li-1', '#div-1')) $.when(testElementIsActiveAfterScroll('#a-1', '#div-1'))
.then(function () { return testElementIsActiveAfterScroll('#li-2', '#div-2') }) .then(function () { return testElementIsActiveAfterScroll('#a-2', '#div-2') })
}) })
QUnit.test('should add the active class correctly when there are nested elements at 0 scroll offset', function (assert) { QUnit.test('should add the active class correctly when there are nested elements at 0 scroll offset', function (assert) {
@@ -199,9 +199,9 @@ $(function () {
var done = assert.async() var done = assert.async()
var navbarHtml = '<nav id="navigation" class="navbar">' var navbarHtml = '<nav id="navigation" class="navbar">'
+ '<ul class="nav">' + '<ul class="nav">'
+ '<li id="li-1"><a href="#div-1">div 1</a>' + '<li><a id="a-1" class="nav-link" href="#div-1">div 1</a>'
+ '<ul>' + '<ul>'
+ '<li id="li-2"><a href="#div-2">div 2</a></li>' + '<li><a id="a-2" class="nav-link" href="#div-2">div 2</a></li>'
+ '</ul>' + '</ul>'
+ '</li>' + '</li>'
+ '</ul>' + '</ul>'
@@ -223,8 +223,8 @@ $(function () {
if (++times > 3) return done() if (++times > 3) return done()
$content.one('scroll', function () { $content.one('scroll', function () {
assert.ok($('#li-1').hasClass('active'), 'nav item for outer element has "active" class') assert.ok($('#a-1').hasClass('active'), 'nav item for outer element has "active" class')
assert.ok($('#li-2').hasClass('active'), 'nav item for inner element has "active" class') assert.ok($('#a-2').hasClass('active'), 'nav item for inner element has "active" class')
testActiveElements() testActiveElements()
}) })
@@ -239,9 +239,9 @@ $(function () {
var sectionHTML = '<div id="header" style="height: 500px;"></div>' var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">' + '<nav id="navigation" class="navbar">'
+ '<ul class="nav navbar-nav">' + '<ul class="nav navbar-nav">'
+ '<li class="active"><a id="one-link" href="#one">One</a></li>' + '<li><a id="one-link" class="nav-link active" href="#one">One</a></li>'
+ '<li><a id="two-link" href="#two">Two</a></li>' + '<li><a id="two-link" class="nav-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" href="#three">Three</a></li>' + '<li><a id="three-link" class="nav-link" href="#three">Three</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
$(sectionHTML).appendTo('#qunit-fixture') $(sectionHTML).appendTo('#qunit-fixture')
@@ -262,8 +262,7 @@ $(function () {
}) })
.one('scroll.bs.scrollspy', function () { .one('scroll.bs.scrollspy', function () {
assert.strictEqual($('.active').length, 1, '"active" class on only one element present') assert.strictEqual($('.active').length, 1, '"active" class on only one element present')
assert.strictEqual($('.active').has('#two-link').length, 1, '"active" class on second section') assert.strictEqual($('.active').is('#two-link'), true, '"active" class on second section')
$scrollspy $scrollspy
.one('scroll.bs.scrollspy', function () { .one('scroll.bs.scrollspy', function () {
assert.strictEqual($('.active').length, 0, 'selection cleared') assert.strictEqual($('.active').length, 0, 'selection cleared')
@@ -279,11 +278,11 @@ $(function () {
var navbarHtml = var navbarHtml =
'<nav class="navbar">' '<nav class="navbar">'
+ '<ul class="nav">' + '<ul class="nav">'
+ '<li id="li-100-1"><a href="#div-100-1">div 1</a></li>' + '<li><a id="li-100-1" class="nav-link" href="#div-100-1">div 1</a></li>'
+ '<li id="li-100-2"><a href="#div-100-2">div 2</a></li>' + '<li><a id="li-100-2" class="nav-link" href="#div-100-2">div 2</a></li>'
+ '<li id="li-100-3"><a href="#div-100-3">div 3</a></li>' + '<li><a id="li-100-3" class="nav-link" href="#div-100-3">div 3</a></li>'
+ '<li id="li-100-4"><a href="#div-100-4">div 4</a></li>' + '<li><a id="li-100-4" class="nav-link" href="#div-100-4">div 4</a></li>'
+ '<li id="li-100-5"><a href="#div-100-5">div 5</a></li>' + '<li><a id="li-100-5" class="nav-link" href="#div-100-5">div 5</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
var contentHtml = var contentHtml =
@@ -328,9 +327,9 @@ $(function () {
var navbarHtml = var navbarHtml =
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>' '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ '<ul class="nav">' + '<ul class="nav">'
+ '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>' + '<li><a id="li-' + type + 'm-1" class="nav-link" href="#div-' + type + 'm-1">div 1</a></li>'
+ '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>' + '<li><a id="li-' + type + 'm-2" class="nav-link" href="#div-' + type + 'm-2">div 2</a></li>'
+ '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>' + '<li><a id="li-' + type + 'm-3" class="nav-link" href="#div-' + type + 'm-3">div 3</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
var contentHtml = var contentHtml =
@@ -371,9 +370,9 @@ $(function () {
var navbarHtml = var navbarHtml =
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>' '<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ '<ul class="nav">' + '<ul class="nav">'
+ '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>' + '<li><a class="nav-link" id="li-' + type + 'm-1" href="#div-' + type + 'm-1">div 1</a></li>'
+ '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>' + '<li><a class="nav-link" id="li-' + type + 'm-2" href="#div-' + type + 'm-2">div 2</a></li>'
+ '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>' + '<li><a class="nav-link" id="li-' + type + 'm-3" href="#div-' + type + 'm-3">div 3</a></li>'
+ '</ul>' + '</ul>'
+ '</nav>' + '</nav>'
var contentHtml = var contentHtml =

20
js/tests/unit/tab.js
View File

@@ -191,26 +191,26 @@ $(function () {
QUnit.test('selected tab should have aria-expanded', function (assert) { QUnit.test('selected tab should have aria-expanded', function (assert) {
assert.expect(8) assert.expect(8)
var tabsHTML = '<ul class="nav nav-tabs">' var tabsHTML = '<ul class="nav nav-tabs">'
+ '<li class="active"><a href="#home" toggle="tab" aria-expanded="true">Home</a></li>' + '<li><a class="nav-item active" href="#home" toggle="tab" aria-expanded="true">Home</a></li>'
+ '<li><a href="#profile" toggle="tab" aria-expanded="false">Profile</a></li>' + '<li><a class="nav-item" href="#profile" toggle="tab" aria-expanded="false">Profile</a></li>'
+ '</ul>' + '</ul>'
var $tabs = $(tabsHTML).appendTo('#qunit-fixture') var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
$tabs.find('li:first a').bootstrapTab('show') $tabs.find('li:first a').bootstrapTab('show')
assert.strictEqual($tabs.find('.active a').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true') assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true')
assert.strictEqual($tabs.find('li:not(.active) a').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false') assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false')
$tabs.find('li:last a').trigger('click') $tabs.find('li:last a').trigger('click')
assert.strictEqual($tabs.find('.active a').attr('aria-expanded'), 'true', 'after click, shown tab has aria-expanded = true') assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'after click, shown tab has aria-expanded = true')
assert.strictEqual($tabs.find('li:not(.active) a').attr('aria-expanded'), 'false', 'after click, hidden tab has aria-expanded = false') assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'after click, hidden tab has aria-expanded = false')
$tabs.find('li:first a').bootstrapTab('show') $tabs.find('li:first a').bootstrapTab('show')
assert.strictEqual($tabs.find('.active a').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true') assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true')
assert.strictEqual($tabs.find('li:not(.active) a').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false') assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false')
$tabs.find('li:first a').trigger('click') $tabs.find('li:first a').trigger('click')
assert.strictEqual($tabs.find('.active a').attr('aria-expanded'), 'true', 'after second show event, shown tab still has aria-expanded = true') assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'after second show event, shown tab still has aria-expanded = true')
assert.strictEqual($tabs.find('li:not(.active) a').attr('aria-expanded'), 'false', 'after second show event, hidden tab has aria-expanded = false') assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'after second show event, hidden tab has aria-expanded = false')
}) })
}) })

33
js/tests/visual/scrollspy.html
View File

@@ -22,26 +22,25 @@
<div class="container"> <div class="container">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <nav class="navbar navbar-dark navbar-fixed-top bg-inverse" role="navigation">
<div class="container-fluid"> <div class="js-navbar-scrollspy">
<div class="js-navbar-scrollspy"> <ul class="nav navbar-nav">
<ul class="nav navbar-nav"> <li class="nav-item"><a class="nav-link active" href="#fat">@fat</a></li>
<li class="nav-item active"><a class="nav-link" href="#fat">@fat</a></li> <li class="nav-item"><a class="nav-link" href="#mdo">@mdo</a></li>
<li class="nav-item"><a class="nav-link" href="#mdo">@mdo</a></li> <li class="dropdown nav-item">
<li class="dropdown nav-item"> <a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown</a>
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <div class="dropdown-menu" role="menu">
<ul class="dropdown-menu" role="menu"> <a class="dropdown-item" href="#one" tabindex="-1">one</a>
<li class=""><a href="#one" tabindex="-1">one</a></li> <a class="dropdown-item" href="#two" tabindex="-1">two</a>
<li><a href="#two" tabindex="-1">two</a></li> <div class="dropdown-divider"></div>
<li role="separator" class="divider"></li> <a class="dropdown-item" href="#three" tabindex="-1">three</a>
<li><a href="#three" tabindex="-1">three</a></li> </div>
</ul> </li>
</li> </ul>
</ul>
</div>
</div> </div>
</nav> </nav>
<h2 id="fat">@fat</h2> <h2 id="fat">@fat</h2>
<p>Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.</p> <p>Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.</p>
<p>Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.</p> <p>Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.</p>

36
js/tests/visual/tab.html
View File

@@ -35,14 +35,14 @@
<h4>Tabs without fade</h4> <h4>Tabs without fade</h4>
<ul id="myTab" class="nav nav-tabs"> <ul id="myTab" class="nav nav-tabs">
<li class="active nav-item"><a href="#home" class="nav-link" data-toggle="tab">Home</a></li> <li class="nav-item"><a href="#home" class="nav-link active" data-toggle="tab">Home</a></li>
<li class="nav-item"><a href="#profile" data-toggle="tab" class="nav-link">Profile</a></li> <li class="nav-item"><a href="#profile" data-toggle="tab" class="nav-link">Profile</a></li>
<li class="dropdown nav-item"> <li class="dropdown nav-item">
<a href="#" id="myTabDrop1" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <a href="#" id="myTabDrop1" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1"> <div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
<li><a href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a></li> <a class="dropdown-item" href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a>
<li><a href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a></li> <a class="dropdown-item" href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a>
</ul> </div>
</li> </li>
</ul> </ul>
<div id="myTabContent" class="tab-content"> <div id="myTabContent" class="tab-content">
@@ -67,14 +67,14 @@
<h4>Tabs with fade</h4> <h4>Tabs with fade</h4>
<ul id="myTab1" class="nav nav-tabs"> <ul id="myTab1" class="nav nav-tabs">
<li class="active nav-item"><a class="nav-link" href="#home1" data-toggle="tab">Home</a></li> <li class="nav-item"><a class="nav-link active" href="#home1" data-toggle="tab">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#profile1" data-toggle="tab">Profile</a></li> <li class="nav-item"><a class="nav-link" href="#profile1" data-toggle="tab">Profile</a></li>
<li class="dropdown nav-item"> <li class="dropdown nav-item">
<a href="#" id="myTabDrop2" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <a href="#" id="myTabDrop2" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop2"> <div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop2">
<li><a href="#dropdown1-1" tabindex="-1" data-toggle="tab">@fat</a></li> <a class="dropdown-item" href="#dropdown1-1" tabindex="-1" data-toggle="tab">@fat</a>
<li><a href="#dropdown1-2" tabindex="-1" data-toggle="tab">@mdo</a></li> <a class="dropdown-item" href="#dropdown1-2" tabindex="-1" data-toggle="tab">@mdo</a>
</ul> </div>
</li> </li>
</ul> </ul>
<div id="myTabContent1" class="tab-content"> <div id="myTabContent1" class="tab-content">
@@ -103,10 +103,10 @@
<li class="nav-item"><a class="nav-link" href="#profile2" data-toggle="tab">Profile</a></li> <li class="nav-item"><a class="nav-link" href="#profile2" data-toggle="tab">Profile</a></li>
<li class="dropdown nav-item"> <li class="dropdown nav-item">
<a href="#" id="myTabDrop3" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <a href="#" id="myTabDrop3" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop3"> <div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop3">
<li><a href="#dropdown2-1" tabindex="-1" data-toggle="tab">@fat</a></li> <a class="dropdown-item" href="#dropdown2-1" tabindex="-1" data-toggle="tab">@fat</a>
<li><a href="#dropdown2-2" tabindex="-1" data-toggle="tab">@mdo</a></li> <a class="dropdown-item" href="#dropdown2-2" tabindex="-1" data-toggle="tab">@mdo</a>
</ul> </div>
</li> </li>
</ul> </ul>
<div id="myTabContent2" class="tab-content"> <div id="myTabContent2" class="tab-content">
@@ -135,10 +135,10 @@
<li class="nav-item"><a class="nav-link" href="#profile3" data-toggle="tab">Profile</a></li> <li class="nav-item"><a class="nav-link" href="#profile3" data-toggle="tab">Profile</a></li>
<li class="dropdown nav-item"> <li class="dropdown nav-item">
<a href="#" id="myTabDrop4" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <a href="#" id="myTabDrop4" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop4"> <div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop4">
<li><a href="#dropdown3-1" tabindex="-1" data-toggle="tab">@fat</a></li> <a class="dropdown-item" href="#dropdown3-1" tabindex="-1" data-toggle="tab">@fat</a>
<li><a href="#dropdown3-2" tabindex="-1" data-toggle="tab">@mdo</a></li> <a class="dropdown-item" href="#dropdown3-2" tabindex="-1" data-toggle="tab">@mdo</a>
</ul> </div>
</li> </li>
</ul> </ul>
<div id="myTabContent3" class="tab-content"> <div id="myTabContent3" class="tab-content">