Compare commits

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

3 commits

Author SHA1 Message Date
Rohit Sharma
88783b3f82 Change isTouchEnabledDevice to a function
So that the presence of `ontouchstart` method can be checked in the
runtime
2020-12-09 23:48:26 +05:30
XhmikosR
70bba97f6c WIP 2020-12-08 09:31:48 +02:00
XhmikosR
88286fef6e Move touch detection to util 2020-12-08 09:25:22 +02:00
4 changed files with 22 additions and 14 deletions

View file

@ -12,6 +12,7 @@ import {
getElementFromSelector,
getTransitionDurationFromElement,
isVisible,
isTouchEnabledDevice,
reflow,
triggerTransitionEnd,
typeCheckConfig
@ -118,7 +119,7 @@ class Carousel extends BaseComponent {
this._config = this._getConfig(config)
this._indicatorsElement = SelectorEngine.findOne(SELECTOR_INDICATORS, this._element)
this._touchSupported = 'ontouchstart' in document.documentElement || navigator.maxTouchPoints > 0
this._touchSupported = isTouchEnabledDevice() || navigator.maxTouchPoints > 0
this._pointerEvent = Boolean(window.PointerEvent)
this._addEventListeners()

View file

@ -13,6 +13,7 @@ import {
isElement,
isVisible,
isRTL,
isTouchEnabledDevice,
noop,
typeCheckConfig
} from './util/index'
@ -181,10 +182,10 @@ class Dropdown extends BaseComponent {
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement &&
!parent.closest(SELECTOR_NAVBAR_NAV)) {
[].concat(...document.body.children)
.forEach(elem => EventHandler.on(elem, 'mouseover', null, noop()))
if (isTouchEnabledDevice() && !parent.closest(SELECTOR_NAVBAR_NAV)) {
[].concat(...document.body.children).forEach(element => {
EventHandler.on(element, 'mouseover', null, noop)
})
}
this._element.focus()
@ -381,9 +382,10 @@ class Dropdown extends BaseComponent {
// If this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
[].concat(...document.body.children)
.forEach(elem => EventHandler.off(elem, 'mouseover', null, noop()))
if (isTouchEnabledDevice()) {
[].concat(...document.body.children).forEach(element => {
EventHandler.off(element, 'mouseover', null, noop)
})
}
toggles[i].setAttribute('aria-expanded', 'false')

View file

@ -16,6 +16,7 @@ import {
getUID,
isElement,
isRTL,
isTouchEnabledDevice,
noop,
typeCheckConfig
} from './util/index'
@ -298,9 +299,9 @@ class Tooltip extends BaseComponent {
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement) {
if (isTouchEnabledDevice()) {
[].concat(...document.body.children).forEach(element => {
EventHandler.on(element, 'mouseover', noop())
EventHandler.on(element, 'mouseover', noop)
})
}
@ -355,9 +356,10 @@ class Tooltip extends BaseComponent {
// If this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
[].concat(...document.body.children)
.forEach(element => EventHandler.off(element, 'mouseover', noop))
if (isTouchEnabledDevice()) {
[].concat(...document.body.children).forEach(element => {
EventHandler.off(element, 'mouseover', noop)
})
}
this._activeTrigger[TRIGGER_CLICK] = false

View file

@ -204,6 +204,8 @@ const defineJQueryPlugin = (name, plugin) => {
})
}
const isTouchEnabledDevice = () => 'ontouchstart' in document.documentElement
export {
TRANSITION_END,
getUID,
@ -221,5 +223,6 @@ export {
getjQuery,
onDOMContentLoaded,
isRTL,
defineJQueryPlugin
defineJQueryPlugin,
isTouchEnabledDevice
}