mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Popups
synced 2024-11-11 16:58:14 +00:00
Restrict page previews to browsers that support multiple not selectors
Change-Id: Ia45c03d1fd6949bf83ebed6d40075e453e42cdd7
This commit is contained in:
parent
d4376bf203
commit
8f03303dc4
BIN
resources/dist/index.js
vendored
BIN
resources/dist/index.js
vendored
Binary file not shown.
BIN
resources/dist/index.js.map.json
vendored
BIN
resources/dist/index.js.map.json
vendored
Binary file not shown.
|
@ -1,7 +1,14 @@
|
|||
var types = require( './types.json' );
|
||||
// Load Popups when touch events are not available in the browser (e.g. not a mobile device).
|
||||
var isTouchDevice = 'ontouchstart' in document.documentElement;
|
||||
if ( !isTouchDevice ) {
|
||||
var supportNotQueries;
|
||||
try {
|
||||
supportNotQueries = document.body.matches( 'div:not(.foo,.bar)' );
|
||||
supportNotQueries = true;
|
||||
} catch ( e ) {
|
||||
supportNotQueries = false;
|
||||
}
|
||||
if ( !isTouchDevice && supportNotQueries ) {
|
||||
mw.loader.using( types.concat( [ 'ext.popups.main' ] ) ).then( function () {
|
||||
// Load custom popup types
|
||||
types.forEach( function ( moduleName ) {
|
||||
|
|
|
@ -111,38 +111,9 @@ export function createNullModel( title, url ) {
|
|||
* @return {boolean}
|
||||
*/
|
||||
const elementMatchesSelector = ( element, selector ) => {
|
||||
try {
|
||||
return element.matches( selector );
|
||||
} catch ( e ) {
|
||||
// The native element.matches method will fail if:
|
||||
// 1) The method hasn't been implemented in the current browser
|
||||
// 2) The method doesn't suppport :not with multiple arguments
|
||||
// (https://caniuse.com/css-not-sel-list)
|
||||
// The try / catch block can be removed if and when Popups is restricted
|
||||
// to ES6 browsers.
|
||||
return $( element ).is( selector );
|
||||
}
|
||||
return element.matches( selector );
|
||||
};
|
||||
|
||||
/**
|
||||
* Emulates closest method for browsers that do not
|
||||
* support it. e.g. IE11.
|
||||
*
|
||||
* @param {Element} element
|
||||
* @param {string} selector
|
||||
* @return {Element|null}
|
||||
*/
|
||||
function legacyClosest( element, selector ) {
|
||||
const parentNode = element.parentNode;
|
||||
if ( elementMatchesSelector( element, selector ) ) {
|
||||
return element;
|
||||
} else if ( !parentNode || parentNode === document.body ) {
|
||||
// The `body` cannot be used as a preview selector.
|
||||
return null;
|
||||
}
|
||||
return legacyClosest( parentNode, selector );
|
||||
}
|
||||
|
||||
/**
|
||||
* Recursively checks the element and its parents.
|
||||
* @param {Element} element
|
||||
|
@ -150,13 +121,7 @@ function legacyClosest( element, selector ) {
|
|||
*/
|
||||
export function findNearestEligibleTarget( element ) {
|
||||
const selector = selectors.join( ', ' );
|
||||
try {
|
||||
return element.closest( selector );
|
||||
} catch ( e ) {
|
||||
// The browser either doesn't support the selector we gave it or doesn't
|
||||
// have the closest method.
|
||||
return legacyClosest( element, selector );
|
||||
}
|
||||
return element.closest( selector );
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in a new issue