Compare commits

...
Sign in to create a new pull request.

1 commit

Author SHA1 Message Date
Johann-S
9f515888cd real private methods for alert 2019-08-04 12:32:54 +02:00
4 changed files with 82 additions and 69 deletions

View file

@ -5,16 +5,11 @@
* -------------------------------------------------------------------------- * --------------------------------------------------------------------------
*/ */
import { import { getjQuery } from '../util/index'
getjQuery, import { getRootElement, removeElement, triggerCloseEvent } from './private'
TRANSITION_END, import { DATA_KEY, Event } from './constants'
emulateTransitionEnd,
getElementFromSelector,
getTransitionDurationFromElement
} from '../util/index'
import Data from '../dom/data' import Data from '../dom/data'
import EventHandler from '../dom/event-handler' import EventHandler from '../dom/event-handler'
import SelectorEngine from '../dom/selector-engine'
/** /**
* ------------------------------------------------------------------------ * ------------------------------------------------------------------------
@ -24,26 +19,10 @@ import SelectorEngine from '../dom/selector-engine'
const NAME = 'alert' const NAME = 'alert'
const VERSION = '4.3.1' const VERSION = '4.3.1'
const DATA_KEY = 'bs.alert'
const EVENT_KEY = `.${DATA_KEY}`
const DATA_API_KEY = '.data-api'
const Selector = { const Selector = {
DISMISS: '[data-dismiss="alert"]' DISMISS: '[data-dismiss="alert"]'
} }
const Event = {
CLOSE: `close${EVENT_KEY}`,
CLOSED: `closed${EVENT_KEY}`,
CLICK_DATA_API: `click${EVENT_KEY}${DATA_API_KEY}`
}
const ClassName = {
ALERT: 'alert',
FADE: 'fade',
SHOW: 'show'
}
/** /**
* ------------------------------------------------------------------------ * ------------------------------------------------------------------------
* Class Definition * Class Definition
@ -70,16 +49,16 @@ class Alert {
close(element) { close(element) {
let rootElement = this._element let rootElement = this._element
if (element) { if (element) {
rootElement = this._getRootElement(element) rootElement = getRootElement(element)
} }
const customEvent = this._triggerCloseEvent(rootElement) const customEvent = triggerCloseEvent(rootElement)
if (customEvent === null || customEvent.defaultPrevented) { if (customEvent === null || customEvent.defaultPrevented) {
return return
} }
this._removeElement(rootElement) removeElement(rootElement)
} }
dispose() { dispose() {
@ -87,45 +66,6 @@ class Alert {
this._element = null this._element = null
} }
// Private
_getRootElement(element) {
let parent = getElementFromSelector(element)
if (!parent) {
parent = SelectorEngine.closest(element, `.${ClassName.ALERT}`)
}
return parent
}
_triggerCloseEvent(element) {
return EventHandler.trigger(element, Event.CLOSE)
}
_removeElement(element) {
element.classList.remove(ClassName.SHOW)
if (!element.classList.contains(ClassName.FADE)) {
this._destroyElement(element)
return
}
const transitionDuration = getTransitionDurationFromElement(element)
EventHandler
.one(element, TRANSITION_END, () => this._destroyElement(element))
emulateTransitionEnd(element, transitionDuration)
}
_destroyElement(element) {
if (element.parentNode) {
element.parentNode.removeChild(element)
}
EventHandler.trigger(element, Event.CLOSED)
}
// Static // Static
static jQueryInterface(config) { static jQueryInterface(config) {

View file

@ -90,13 +90,11 @@ describe('Alert', () => {
const endTest = () => { const endTest = () => {
setTimeout(() => { setTimeout(() => {
expect(alert._removeElement).not.toHaveBeenCalled() expect(fixtureEl.querySelector('.alert')).not.toBeNull()
done() done()
}, 10) }, 10)
} }
spyOn(alert, '_removeElement')
alertEl.addEventListener('close.bs.alert', event => { alertEl.addEventListener('close.bs.alert', event => {
event.preventDefault() event.preventDefault()
endTest() endTest()

22
js/src/alert/constants.js Normal file
View file

@ -0,0 +1,22 @@
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.3.1): alert constants
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
export const DATA_KEY = 'bs.alert'
const DATA_API_KEY = '.data-api'
const EVENT_KEY = `.${DATA_KEY}`
export const Event = {
CLOSE: `close${EVENT_KEY}`,
CLOSED: `closed${EVENT_KEY}`,
CLICK_DATA_API: `click${EVENT_KEY}${DATA_API_KEY}`
}
export const ClassName = {
ALERT: 'alert',
FADE: 'fade',
SHOW: 'show'
}

53
js/src/alert/private.js Normal file
View file

@ -0,0 +1,53 @@
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.3.1): private alert functions
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
import {
TRANSITION_END,
emulateTransitionEnd,
getElementFromSelector,
getTransitionDurationFromElement
} from '../util/index'
import EventHandler from '../dom/event-handler'
import SelectorEngine from '../dom/selector-engine'
import { ClassName, Event } from './constants'
export const getRootElement = element => {
let parent = getElementFromSelector(element)
if (!parent) {
parent = SelectorEngine.closest(element, `.${ClassName.ALERT}`)
}
return parent
}
export const triggerCloseEvent = element => {
return EventHandler.trigger(element, Event.CLOSE)
}
export const removeElement = element => {
element.classList.remove(ClassName.SHOW)
if (!element.classList.contains(ClassName.FADE)) {
destroyElement(element)
return
}
const transitionDuration = getTransitionDurationFromElement(element)
EventHandler
.one(element, TRANSITION_END, () => destroyElement(element))
emulateTransitionEnd(element, transitionDuration)
}
const destroyElement = element => {
if (element.parentNode) {
element.parentNode.removeChild(element)
}
EventHandler.trigger(element, Event.CLOSED)
}