Skip to content

Commit

Permalink
Pull request #68: AG-5626 fix scroll for safari
Browse files Browse the repository at this point in the history
Merge in EXTENSIONS/extended-css from fix/AG-5626 to master

Squashed commit of the following:

commit cd9cc5b474cacd14cbf3fbd497f4b745da3c9041
Author: Slava Leleka <v.leleka@adguard.com>
Date:   Wed Dec 9 13:16:25 2020 +0300

    replace logical AND by OR

commit cc710050c69e7d6809cec6d6cd9126994cfb7583
Author: Slava Leleka <v.leleka@adguard.com>
Date:   Wed Dec 9 01:56:22 2020 +0300

    comment the 'wheel' event, get mutations checking back

commit f984b901d6e29a56ddab0cc67235cb394c8693aa
Author: Slava Leleka <v.leleka@adguard.com>
Date:   Mon Dec 7 23:45:09 2020 +0300

    move isSafariBrowser to utils

commit a575d12e6ba42ce6a0216f4c7f755fef1b82ff88
Author: Slava Leleka <v.leleka@adguard.com>
Date:   Mon Dec 7 20:06:08 2020 +0300

    fix scroll for safari
  • Loading branch information
slavaleleka committed Dec 9, 2020
1 parent f57bf50 commit cdfe05b
Show file tree
Hide file tree
Showing 8 changed files with 112 additions and 26 deletions.
34 changes: 28 additions & 6 deletions dist/extended-css.cjs.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! extended-css - v1.3.6 - Fri Nov 27 2020
/*! extended-css - v1.3.7 - Wed Dec 09 2020
* https://github.com/AdguardTeam/ExtendedCss
* Copyright (c) 2020 AdGuard. Licensed LGPL-3.0
*/
Expand Down Expand Up @@ -111,12 +111,29 @@ function _nonIterableRest() {
/* eslint-disable no-console */
var utils = {};
utils.MutationObserver = window.MutationObserver || window.WebKitMutationObserver;

utils.isSafariBrowser = function () {
var isChrome = navigator.userAgent.indexOf('Chrome') > -1;
var isSafari = navigator.userAgent.indexOf('Safari') > -1;

if (isSafari) {
if (isChrome) {
// Chrome seems to have both Chrome and Safari userAgents
return false;
}

return true;
}

return false;
}();
/**
* Converts regular expressions passed as pseudo class arguments into RegExp instances.
* Have to unescape doublequote " as well, because we escape them while enclosing such
* arguments with doublequotes, and sizzle does not automatically unescapes them.
*/


utils.pseudoArgToRegex = function (regexSrc, flag) {
flag = flag || 'i';
regexSrc = regexSrc.trim().replace(/\\(["\\])/g, '$1');
Expand Down Expand Up @@ -2974,7 +2991,6 @@ var initializeSizzle = function initializeSizzle() {
*/

var StylePropertyMatcher = function (window) {
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 && navigator.userAgent && !navigator.userAgent.match('CriOS');
var isPhantom = !!window._phantom;
var useFallback = isPhantom && !!window.getMatchedCSSRules;
/**
Expand Down Expand Up @@ -3024,7 +3040,7 @@ var StylePropertyMatcher = function (window) {
if (style) {
value = style.getPropertyValue(propertyName); // https://bugs.webkit.org/show_bug.cgi?id=93445

if (propertyName === 'opacity' && isSafari) {
if (propertyName === 'opacity' && utils.isSafariBrowser) {
value = (Math.round(parseFloat(value) * 100) / 100).toString();
}
}
Expand Down Expand Up @@ -4717,9 +4733,15 @@ function ExtendedCss(configuration) {
var EventTracker = function () {
var ignoredEventTypes = ['mouseover', 'mouseleave', 'mouseenter', 'mouseout'];
var LAST_EVENT_TIMEOUT_MS = 10;
var TRACKED_EVENTS = [// keyboard events
var EVENTS = [// keyboard events
'keydown', 'keypress', 'keyup', // mouse events
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel'];
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel']; // 'wheel' event makes scrolling in Safari twitchy
// https://github.com/AdguardTeam/ExtendedCss/issues/120

var safariProblematicEvents = ['wheel'];
var trackedEvents = utils.isSafariBrowser ? EVENTS.filter(function (el) {
return !(safariProblematicEvents.indexOf(el) > -1);
}) : EVENTS;
var lastEventType;
var lastEventTime;

Expand All @@ -4728,7 +4750,7 @@ function ExtendedCss(configuration) {
lastEventTime = Date.now();
};

TRACKED_EVENTS.forEach(function (evName) {
trackedEvents.forEach(function (evName) {
document.documentElement.addEventListener(evName, trackEvent, true);
});

Expand Down
34 changes: 28 additions & 6 deletions dist/extended-css.esm.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! extended-css - v1.3.6 - Fri Nov 27 2020
/*! extended-css - v1.3.7 - Wed Dec 09 2020
* https://github.com/AdguardTeam/ExtendedCss
* Copyright (c) 2020 AdGuard. Licensed LGPL-3.0
*/
Expand Down Expand Up @@ -109,12 +109,29 @@ function _nonIterableRest() {
/* eslint-disable no-console */
var utils = {};
utils.MutationObserver = window.MutationObserver || window.WebKitMutationObserver;

utils.isSafariBrowser = function () {
var isChrome = navigator.userAgent.indexOf('Chrome') > -1;
var isSafari = navigator.userAgent.indexOf('Safari') > -1;

if (isSafari) {
if (isChrome) {
// Chrome seems to have both Chrome and Safari userAgents
return false;
}

return true;
}

return false;
}();
/**
* Converts regular expressions passed as pseudo class arguments into RegExp instances.
* Have to unescape doublequote " as well, because we escape them while enclosing such
* arguments with doublequotes, and sizzle does not automatically unescapes them.
*/


utils.pseudoArgToRegex = function (regexSrc, flag) {
flag = flag || 'i';
regexSrc = regexSrc.trim().replace(/\\(["\\])/g, '$1');
Expand Down Expand Up @@ -2972,7 +2989,6 @@ var initializeSizzle = function initializeSizzle() {
*/

var StylePropertyMatcher = function (window) {
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 && navigator.userAgent && !navigator.userAgent.match('CriOS');
var isPhantom = !!window._phantom;
var useFallback = isPhantom && !!window.getMatchedCSSRules;
/**
Expand Down Expand Up @@ -3022,7 +3038,7 @@ var StylePropertyMatcher = function (window) {
if (style) {
value = style.getPropertyValue(propertyName); // https://bugs.webkit.org/show_bug.cgi?id=93445

if (propertyName === 'opacity' && isSafari) {
if (propertyName === 'opacity' && utils.isSafariBrowser) {
value = (Math.round(parseFloat(value) * 100) / 100).toString();
}
}
Expand Down Expand Up @@ -4715,9 +4731,15 @@ function ExtendedCss(configuration) {
var EventTracker = function () {
var ignoredEventTypes = ['mouseover', 'mouseleave', 'mouseenter', 'mouseout'];
var LAST_EVENT_TIMEOUT_MS = 10;
var TRACKED_EVENTS = [// keyboard events
var EVENTS = [// keyboard events
'keydown', 'keypress', 'keyup', // mouse events
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel'];
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel']; // 'wheel' event makes scrolling in Safari twitchy
// https://github.com/AdguardTeam/ExtendedCss/issues/120

var safariProblematicEvents = ['wheel'];
var trackedEvents = utils.isSafariBrowser ? EVENTS.filter(function (el) {
return !(safariProblematicEvents.indexOf(el) > -1);
}) : EVENTS;
var lastEventType;
var lastEventTime;

Expand All @@ -4726,7 +4748,7 @@ function ExtendedCss(configuration) {
lastEventTime = Date.now();
};

TRACKED_EVENTS.forEach(function (evName) {
trackedEvents.forEach(function (evName) {
document.documentElement.addEventListener(evName, trackEvent, true);
});

Expand Down
34 changes: 28 additions & 6 deletions dist/extended-css.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/*! extended-css - v1.3.6 - Fri Nov 27 2020
/*! extended-css - v1.3.7 - Wed Dec 09 2020
* https://github.com/AdguardTeam/ExtendedCss
* Copyright (c) 2020 AdGuard. Licensed LGPL-3.0
*/
Expand Down Expand Up @@ -112,12 +112,29 @@ var ExtendedCss = (function () {
/* eslint-disable no-console */
var utils = {};
utils.MutationObserver = window.MutationObserver || window.WebKitMutationObserver;

utils.isSafariBrowser = function () {
var isChrome = navigator.userAgent.indexOf('Chrome') > -1;
var isSafari = navigator.userAgent.indexOf('Safari') > -1;

if (isSafari) {
if (isChrome) {
// Chrome seems to have both Chrome and Safari userAgents
return false;
}

return true;
}

return false;
}();
/**
* Converts regular expressions passed as pseudo class arguments into RegExp instances.
* Have to unescape doublequote " as well, because we escape them while enclosing such
* arguments with doublequotes, and sizzle does not automatically unescapes them.
*/


utils.pseudoArgToRegex = function (regexSrc, flag) {
flag = flag || 'i';
regexSrc = regexSrc.trim().replace(/\\(["\\])/g, '$1');
Expand Down Expand Up @@ -2975,7 +2992,6 @@ var ExtendedCss = (function () {
*/

var StylePropertyMatcher = function (window) {
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 && navigator.userAgent && !navigator.userAgent.match('CriOS');
var isPhantom = !!window._phantom;
var useFallback = isPhantom && !!window.getMatchedCSSRules;
/**
Expand Down Expand Up @@ -3025,7 +3041,7 @@ var ExtendedCss = (function () {
if (style) {
value = style.getPropertyValue(propertyName); // https://bugs.webkit.org/show_bug.cgi?id=93445

if (propertyName === 'opacity' && isSafari) {
if (propertyName === 'opacity' && utils.isSafariBrowser) {
value = (Math.round(parseFloat(value) * 100) / 100).toString();
}
}
Expand Down Expand Up @@ -4718,9 +4734,15 @@ var ExtendedCss = (function () {
var EventTracker = function () {
var ignoredEventTypes = ['mouseover', 'mouseleave', 'mouseenter', 'mouseout'];
var LAST_EVENT_TIMEOUT_MS = 10;
var TRACKED_EVENTS = [// keyboard events
var EVENTS = [// keyboard events
'keydown', 'keypress', 'keyup', // mouse events
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel'];
'auxclick', 'click', 'contextmenu', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseover', 'mouseout', 'mouseup', 'pointerlockchange', 'pointerlockerror', 'select', 'wheel']; // 'wheel' event makes scrolling in Safari twitchy
// https://github.com/AdguardTeam/ExtendedCss/issues/120

var safariProblematicEvents = ['wheel'];
var trackedEvents = utils.isSafariBrowser ? EVENTS.filter(function (el) {
return !(safariProblematicEvents.indexOf(el) > -1);
}) : EVENTS;
var lastEventType;
var lastEventTime;

Expand All @@ -4729,7 +4751,7 @@ var ExtendedCss = (function () {
lastEventTime = Date.now();
};

TRACKED_EVENTS.forEach(function (evName) {
trackedEvents.forEach(function (evName) {
document.documentElement.addEventListener(evName, trackEvent, true);
});

Expand Down
4 changes: 2 additions & 2 deletions dist/extended-css.min.js

Large diffs are not rendered by default.

12 changes: 10 additions & 2 deletions lib/extended-css.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ function ExtendedCss(configuration) {
const ignoredEventTypes = ['mouseover', 'mouseleave', 'mouseenter', 'mouseout'];
const LAST_EVENT_TIMEOUT_MS = 10;

const TRACKED_EVENTS = [
const EVENTS = [
// keyboard events
'keydown', 'keypress', 'keyup',
// mouse events
Expand All @@ -63,6 +63,14 @@ function ExtendedCss(configuration) {
'pointerlockerror', 'select', 'wheel',
];

// 'wheel' event makes scrolling in Safari twitchy
// https://github.com/AdguardTeam/ExtendedCss/issues/120
const safariProblematicEvents = ['wheel'];

const trackedEvents = utils.isSafariBrowser
? EVENTS.filter((el) => !(safariProblematicEvents.indexOf(el) > -1))
: EVENTS;

let lastEventType;
let lastEventTime;

Expand All @@ -71,7 +79,7 @@ function ExtendedCss(configuration) {
lastEventTime = Date.now();
};

TRACKED_EVENTS.forEach((evName) => {
trackedEvents.forEach((evName) => {
document.documentElement.addEventListener(evName, trackEvent, true);
});

Expand Down
4 changes: 1 addition & 3 deletions lib/style-property-matcher.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,6 @@ import utils from './utils';
* Class that extends Sizzle and adds support for "matches-css" pseudo element.
*/
const StylePropertyMatcher = (function (window) {
const isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1
&& navigator.userAgent && !navigator.userAgent.match('CriOS');
const isPhantom = !!window._phantom;
const useFallback = isPhantom && !!window.getMatchedCSSRules;

Expand Down Expand Up @@ -64,7 +62,7 @@ const StylePropertyMatcher = (function (window) {
if (style) {
value = style.getPropertyValue(propertyName);
// https://bugs.webkit.org/show_bug.cgi?id=93445
if (propertyName === 'opacity' && isSafari) {
if (propertyName === 'opacity' && utils.isSafariBrowser) {
value = (Math.round(parseFloat(value) * 100) / 100).toString();
}
}
Expand Down
14 changes: 14 additions & 0 deletions lib/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,20 @@
const utils = {};
utils.MutationObserver = window.MutationObserver || window.WebKitMutationObserver;

utils.isSafariBrowser = (function () {
const isChrome = navigator.userAgent.indexOf('Chrome') > -1;
const isSafari = navigator.userAgent.indexOf('Safari') > -1;

if (isSafari) {
if (isChrome) {
// Chrome seems to have both Chrome and Safari userAgents
return false;
}
return true;
}
return false;
})();

/**
* Converts regular expressions passed as pseudo class arguments into RegExp instances.
* Have to unescape doublequote " as well, because we escape them while enclosing such
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "extended-css",
"version": "1.3.6",
"version": "1.3.7",
"description": "Module for applying CSS styles with extended selection properties.",
"main": "dist/extended-css.cjs.js",
"module": "dist/extended-css.esm.js",
Expand Down

1 comment on commit cdfe05b

@slavaleleka
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.