fix polyfills, add ie11 support

This commit is contained in:
Hakim El Hattab
2020-05-26 09:46:50 +02:00
parent b074050a6d
commit e6244a57b5
17 changed files with 129 additions and 142 deletions

View File

@ -1,4 +1,4 @@
import { queryAll, extend, createStyleSheet } from '../utils/util.js'
import { queryAll, extend, createStyleSheet, matchesSelector } from '../utils/util.js'
import { FRAGMENT_STYLE_REGEX } from '../utils/constants.js'
// Counter used to generate unique IDs for auto-animated elements
@ -463,11 +463,11 @@ export default class AutoAnimate {
// Disable scale transformations on text nodes, we transiition
// each individual text property instead
if( pair.from.matches( textNodes ) ) {
if( matchesSelector( pair.from, textNodes ) ) {
pair.options = { scale: false };
}
// Animate individual lines of code
else if( pair.from.matches( codeNodes ) ) {
else if( matchesSelector( pair.from, codeNodes ) ) {
// Transition the code block's width and height instead of scaling
// to prevent its content from being squished

View File

@ -1489,7 +1489,10 @@ export default function( revealElement, options ) {
let reverse = config.rtl && !isVerticalSlide( element );
element.classList.remove( 'past', 'present', 'future' );
// Avoid .remove() with multiple args for IE11 support
element.classList.remove( 'past' );
element.classList.remove( 'present' );
element.classList.remove( 'future' );
// http://www.w3.org/html/wg/drafts/html/master/editing.html#the-hidden-attribute
element.setAttribute( 'hidden', '' );

View File

@ -85,6 +85,27 @@ export const transformElement = ( element, transform ) => {
}
/**
* Element.matches with IE support.
*
* @param {HTMLElement} target The element to match
* @param {String} selector The CSS selector to match
* the element against
*
* @return {Boolean}
*/
export const matchesSelector = ( target, selector ) => {
// There's some overhead doing this each time, we don't
// want to rewrite the element prototype but should still
// be enough to feature detect once at startup...
let matchesMethod = parent.matches || parent.matchesSelector || parent.msMatchesSelector;
// If we find a match, we're all set
return !!( matchesMethod && matchesMethod.call( target, selector ) );
}
/**
* Find the closest parent that matches the given
* selector.
@ -102,13 +123,8 @@ export const closestParent = ( target, selector ) => {
while( parent ) {
// There's some overhead doing this each time, we don't
// want to rewrite the element prototype but should still
// be enough to feature detect once at startup...
let matchesMethod = parent.matches || parent.matchesSelector || parent.msMatchesSelector;
// If we find a match, we're all set
if( matchesMethod && matchesMethod.call( parent, selector ) ) {
if( matchesSelector( parent, selector ) ) {
return parent;
}