rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Code Issues Actions Packages Releases Activity

Fix TypeError when Bootstrap is included in head (#32024)

Browse Source 
* extend jquery after domContentLoaded event is fired

* add unittest for util onDOMContentLoaded

* wait for trigger jquery event after domContentLoaded

* remove domcontentready from eventHandler

* move istanbul ignore statements to correct line

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Sascha 2020-11-01 14:32:36 +01:00 committed by GitHub
parent 3a5f9f5cf0
commit c21506d499
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 184 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
js/src/alert.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getElementFromSelector,
@ -146,8 +147,6 @@ class Alert {
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DISMISS, Alert.handleDismiss(new Alert()))
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
@ -155,15 +154,18 @@ const $ = getjQuery()
* add .alert to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Alert.jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Alert.jQueryInterface
$.fn[NAME].Constructor = Alert
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Alert.jQueryInterface
}
}
}
})
export default Alert

26
js/src/button.js
View File

@ -5,7 +5,7 @@
* --------------------------------------------------------------------------
*/
import { getjQuery } from './util/index'
import { getjQuery, onDOMContentLoaded } from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
@ -97,24 +97,26 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, event => {
data.toggle()
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .button to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Button.jQueryInterface
$.fn[NAME].Constructor = Button
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Button.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Button.jQueryInterface
$.fn[NAME].Constructor = Button
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Button.jQueryInterface
}
}
}
})
export default Button

25
js/src/carousel.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getElementFromSelector,
@ -611,23 +612,25 @@ EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
}
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .carousel to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Carousel.jQueryInterface
$.fn[NAME].Constructor = Carousel
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Carousel.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Carousel.jQueryInterface
$.fn[NAME].Constructor = Carousel
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Carousel.jQueryInterface
}
}
}
})
export default Carousel

25
js/src/collapse.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getSelectorFromElement,
@ -408,23 +409,25 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
})
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .collapse to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Collapse.jQueryInterface
$.fn[NAME].Constructor = Collapse
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Collapse.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Collapse.jQueryInterface
$.fn[NAME].Constructor = Collapse
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Collapse.jQueryInterface
}
}
}
})
export default Collapse

2
js/src/dom/event-handler.js
View File

@ -14,7 +14,6 @@ import { defaultPreventedPreservedOnDispatch } from './polyfill'
* ------------------------------------------------------------------------
*/
const $ = getjQuery()
const namespaceRegex = /[^.]*(?=\..*)\.|.*/
const stripNameRegex = /\..*/
const stripUidRegex = /::\d+$/
@ -272,6 +271,7 @@ const EventHandler = {
return null
}
const $ = getjQuery()
const typeEvent = event.replace(stripNameRegex, '')
const inNamespace = event !== typeEvent
const isNative = nativeEvents.indexOf(typeEvent) > -1

25
js/src/dropdown.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
getElementFromSelector,
isElement,
isVisible,
@ -512,23 +513,25 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
})
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_FORM_CHILD, e => e.stopPropagation())
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .dropdown to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Dropdown.jQueryInterface
$.fn[NAME].Constructor = Dropdown
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Dropdown.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Dropdown.jQueryInterface
$.fn[NAME].Constructor = Dropdown
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Dropdown.jQueryInterface
}
}
}
})
export default Dropdown

25
js/src/modal.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getElementFromSelector,
@ -607,23 +608,25 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
data.show(this)
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .modal to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Modal.jQueryInterface
$.fn[NAME].Constructor = Modal
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Modal.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Modal.jQueryInterface
$.fn[NAME].Constructor = Modal
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Modal.jQueryInterface
}
}
}
})
export default Modal

26
js/src/popover.js
View File

@ -5,7 +5,7 @@
* --------------------------------------------------------------------------
*/
import { getjQuery } from './util/index'
import { getjQuery, onDOMContentLoaded } from './util/index'
import Data from './dom/data'
import SelectorEngine from './dom/selector-engine'
import Tooltip from './tooltip'
@ -167,22 +167,24 @@ class Popover extends Tooltip {
}
}
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Popover.jQueryInterface
$.fn[NAME].Constructor = Popover
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Popover.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Popover.jQueryInterface
$.fn[NAME].Constructor = Popover
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Popover.jQueryInterface
}
}
}
})
export default Popover

25
js/src/scrollspy.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
getSelectorFromElement,
getUID,
isElement,
@ -317,22 +318,24 @@ EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
.forEach(spy => new ScrollSpy(spy, Manipulator.getDataAttributes(spy)))
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = ScrollSpy.jQueryInterface
$.fn[NAME].Constructor = ScrollSpy
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return ScrollSpy.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = ScrollSpy.jQueryInterface
$.fn[NAME].Constructor = ScrollSpy
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return ScrollSpy.jQueryInterface
}
}
}
})
export default ScrollSpy

25
js/src/tab.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getElementFromSelector,
@ -235,23 +236,25 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
data.show()
})
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .tab to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Tab.jQueryInterface
$.fn[NAME].Constructor = Tab
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Tab.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Tab.jQueryInterface
$.fn[NAME].Constructor = Tab
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Tab.jQueryInterface
}
}
}
})
export default Tab

25
js/src/toast.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
getTransitionDurationFromElement,
@ -213,23 +214,25 @@ class Toast {
}
}
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .toast to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Toast.jQueryInterface
$.fn[NAME].Constructor = Toast
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Toast.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Toast.jQueryInterface
$.fn[NAME].Constructor = Toast
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Toast.jQueryInterface
}
}
}
})
export default Toast

25
js/src/tooltip.js
View File

@ -7,6 +7,7 @@
import {
getjQuery,
onDOMContentLoaded,
TRANSITION_END,
emulateTransitionEnd,
findShadowRoot,
@ -793,23 +794,25 @@ class Tooltip {
}
}
const $ = getjQuery()
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .tooltip to jQuery only if jQuery is present
*/
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Tooltip.jQueryInterface
$.fn[NAME].Constructor = Tooltip
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Tooltip.jQueryInterface
onDOMContentLoaded(() => {
const $ = getjQuery()
/* istanbul ignore if */
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME]
$.fn[NAME] = Tooltip.jQueryInterface
$.fn[NAME].Constructor = Tooltip
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT
return Tooltip.jQueryInterface
}
}
}
})
export default Tooltip

13
js/src/util/index.js
View File

@ -180,8 +180,15 @@ const getjQuery = () => {
return null
}
const onDOMContentLoaded = callback => {
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', callback)
} else {
callback()
}
}
export {
getjQuery,
TRANSITION_END,
getUID,
getSelectorFromElement,
@ -194,5 +201,7 @@ export {
isVisible,
findShadowRoot,
noop,
reflow
reflow,
getjQuery,
onDOMContentLoaded
}

19
js/tests/unit/util/index.spec.js
View File

@ -394,4 +394,23 @@ describe('Util', () => {
expect(Util.getjQuery()).toEqual(null)
})
})
describe('onDOMContentLoaded', () => {
it('should execute callback when DOMContentLoaded is fired', () => {
const spy = jasmine.createSpy()
spyOnProperty(document, 'readyState').and.returnValue('loading')
Util.onDOMContentLoaded(spy)
window.document.dispatchEvent(new Event('DOMContentLoaded', {
bubbles: true,
cancelable: true
}))
expect(spy).toHaveBeenCalled()
})
it('should execute callback if readyState is not "loading"', () => {
const spy = jasmine.createSpy()
Util.onDOMContentLoaded(spy)
expect(spy).toHaveBeenCalled()
})
})
})