Skip to content

B
bootstrap
Commit fc5d996e authored by Mark Otto's avatar Mark Otto
Browse files
Options

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

parents d52755b3 08d2041c
Expand all Show whitespace changes
Inline Side-by-side
Showing with 293 additions and 355 deletions
dist/js/bootstrap.js
View file @ fc5d996e
......@@ -2203,16 +2203,23 @@ var ScrollSpy = (function ($) {
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li',
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 = {
......@@ -2233,7 +2240,7 @@ var ScrollSpy = (function ($) {
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
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._targets = [];
this._activeTarget = null;
......@@ -2381,20 +2388,20 @@ var ScrollSpy = (function ($) {
this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]');
// todo (fat): getting all the raw li's up the tree is not great.
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE);
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var itemParent = parentListItems[i].parentNode;
var $link = $(queries.join(','));
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0];
$(closestDropdown).addClass(ClassName.ACTIVE);
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -2404,11 +2411,7 @@ var ScrollSpy = (function ($) {
}, {
key: '_clear',
value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
......@@ -2511,13 +2514,14 @@ var Tab = (function ($) {
var Selector = {
A: 'a',
LI: 'li',
LI_DROPDOWN: 'li.dropdown',
DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade',
FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active',
ACTIVE_CHILD: '> .active',
ACTIVE_CHILD: '> .nav-item > .active, > .active',
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() {
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;
}
......@@ -2561,10 +2565,6 @@ var Tab = (function ($) {
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
}
var hideEvent = $.Event(Event.HIDE, {
......@@ -2589,7 +2589,7 @@ var Tab = (function ($) {
target = $(selector)[0];
}
this._activate($(this._element).closest(Selector.LI)[0], ulElement);
this._activate(this._element, ulElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
......@@ -2644,22 +2644,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0];
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
Util.reflow(element);
......@@ -2670,15 +2664,12 @@ var Tab = (function ($) {
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) {
$(dropdownElement).addClass(ClassName.ACTIVE);
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
......
dist/js/bootstrap.min.js
View file @ fc5d996e
This diff is collapsed.
dist/js/umd/scrollspy.js
View file @ fc5d996e
......@@ -62,16 +62,23 @@
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li',
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 = {
......@@ -92,7 +99,7 @@
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
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._targets = [];
this._activeTarget = null;
......@@ -240,20 +247,20 @@
this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]');
// todo (fat): getting all the raw li's up the tree is not great.
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE);
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var itemParent = parentListItems[i].parentNode;
var $link = $(queries.join(','));
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0];
$(closestDropdown).addClass(ClassName.ACTIVE);
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -263,11 +270,7 @@
}, {
key: '_clear',
value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
......
dist/js/umd/tab.js
View file @ fc5d996e
......@@ -62,13 +62,14 @@
var Selector = {
A: 'a',
LI: 'li',
LI_DROPDOWN: 'li.dropdown',
DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade',
FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active',
ACTIVE_CHILD: '> .active',
ACTIVE_CHILD: '> .nav-item > .active, > .active',
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() {
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;
}
......@@ -112,10 +113,6 @@
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
}
var hideEvent = $.Event(Event.HIDE, {
......@@ -140,7 +137,7 @@
target = $(selector)[0];
}
this._activate($(this._element).closest(Selector.LI)[0], ulElement);
this._activate(this._element, ulElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
......@@ -195,22 +192,16 @@
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0];
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
_Util['default'].reflow(element);
......@@ -221,15 +212,12 @@
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) {
$(dropdownElement).addClass(ClassName.ACTIVE);
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
......
docs/dist/js/bootstrap.js
View file @ fc5d996e
......@@ -2203,16 +2203,23 @@ var ScrollSpy = (function ($) {
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li',
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 = {
......@@ -2233,7 +2240,7 @@ var ScrollSpy = (function ($) {
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
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._targets = [];
this._activeTarget = null;
......@@ -2381,20 +2388,20 @@ var ScrollSpy = (function ($) {
this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]');
// todo (fat): getting all the raw li's up the tree is not great.
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE);
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var itemParent = parentListItems[i].parentNode;
var $link = $(queries.join(','));
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0];
$(closestDropdown).addClass(ClassName.ACTIVE);
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -2404,11 +2411,7 @@ var ScrollSpy = (function ($) {
}, {
key: '_clear',
value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
......@@ -2511,13 +2514,14 @@ var Tab = (function ($) {
var Selector = {
A: 'a',
LI: 'li',
LI_DROPDOWN: 'li.dropdown',
DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade',
FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active',
ACTIVE_CHILD: '> .active',
ACTIVE_CHILD: '> .nav-item > .active, > .active',
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() {
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;
}
......@@ -2561,10 +2565,6 @@ var Tab = (function ($) {
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
}
var hideEvent = $.Event(Event.HIDE, {
......@@ -2589,7 +2589,7 @@ var Tab = (function ($) {
target = $(selector)[0];
}
this._activate($(this._element).closest(Selector.LI)[0], ulElement);
this._activate(this._element, ulElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
......@@ -2644,22 +2644,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0];
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
Util.reflow(element);
......@@ -2670,15 +2664,12 @@ var Tab = (function ($) {
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) {
$(dropdownElement).addClass(ClassName.ACTIVE);
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
......
docs/dist/js/bootstrap.min.js
View file @ fc5d996e
This diff is collapsed.
docs/dist/js/umd/scrollspy.js
View file @ fc5d996e
......@@ -62,16 +62,23 @@
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li',
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 = {
......@@ -92,7 +99,7 @@
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
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._targets = [];
this._activeTarget = null;
......@@ -240,20 +247,20 @@
this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]');
// todo (fat): getting all the raw li's up the tree is not great.
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE);
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var itemParent = parentListItems[i].parentNode;
var $link = $(queries.join(','));
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0];
$(closestDropdown).addClass(ClassName.ACTIVE);
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -263,11 +270,7 @@
}, {
key: '_clear',
value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
......
docs/dist/js/umd/tab.js
View file @ fc5d996e
......@@ -62,13 +62,14 @@
var Selector = {
A: 'a',
LI: 'li',
LI_DROPDOWN: 'li.dropdown',
DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade',
FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active',
ACTIVE_CHILD: '> .active',
ACTIVE_CHILD: '> .nav-item > .active, > .active',
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() {
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;
}
......@@ -112,10 +113,6 @@
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
}
var hideEvent = $.Event(Event.HIDE, {
......@@ -140,7 +137,7 @@
target = $(selector)[0];
}
this._activate($(this._element).closest(Selector.LI)[0], ulElement);
this._activate(this._element, ulElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
......@@ -195,22 +192,16 @@
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0];
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
_Util['default'].reflow(element);
......@@ -221,15 +212,12 @@
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) {
$(dropdownElement).addClass(ClassName.ACTIVE);
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
......
js/dist/scrollspy.js
View file @ fc5d996e
......@@ -45,16 +45,23 @@ var ScrollSpy = (function ($) {
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
NAV_LINK: 'nav-link',
NAV: 'nav',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
LIST_ITEM: '.list-item',
LI: 'li',
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 = {
......@@ -75,7 +82,7 @@ var ScrollSpy = (function ($) {
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
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._targets = [];
this._activeTarget = null;
......@@ -223,20 +230,20 @@ var ScrollSpy = (function ($) {
this._clear();
var selector = this._selector + '[data-target="' + target + '"],' + (this._selector + '[href="' + target + '"]');
// todo (fat): getting all the raw li's up the tree is not great.
var parentListItems = $(selector).parents(Selector.LI);
for (var i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE);
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var itemParent = parentListItems[i].parentNode;
var $link = $(queries.join(','));
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
var closestDropdown = $(itemParent).closest(Selector.LI_DROPDOWN)[0];
$(closestDropdown).addClass(ClassName.ACTIVE);
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -246,11 +253,7 @@ var ScrollSpy = (function ($) {
}, {
key: '_clear',
value: function _clear() {
var activeParents = $(this._selector).parentsUntil(this._config.target, Selector.ACTIVE);
for (var i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE);
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
......
js/dist/scrollspy.js.map
View file @ fc5d996e
This diff was suppressed by a .gitattributes entry.
js/dist/tab.js
View file @ fc5d996e
......@@ -45,13 +45,14 @@ var Tab = (function ($) {
var Selector = {
A: 'a',
LI: 'li',
LI_DROPDOWN: 'li.dropdown',
DROPDOWN: '.dropdown',
UL: 'ul:not(.dropdown-menu)',
FADE_CHILD: '> .fade',
FADE_CHILD: '> .nav-item .fade, > .fade',
ACTIVE: '.active',
ACTIVE_CHILD: '> .active',
ACTIVE_CHILD: '> .nav-item > .active, > .active',
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() {
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;
}
......@@ -95,10 +96,6 @@ var Tab = (function ($) {
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE));
previous = previous[previous.length - 1];
if (previous) {
previous = $(previous).find(Selector.A)[0];
}
}
var hideEvent = $.Event(Event.HIDE, {
......@@ -123,7 +120,7 @@ var Tab = (function ($) {
target = $(selector)[0];
}
this._activate($(this._element).closest(Selector.LI)[0], ulElement);
this._activate(this._element, ulElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
......@@ -178,22 +175,16 @@ var Tab = (function ($) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
var activeToggle = $(active).find(Selector.DATA_TOGGLE)[0];
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false);
}
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
var elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
Util.reflow(element);
......@@ -204,15 +195,12 @@ var Tab = (function ($) {
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) {
$(dropdownElement).addClass(ClassName.ACTIVE);
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0];
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
......
js/dist/tab.js.map
View file @ fc5d996e
This diff was suppressed by a .gitattributes entry.
js/src/scrollspy.js
View file @ fc5d996e
......@@ -43,16 +43,23 @@ const ScrollSpy = (($) => {
}
const ClassName = {
DROPDOWN_ITEM : 'dropdown-item',
DROPDOWN_MENU : 'dropdown-menu',
NAV_LINK : 'nav-link',
NAV : 'nav',
ACTIVE : 'active'
}
const Selector = {
DATA_SPY : '[data-spy="scroll"]',
ACTIVE : '.active',
LIST_ITEM : '.list-item',
LI : 'li',
LI_DROPDOWN : 'li.dropdown',
NAV_ANCHORS : '.nav li > a'
NAV_LINKS : '.nav-link',
DROPDOWN : '.dropdown',
DROPDOWN_ITEMS : '.dropdown-item',
DROPDOWN_TOGGLE : '.dropdown-toggle'
}
const OffsetMethod = {
......@@ -73,7 +80,8 @@ const ScrollSpy = (($) => {
this._element = element
this._scrollElement = element.tagName === 'BODY' ? window : element
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._targets = []
this._activeTarget = null
......@@ -229,23 +237,21 @@ const ScrollSpy = (($) => {
this._clear()
let selector =
`${this._selector}[data-target="${target}"],` +
`${this._selector}[href="${target}"]`
// todo (fat): getting all the raw li's up the tree is not great.
let parentListItems = $(selector).parents(Selector.LI)
for (let i = parentListItems.length; i--;) {
$(parentListItems[i]).addClass(ClassName.ACTIVE)
let queries = this._selector.split(',')
queries = queries.map((selector) => {
return `${selector}[data-target="${target}"],` +
`${selector}[href="${target}"]`
})
let itemParent = parentListItems[i].parentNode
let $link = $(queries.join(','))
if (itemParent && $(itemParent).hasClass(ClassName.DROPDOWN_MENU)) {
let closestDropdown = $(itemParent)
.closest(Selector.LI_DROPDOWN)[0]
$(closestDropdown).addClass(ClassName.ACTIVE)
}
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE)
$link.addClass(ClassName.ACTIVE)
} else {
// todo (fat) this is kinda sus…
// recursively add actives to tested nav-links
$link.parents(Selector.LI).find(Selector.NAV_LINKS).addClass(ClassName.ACTIVE)
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
......@@ -254,14 +260,7 @@ const ScrollSpy = (($) => {
}
_clear() {
let activeParents = $(this._selector).parentsUntil(
this._config.target,
Selector.ACTIVE
)
for (let i = activeParents.length; i--;) {
$(activeParents[i]).removeClass(ClassName.ACTIVE)
}
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE)
}
......
js/src/tab.js
View file @ fc5d996e
......@@ -43,13 +43,14 @@ const Tab = (($) => {
const Selector = {
A : 'a',
LI : 'li',
LI_DROPDOWN : 'li.dropdown',
DROPDOWN : '.dropdown',
UL : 'ul:not(.dropdown-menu)',
FADE_CHILD : '> .fade',
FADE_CHILD : '> .nav-item .fade, > .fade',
ACTIVE : '.active',
ACTIVE_CHILD : '> .active',
ACTIVE_CHILD : '> .nav-item > .active, > .active',
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() {
if (this._element.parentNode &&
(this._element.parentNode.nodeType === Node.ELEMENT_NODE) &&
($(this._element).parent().hasClass(ClassName.ACTIVE))) {
($(this._element).hasClass(ClassName.ACTIVE))) {
return
}
......@@ -90,10 +91,6 @@ const Tab = (($) => {
if (ulElement) {
previous = $.makeArray($(ulElement).find(Selector.ACTIVE))
previous = previous[previous.length - 1]
if (previous) {
previous = $(previous).find(Selector.A)[0]
}
}
let hideEvent = $.Event(Event.HIDE, {
......@@ -120,7 +117,7 @@ const Tab = (($) => {
}
this._activate(
$(this._element).closest(Selector.LI)[0],
this._element,
ulElement
)
......@@ -189,22 +186,16 @@ const Tab = (($) => {
let dropdownChild = $(active).find(
Selector.DROPDOWN_ACTIVE_CHILD
)[0]
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE)
}
let activeToggle = $(active).find(Selector.DATA_TOGGLE)[0]
if (activeToggle) {
activeToggle.setAttribute('aria-expanded', false)
}
active.setAttribute('aria-expanded', false)
}
$(element).addClass(ClassName.ACTIVE)
let elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true)
}
element.setAttribute('aria-expanded', true)
if (isTransitioning) {
Util.reflow(element)
......@@ -216,15 +207,12 @@ const Tab = (($) => {
if (element.parentNode &&
($(element.parentNode).hasClass(ClassName.DROPDOWN_MENU))) {
let dropdownElement = $(element).closest(Selector.LI_DROPDOWN)[0]
let dropdownElement = $(element).closest(Selector.DROPDOWN)[0]
if (dropdownElement) {
$(dropdownElement).addClass(ClassName.ACTIVE)
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE)
}
elementToggle = $(element).find(Selector.DATA_TOGGLE)[0]
if (elementToggle) {
elementToggle.setAttribute('aria-expanded', true)
}
element.setAttribute('aria-expanded', true)
}
if (callback) {
......
js/tests/unit/scrollspy.js
View file @ fc5d996e
......@@ -129,9 +129,9 @@ $(function () {
var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">'
+ '<ul class="nav navbar-nav">'
+ '<li class="active"><a id="one-link" href="#one">One</a></li>'
+ '<li><a id="two-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" href="#three">Three</a></li>'
+ '<li class="active"><a class="nav-link" id="one-link" href="#one">One</a></li>'
+ '<li><a class="nav-link" id="two-link" href="#two">Two</a></li>'
+ '<li><a class="nav-link" id="three-link" href="#three">Three</a></li>'
+ '</ul>'
+ '</nav>'
+ '<div id="content" style="height: 200px; overflow-y: auto;">'
......@@ -147,9 +147,9 @@ $(function () {
$scrollspy.bootstrapScrollspy({ target: '#navigation', offset: $scrollspy.position().top })
$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('#two-link').parent().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('#one-link').hasClass('active'), '"active" class removed from first section')
assert.ok($section.find('#two-link').hasClass('active'), '"active" class on middle section')
assert.ok(!$section.find('#three-link').hasClass('active'), '"active" class not on last section')
done()
})
......@@ -161,8 +161,8 @@ $(function () {
var navbarHtml =
'<nav class="navbar">'
+ '<ul class="nav">'
+ '<li id="li-1"><a 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-1" href="#div-1">div 1</a></li>'
+ '<li><a class="nav-link" id="a-2" href="#div-2">div 2</a></li>'
+ '</ul>'
+ '</nav>'
var contentHtml =
......@@ -189,8 +189,8 @@ $(function () {
return deferred.promise()
}
$.when(testElementIsActiveAfterScroll('#li-1', '#div-1'))
.then(function () { return testElementIsActiveAfterScroll('#li-2', '#div-2') })
$.when(testElementIsActiveAfterScroll('#a-1', '#div-1'))
.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) {
......@@ -199,9 +199,9 @@ $(function () {
var done = assert.async()
var navbarHtml = '<nav id="navigation" class="navbar">'
+ '<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>'
+ '<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>'
+ '</li>'
+ '</ul>'
......@@ -223,8 +223,8 @@ $(function () {
if (++times > 3) return done()
$content.one('scroll', function () {
assert.ok($('#li-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-1').hasClass('active'), 'nav item for outer element has "active" class')
assert.ok($('#a-2').hasClass('active'), 'nav item for inner element has "active" class')
testActiveElements()
})
......@@ -239,9 +239,9 @@ $(function () {
var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">'
+ '<ul class="nav navbar-nav">'
+ '<li class="active"><a id="one-link" href="#one">One</a></li>'
+ '<li><a id="two-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" href="#three">Three</a></li>'
+ '<li><a id="one-link" class="nav-link active" href="#one">One</a></li>'
+ '<li><a id="two-link" class="nav-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" class="nav-link" href="#three">Three</a></li>'
+ '</ul>'
+ '</nav>'
$(sectionHTML).appendTo('#qunit-fixture')
......@@ -262,8 +262,7 @@ $(function () {
})
.one('scroll.bs.scrollspy', function () {
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
.one('scroll.bs.scrollspy', function () {
assert.strictEqual($('.active').length, 0, 'selection cleared')
......@@ -279,11 +278,11 @@ $(function () {
var navbarHtml =
'<nav class="navbar">'
+ '<ul class="nav">'
+ '<li id="li-100-1"><a href="#div-100-1">div 1</a></li>'
+ '<li id="li-100-2"><a href="#div-100-2">div 2</a></li>'
+ '<li id="li-100-3"><a href="#div-100-3">div 3</a></li>'
+ '<li id="li-100-4"><a 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-1" class="nav-link" href="#div-100-1">div 1</a></li>'
+ '<li><a id="li-100-2" class="nav-link" href="#div-100-2">div 2</a></li>'
+ '<li><a id="li-100-3" class="nav-link" href="#div-100-3">div 3</a></li>'
+ '<li><a id="li-100-4" class="nav-link" href="#div-100-4">div 4</a></li>'
+ '<li><a id="li-100-5" class="nav-link" href="#div-100-5">div 5</a></li>'
+ '</ul>'
+ '</nav>'
var contentHtml =
......@@ -328,9 +327,9 @@ $(function () {
var navbarHtml =
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ '<ul class="nav">'
+ '<li id="li-' + type + 'm-1"><a 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 id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
+ '<li><a id="li-' + type + 'm-1" class="nav-link" href="#div-' + type + 'm-1">div 1</a></li>'
+ '<li><a id="li-' + type + 'm-2" class="nav-link" href="#div-' + type + 'm-2">div 2</a></li>'
+ '<li><a id="li-' + type + 'm-3" class="nav-link" href="#div-' + type + 'm-3">div 3</a></li>'
+ '</ul>'
+ '</nav>'
var contentHtml =
......@@ -371,9 +370,9 @@ $(function () {
var navbarHtml =
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
+ '<ul class="nav">'
+ '<li id="li-' + type + 'm-1"><a 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 id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
+ '<li><a class="nav-link" id="li-' + type + 'm-1" href="#div-' + type + 'm-1">div 1</a></li>'
+ '<li><a class="nav-link" id="li-' + type + 'm-2" href="#div-' + type + 'm-2">div 2</a></li>'
+ '<li><a class="nav-link" id="li-' + type + 'm-3" href="#div-' + type + 'm-3">div 3</a></li>'
+ '</ul>'
+ '</nav>'
var contentHtml =
......
js/tests/unit/tab.js
View file @ fc5d996e
......@@ -191,26 +191,26 @@ $(function () {
QUnit.test('selected tab should have aria-expanded', function (assert) {
assert.expect(8)
var tabsHTML = '<ul class="nav nav-tabs">'
+ '<li class="active"><a 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 active" href="#home" toggle="tab" aria-expanded="true">Home</a></li>'
+ '<li><a class="nav-item" href="#profile" toggle="tab" aria-expanded="false">Profile</a></li>'
+ '</ul>'
var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
$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('li:not(.active) a').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false')
assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true')
assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false')
$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('li:not(.active) a').attr('aria-expanded'), 'false', 'after click, hidden tab has aria-expanded = false')
assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'after click, shown tab has aria-expanded = true')
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')
assert.strictEqual($tabs.find('.active a').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('.active').attr('aria-expanded'), 'true', 'shown tab has aria-expanded = true')
assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'hidden tab has aria-expanded = false')
$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('li:not(.active) a').attr('aria-expanded'), 'false', 'after second show event, hidden tab has aria-expanded = false')
assert.strictEqual($tabs.find('.active').attr('aria-expanded'), 'true', 'after second show event, shown tab still has aria-expanded = true')
assert.strictEqual($tabs.find('a:not(.active)').attr('aria-expanded'), 'false', 'after second show event, hidden tab has aria-expanded = false')
})
})
js/tests/visual/scrollspy.html
View file @ fc5d996e
......@@ -22,26 +22,25 @@
<div class="container">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<nav class="navbar navbar-dark navbar-fixed-top bg-inverse" role="navigation">
<div class="js-navbar-scrollspy">
<ul class="nav navbar-nav">
<li class="nav-item active"><a class="nav-link" href="#fat">@fat</a></li>
<li class="nav-item"><a class="nav-link active" href="#fat">@fat</a></li>
<li class="nav-item"><a class="nav-link" href="#mdo">@mdo</a></li>
<li class="dropdown nav-item">
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu">
<li class=""><a href="#one" tabindex="-1">one</a></li>
<li><a href="#two" tabindex="-1">two</a></li>
<li role="separator" class="divider"></li>
<li><a href="#three" tabindex="-1">three</a></li>
</ul>
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">Dropdown</a>
<div class="dropdown-menu" role="menu">
<a class="dropdown-item" href="#one" tabindex="-1">one</a>
<a class="dropdown-item" href="#two" tabindex="-1">two</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#three" tabindex="-1">three</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<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>
......
js/tests/visual/tab.html
View file @ fc5d996e
......@@ -35,14 +35,14 @@
<h4>Tabs without fade</h4>
<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="dropdown nav-item">
<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">
<li><a href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a></li>
</ul>
<div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
<a class="dropdown-item" href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a>
<a class="dropdown-item" href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a>
</div>
</li>
</ul>
<div id="myTabContent" class="tab-content">
......@@ -67,14 +67,14 @@
<h4>Tabs with fade</h4>
<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="dropdown nav-item">
<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">
<li><a href="#dropdown1-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown1-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
</ul>
<div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop2">
<a class="dropdown-item" href="#dropdown1-1" tabindex="-1" data-toggle="tab">@fat</a>
<a class="dropdown-item" href="#dropdown1-2" tabindex="-1" data-toggle="tab">@mdo</a>
</div>
</li>
</ul>
<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="dropdown nav-item">
<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">
<li><a href="#dropdown2-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown2-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
</ul>
<div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop3">
<a class="dropdown-item" href="#dropdown2-1" tabindex="-1" data-toggle="tab">@fat</a>
<a class="dropdown-item" href="#dropdown2-2" tabindex="-1" data-toggle="tab">@mdo</a>
</div>
</li>
</ul>
<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="dropdown nav-item">
<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">
<li><a href="#dropdown3-1" tabindex="-1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown3-2" tabindex="-1" data-toggle="tab">@mdo</a></li>
</ul>
<div class="dropdown-menu" role="menu" aria-labelledby="myTabDrop4">
<a class="dropdown-item" href="#dropdown3-1" tabindex="-1" data-toggle="tab">@fat</a>
<a class="dropdown-item" href="#dropdown3-2" tabindex="-1" data-toggle="tab">@mdo</a>
</div>
</li>
</ul>
<div id="myTabContent3" class="tab-content">
......
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