copy dari repo om Irfan
This commit is contained in:
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"presets": ["@babel/preset-env"]
|
||||
}
|
||||
@@ -0,0 +1,37 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules
|
||||
jspm_packages
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
@@ -0,0 +1,7 @@
|
||||
language: node_js
|
||||
node_js:
|
||||
- '10'
|
||||
cache: yarn
|
||||
script:
|
||||
- yarn
|
||||
- yarn test-ci
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2016 Hector Zarco
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
+118
@@ -0,0 +1,118 @@
|
||||
# `default-passive-events` [](https://travis-ci.org/zzarcon/default-passive-events) [](https://david-dm.org/zzarcon/default-passive-events) [](https://bundlephobia.com/result?p=default-passive-events)
|
||||
|
||||
> Makes {passive: true} by default when EventListenerOptions are supported
|
||||
|
||||
50 lines snippet that enables [passive event listeners](https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md) by default for some events ([see list below](#targeted-events)). It basically will set **{ passive: true }** automatically every time you declare a new [event listener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener).
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
yarn add default-passive-events
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
Simply require the package:
|
||||
|
||||
```javascript
|
||||
require('default-passive-events');
|
||||
```
|
||||
|
||||
or include it locally:
|
||||
|
||||
```html
|
||||
<script type="text/javascript" src="node_modules/default-passive-events/dist/index.js"></script>
|
||||
```
|
||||
|
||||
or from [unpkg](https://unpkg.com/#/) [CDN](https://en.wikipedia.org/wiki/Content_delivery_network):
|
||||
|
||||
```html
|
||||
<script type="text/javascript" src="https://unpkg.com/default-passive-events"></script>
|
||||
```
|
||||
|
||||
## Bundle formats
|
||||
|
||||
This package is distributed as multiple, different types of output bundles. The most often your bundler will properly choose the correct version by itself.
|
||||
|
||||
To get more information about supported bundle formats have a look at [official `microbundle` documentation](https://github.com/developit/microbundle#-output-formats-). Especially interesting is the `modern` format which - if used properly with your bundle system - might produce significantly smaller output code.
|
||||
|
||||
## Examples
|
||||
|
||||
Those are some examples and their output:
|
||||
|
||||
```javascript
|
||||
document.addEventListener('mouseup', onMouseUp); // {passive: true, capture: false}
|
||||
document.addEventListener('mouseup', onMouseUp, true); // {passive: true, capture: true}
|
||||
document.addEventListener('mouseup', onMouseUp, false); // {passive: true, capture: false}
|
||||
document.addEventListener('mouseup', onMouseUp, {passive: false}); // {passive: false, capture: false}
|
||||
document.addEventListener('mouseup', onMouseUp, {passive: false, capture: false}); // {passive: false, capture: false}
|
||||
document.addEventListener('mouseup', onMouseUp, {passive: false, capture: true}); // {passive: false, capture: true}
|
||||
document.addEventListener('mouseup', onMouseUp, {passive: true, capture: false}); // {passive: true, capture: false}
|
||||
document.addEventListener('mouseup', onMouseUp, {passive: true, capture: true}); // {passive: true, capture: true}
|
||||
```
|
||||
|
||||
## Demo
|
||||
|
||||
Check the [demo page](https://zzarcon.github.io/default-passive-events) for a working example.
|
||||
|
||||
## Motivation
|
||||
|
||||
Just to take benefit in your apps without having to edit every single event listener you already have.
|
||||
|
||||
## Targeted events
|
||||
|
||||
Default-passive-events package makes following event listeners passive by default:
|
||||
|
||||
* scroll
|
||||
* wheel
|
||||
* touchstart
|
||||
* touchmove
|
||||
* touchenter
|
||||
* touchend
|
||||
* touchleave
|
||||
* mouseout
|
||||
* mouseleave
|
||||
* mouseup
|
||||
* mousedown
|
||||
* mousemove
|
||||
* mouseenter
|
||||
* mousewheel
|
||||
* mouseover
|
||||
|
||||
## Q&A
|
||||
|
||||
### Browser rises weird error when I try to preventDefault event inside of a passive listener.
|
||||
|
||||
Well, that's true, partly. First of all specification says that you shouldn't ever try to preventDefault from the context of passive listener. But if that's not a possibility you should know that in the console you see only *error-looking log messages*, which are *not actual errors* (ergo: they *do not break your code*).
|
||||
|
||||
### Is there a possibility to hide these messages?
|
||||
|
||||
Unfortunately, no. Since they are not actual errors there is no way to catch them and (more importantly) there is no way to distinguish whether you're inside of the passive listener context to know when not to call/override preventDefault method. Now, we look at the regarding issue in WHATWG repo whatwg/dom#587.
|
||||
|
||||
### Is there a possibility to bring default addEventListener method back for chosen elements/globally (e.g. for time of running some of the code)?
|
||||
|
||||
Yes, original addEventListener is available under `_original` property of our's addEventListener's implementation (so - `element.addEventListener._original`). Having that in mind, you can bring it back for however you want, e.g.:
|
||||
|
||||
```javascript
|
||||
element.addEventListener = element.addEventListener._original;
|
||||
```
|
||||
|
||||
## Resources
|
||||
|
||||
* About passive event listeners https://medium.com/@devlucky/about-passive-event-listeners-224ff620e68c
|
||||
* EventListenerOptions https://github.com/WICG/EventListenerOptions
|
||||
* Explanation https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md
|
||||
* Polyfill https://github.com/WICG/EventListenerOptions/blob/gh-pages/EventListenerOptions.polyfill.js
|
||||
* Spec https://dom.spec.whatwg.org/#dictdef-eventlisteneroptions
|
||||
* Chrome feature https://www.chromestatus.com/features#passive
|
||||
* About scrolling performance https://plus.google.com/+RickByers/posts/cmzrtyBYPQc
|
||||
* Nice Chrome blog article https://blog.chromium.org/2016/05/new-apis-to-help-developers-improve.html
|
||||
|
||||
## Author
|
||||
|
||||
[@zzarcon](https://github.com/zzarcon)
|
||||
|
||||
## Maintainers
|
||||
|
||||
[@zzarcon](https://github.com/zzarcon)
|
||||
[@frsgit](https://github.com/frsgit)
|
||||
@@ -0,0 +1,104 @@
|
||||
const throwPreventDefault = () => { throw 'Unable to preventDefault inside passive event listener invocation.' };
|
||||
const handler = {
|
||||
simple : () => {}
|
||||
};
|
||||
const spy = {
|
||||
addEventListener : jest.spyOn(EventTarget.prototype, 'addEventListener')
|
||||
};
|
||||
const init = {
|
||||
addEventListener : EventTarget.prototype.addEventListener
|
||||
};
|
||||
|
||||
describe('passive events are supported', () => {
|
||||
beforeEach(() => {
|
||||
jest.doMock('../src/utils', () => ({
|
||||
eventListenerOptionsSupported: () => true
|
||||
}));
|
||||
require('../src');
|
||||
});
|
||||
|
||||
it('should use passive=true when no options are passed and is a valid passive event name', () => {
|
||||
document.addEventListener('mouseup', handler.simple);
|
||||
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple, {
|
||||
passive: true,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should merge useCapture=false with passive=true', () => {
|
||||
document.body.addEventListener('mouseup', handler.simple, false);
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple, {
|
||||
passive: true,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should work when passed {capture: false}', () => {
|
||||
document.addEventListener('mouseup', handler.simple, {capture: false});
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple, {
|
||||
passive: true,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should leave passed {passive: false}', () => {
|
||||
document.addEventListener('mouseup', handler.simple, {passive: false});
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple, {
|
||||
passive: false,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should leave passed {passive: true} and event name is unsupported', () => {
|
||||
document.addEventListener('click', handler.simple, {passive: true});
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('click', handler.simple, {
|
||||
passive: true,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should use passive=false when event name is an unsupported passive event', () => {
|
||||
document.addEventListener('click', handler.simple);
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('click', handler.simple, {
|
||||
passive: false,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should work when passing options object with getter-only passive property', () => {
|
||||
var optionsWithPassiveGetter = {
|
||||
get passive () {
|
||||
return true;
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener('mouseup', handler.simple, optionsWithPassiveGetter);
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple, {
|
||||
passive: true,
|
||||
capture: false
|
||||
});
|
||||
});
|
||||
|
||||
it('should original implementation be visible under addEventListener._original property', () => {
|
||||
expect(spy.addEventListener).toEqual(init.addEventListener);
|
||||
});
|
||||
});
|
||||
|
||||
describe('passive events are not supported', () => {
|
||||
beforeEach(() => {
|
||||
jest.resetModules();
|
||||
EventTarget.prototype.addEventListener = init.addEventListener;
|
||||
|
||||
jest.doMock('../src/utils', () => ({
|
||||
eventListenerOptionsSupported: () => false
|
||||
}));
|
||||
require('../src');
|
||||
});
|
||||
|
||||
it('should use pass event handler arguments down', () => {
|
||||
document.addEventListener('mouseup', handler.simple);
|
||||
|
||||
expect(spy.addEventListener).toHaveBeenCalledWith('mouseup', handler.simple);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,22 @@
|
||||
import { eventListenerOptionsSupported } from '../src/utils';
|
||||
const spy = {
|
||||
addEventListener : jest.spyOn(window, 'addEventListener')
|
||||
};
|
||||
|
||||
describe('eventListenerOptionsSupported test', () => {
|
||||
it('should return true when passive event property is supported', () => {
|
||||
spy.addEventListener.mockImplementationOnce(
|
||||
(type, listener, options) => { options.passive; }
|
||||
);
|
||||
|
||||
expect(eventListenerOptionsSupported()).toBe(true);
|
||||
});
|
||||
|
||||
it('should return false when passive event property is NOT supported', () => {
|
||||
spy.addEventListener.mockImplementationOnce(
|
||||
(type, listener, options) => { throw ''; }
|
||||
);
|
||||
|
||||
expect(eventListenerOptionsSupported()).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,2 @@
|
||||
var e,t=["scroll","wheel","touchstart","touchmove","touchenter","touchend","touchleave","mouseout","mouseleave","mouseup","mousedown","mousemove","mouseenter","mousewheel","mouseover"];if(function(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});window.addEventListener("test",null,t),window.removeEventListener("test",null,t)}catch(e){}return e}()){var o=EventTarget.prototype.addEventListener;e=o,EventTarget.prototype.addEventListener=function(o,r,n){var s,a="object"==typeof n&&null!==n,i=a?n.capture:n;(n=a?function(e){var t=Object.getOwnPropertyDescriptor(e,"passive");return t&&!0!==t.writable&&void 0===t.set?Object.assign({},e):e}(n):{}).passive=void 0!==(s=n.passive)?s:-1!==t.indexOf(o)&&!0,n.capture=void 0!==i&&i,e.call(this,o,r,n)},EventTarget.prototype.addEventListener._original=e}
|
||||
//# sourceMappingURL=index.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","sources":["../src/index.js","../src/utils.js"],"sourcesContent":["import { eventListenerOptionsSupported } from './utils';\n\nconst defaultOptions = {\n passive: true,\n capture: false\n};\nconst supportedPassiveTypes = [\n 'scroll', 'wheel',\n 'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',\n 'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'\n];\nconst getDefaultPassiveOption = (passive, eventName) => {\n if (passive !== undefined) return passive;\n\n return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive;\n};\n\nconst getWritableOptions = (options) => {\n const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive');\n \n return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined\n ? Object.assign({}, options)\n : options;\n};\n\nconst overwriteAddEvent = (superMethod) => {\n EventTarget.prototype.addEventListener = function (type, listener, options) {\n const usesListenerOptions = typeof options === 'object' && options !== null;\n const useCapture = usesListenerOptions ? options.capture : options;\n\n options = usesListenerOptions ? getWritableOptions(options) : {};\n options.passive = getDefaultPassiveOption(options.passive, type);\n options.capture = useCapture === undefined ? defaultOptions.capture : useCapture;\n\n superMethod.call(this, type, listener, options);\n };\n\n EventTarget.prototype.addEventListener._original = superMethod;\n};\n\nconst supportsPassive = eventListenerOptionsSupported();\n\nif (supportsPassive) {\n const addEvent = EventTarget.prototype.addEventListener;\n overwriteAddEvent(addEvent);\n}\n","export const eventListenerOptionsSupported = () => {\n let supported = false;\n\n try {\n const opts = Object.defineProperty({}, 'passive', {\n get() {\n supported = true;\n }\n });\n\n window.addEventListener('test', null, opts);\n window.removeEventListener('test', null, opts);\n } catch (e) {}\n\n return supported;\n}\n"],"names":["superMethod","supportedPassiveTypes","supported","opts","Object","defineProperty","get","window","addEventListener","removeEventListener","e","eventListenerOptionsSupported","addEvent","EventTarget","prototype","type","listener","options","passive","usesListenerOptions","useCapture","capture","passiveDescriptor","getOwnPropertyDescriptor","writable","undefined","set","assign","getWritableOptions","indexOf","call","this","_original"],"mappings":"IAyB2BA,EAnBrBC,EAAwB,CAC5B,SAAU,QACV,aAAc,YAAa,aAAc,WAAY,aACrD,WAAY,aAAc,UAAW,YAAa,YAAa,aAAc,aAAc,aAiC7F,GC1C6C,WAC3C,IAAIC,GAAY,EAEhB,IACE,IAAMC,EAAOC,OAAOC,eAAe,GAAI,UAAW,CAChDC,eACEJ,GAAY,KAIhBK,OAAOC,iBAAiB,OAAQ,KAAML,GACtCI,OAAOE,oBAAoB,OAAQ,KAAMN,GACzC,MAAOO,IAET,OAAOR,ED0BeS,GAEH,CACnB,IAAMC,EAAWC,YAAYC,UAAUN,iBAlBdR,EAmBPY,EAlBlBC,YAAYC,UAAUN,iBAAmB,SAAUO,EAAMC,EAAUC,GACjE,IAhB6BC,EAgBvBC,EAAyC,iBAAZF,GAAoC,OAAZA,EACrDG,EAAsBD,EAAsBF,EAAQI,QAAUJ,GAEpEA,EAAkBE,EAbK,SAACF,GAC1B,IAAMK,EAAoBlB,OAAOmB,yBAAyBN,EAAS,WAEnE,OAAOK,IAAoD,IAA/BA,EAAkBE,eAA+CC,IAA1BH,EAAkBI,IACjFtB,OAAOuB,OAAO,GAAIV,GAClBA,EAQsCW,CAAmBX,GAAW,IAC9DC,aAnBMO,KADeP,EAoBaD,EAAQC,SAnBlBA,GAEmB,IAA9CjB,EAAsB4B,QAiBgCd,KA5BpD,EA6BPE,EAAQI,aAAyBI,IAAfL,GAAoDA,EAEtEpB,EAAY8B,KAAKC,KAAMhB,EAAMC,EAAUC,IAGzCJ,YAAYC,UAAUN,iBAAiBwB,UAAYhC"}
|
||||
@@ -0,0 +1,2 @@
|
||||
const e=["scroll","wheel","touchstart","touchmove","touchenter","touchend","touchleave","mouseout","mouseleave","mouseup","mousedown","mousemove","mouseenter","mousewheel","mouseover"];var t;(()=>{let e=!1;try{const t=Object.defineProperty({},"passive",{get(){e=!0}});window.addEventListener("test",null,t),window.removeEventListener("test",null,t)}catch(e){}return e})()&&(t=EventTarget.prototype.addEventListener,EventTarget.prototype.addEventListener=function(o,n,r){const s="object"==typeof r&&null!==r,a=s?r.capture:r;var i;(r=s?(e=>{const t=Object.getOwnPropertyDescriptor(e,"passive");return t&&!0!==t.writable&&void 0===t.set?Object.assign({},e):e})(r):{}).passive=void 0!==(i=r.passive)?i:-1!==e.indexOf(o)&&!0,r.capture=void 0!==a&&a,t.call(this,o,n,r)},EventTarget.prototype.addEventListener._original=t);
|
||||
//# sourceMappingURL=index.modern.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.modern.js","sources":["../src/index.js","../src/utils.js"],"sourcesContent":["import { eventListenerOptionsSupported } from './utils';\n\nconst defaultOptions = {\n passive: true,\n capture: false\n};\nconst supportedPassiveTypes = [\n 'scroll', 'wheel',\n 'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',\n 'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'\n];\nconst getDefaultPassiveOption = (passive, eventName) => {\n if (passive !== undefined) return passive;\n\n return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive;\n};\n\nconst getWritableOptions = (options) => {\n const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive');\n \n return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined\n ? Object.assign({}, options)\n : options;\n};\n\nconst overwriteAddEvent = (superMethod) => {\n EventTarget.prototype.addEventListener = function (type, listener, options) {\n const usesListenerOptions = typeof options === 'object' && options !== null;\n const useCapture = usesListenerOptions ? options.capture : options;\n\n options = usesListenerOptions ? getWritableOptions(options) : {};\n options.passive = getDefaultPassiveOption(options.passive, type);\n options.capture = useCapture === undefined ? defaultOptions.capture : useCapture;\n\n superMethod.call(this, type, listener, options);\n };\n\n EventTarget.prototype.addEventListener._original = superMethod;\n};\n\nconst supportsPassive = eventListenerOptionsSupported();\n\nif (supportsPassive) {\n const addEvent = EventTarget.prototype.addEventListener;\n overwriteAddEvent(addEvent);\n}\n","export const eventListenerOptionsSupported = () => {\n let supported = false;\n\n try {\n const opts = Object.defineProperty({}, 'passive', {\n get() {\n supported = true;\n }\n });\n\n window.addEventListener('test', null, opts);\n window.removeEventListener('test', null, opts);\n } catch (e) {}\n\n return supported;\n}\n"],"names":["supportedPassiveTypes","superMethod","supported","opts","Object","defineProperty","get","window","addEventListener","removeEventListener","e","eventListenerOptionsSupported","EventTarget","prototype","type","listener","options","usesListenerOptions","useCapture","capture","passive","passiveDescriptor","getOwnPropertyDescriptor","writable","undefined","set","assign","getWritableOptions","indexOf","call","this","_original"],"mappings":"MAMMA,EAAwB,CAC5B,SAAU,QACV,aAAc,YAAa,aAAc,WAAY,aACrD,WAAY,aAAc,UAAW,YAAa,YAAa,aAAc,aAAc,aAgBlEC,IAAAA,ECzBkB,MAC3C,IAAIC,GAAY,EAEhB,IACE,MAAMC,EAAOC,OAAOC,eAAe,GAAI,UAAW,CAChDC,MACEJ,GAAY,KAIhBK,OAAOC,iBAAiB,OAAQ,KAAML,GACtCI,OAAOE,oBAAoB,OAAQ,KAAMN,GACzC,MAAOO,IAET,OAAOR,GD0BeS,KAfGV,EAkBRW,YAAYC,UAAUL,iBAjBvCI,YAAYC,UAAUL,iBAAmB,SAAUM,EAAMC,EAAUC,GACjE,MAAMC,EAAyC,iBAAZD,GAAoC,OAAZA,EACrDE,EAAsBD,EAAsBD,EAAQG,QAAUH,EAjBxC,IAACI,GAmB7BJ,EAAkBC,EAbMD,CAAAA,IAC1B,MAAMK,EAAoBjB,OAAOkB,yBAAyBN,EAAS,WAEnE,OAAOK,IAAoD,IAA/BA,EAAkBE,eAA+CC,IAA1BH,EAAkBI,IACjFrB,OAAOsB,OAAO,GAAIV,GAClBA,GAQsCW,CAAmBX,GAAW,IAC9DI,aAnBMI,KADeJ,EAoBaJ,EAAQI,SAnBlBA,GAEmB,IAA9CpB,EAAsB4B,QAiBgCd,KA5BpD,EA6BPE,EAAQG,aAAyBK,IAAfN,GAAoDA,EAEtEjB,EAAY4B,KAAKC,KAAMhB,EAAMC,EAAUC,IAGzCJ,YAAYC,UAAUL,iBAAiBuB,UAAY9B"}
|
||||
@@ -0,0 +1,2 @@
|
||||
var e,t=["scroll","wheel","touchstart","touchmove","touchenter","touchend","touchleave","mouseout","mouseleave","mouseup","mousedown","mousemove","mouseenter","mousewheel","mouseover"];if(function(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});window.addEventListener("test",null,t),window.removeEventListener("test",null,t)}catch(e){}return e}()){var o=EventTarget.prototype.addEventListener;e=o,EventTarget.prototype.addEventListener=function(o,r,n){var s,a="object"==typeof n&&null!==n,i=a?n.capture:n;(n=a?function(e){var t=Object.getOwnPropertyDescriptor(e,"passive");return t&&!0!==t.writable&&void 0===t.set?Object.assign({},e):e}(n):{}).passive=void 0!==(s=n.passive)?s:-1!==t.indexOf(o)&&!0,n.capture=void 0!==i&&i,e.call(this,o,r,n)},EventTarget.prototype.addEventListener._original=e}
|
||||
//# sourceMappingURL=index.module.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.module.js","sources":["../src/index.js","../src/utils.js"],"sourcesContent":["import { eventListenerOptionsSupported } from './utils';\n\nconst defaultOptions = {\n passive: true,\n capture: false\n};\nconst supportedPassiveTypes = [\n 'scroll', 'wheel',\n 'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',\n 'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'\n];\nconst getDefaultPassiveOption = (passive, eventName) => {\n if (passive !== undefined) return passive;\n\n return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive;\n};\n\nconst getWritableOptions = (options) => {\n const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive');\n \n return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined\n ? Object.assign({}, options)\n : options;\n};\n\nconst overwriteAddEvent = (superMethod) => {\n EventTarget.prototype.addEventListener = function (type, listener, options) {\n const usesListenerOptions = typeof options === 'object' && options !== null;\n const useCapture = usesListenerOptions ? options.capture : options;\n\n options = usesListenerOptions ? getWritableOptions(options) : {};\n options.passive = getDefaultPassiveOption(options.passive, type);\n options.capture = useCapture === undefined ? defaultOptions.capture : useCapture;\n\n superMethod.call(this, type, listener, options);\n };\n\n EventTarget.prototype.addEventListener._original = superMethod;\n};\n\nconst supportsPassive = eventListenerOptionsSupported();\n\nif (supportsPassive) {\n const addEvent = EventTarget.prototype.addEventListener;\n overwriteAddEvent(addEvent);\n}\n","export const eventListenerOptionsSupported = () => {\n let supported = false;\n\n try {\n const opts = Object.defineProperty({}, 'passive', {\n get() {\n supported = true;\n }\n });\n\n window.addEventListener('test', null, opts);\n window.removeEventListener('test', null, opts);\n } catch (e) {}\n\n return supported;\n}\n"],"names":["superMethod","supportedPassiveTypes","supported","opts","Object","defineProperty","get","window","addEventListener","removeEventListener","e","eventListenerOptionsSupported","addEvent","EventTarget","prototype","type","listener","options","passive","usesListenerOptions","useCapture","capture","passiveDescriptor","getOwnPropertyDescriptor","writable","undefined","set","assign","getWritableOptions","indexOf","call","this","_original"],"mappings":"IAyB2BA,EAnBrBC,EAAwB,CAC5B,SAAU,QACV,aAAc,YAAa,aAAc,WAAY,aACrD,WAAY,aAAc,UAAW,YAAa,YAAa,aAAc,aAAc,aAiC7F,GC1C6C,WAC3C,IAAIC,GAAY,EAEhB,IACE,IAAMC,EAAOC,OAAOC,eAAe,GAAI,UAAW,CAChDC,eACEJ,GAAY,KAIhBK,OAAOC,iBAAiB,OAAQ,KAAML,GACtCI,OAAOE,oBAAoB,OAAQ,KAAMN,GACzC,MAAOO,IAET,OAAOR,ED0BeS,GAEH,CACnB,IAAMC,EAAWC,YAAYC,UAAUN,iBAlBdR,EAmBPY,EAlBlBC,YAAYC,UAAUN,iBAAmB,SAAUO,EAAMC,EAAUC,GACjE,IAhB6BC,EAgBvBC,EAAyC,iBAAZF,GAAoC,OAAZA,EACrDG,EAAsBD,EAAsBF,EAAQI,QAAUJ,GAEpEA,EAAkBE,EAbK,SAACF,GAC1B,IAAMK,EAAoBlB,OAAOmB,yBAAyBN,EAAS,WAEnE,OAAOK,IAAoD,IAA/BA,EAAkBE,eAA+CC,IAA1BH,EAAkBI,IACjFtB,OAAOuB,OAAO,GAAIV,GAClBA,EAQsCW,CAAmBX,GAAW,IAC9DC,aAnBMO,KADeP,EAoBaD,EAAQC,SAnBlBA,GAEmB,IAA9CjB,EAAsB4B,QAiBgCd,KA5BpD,EA6BPE,EAAQI,aAAyBI,IAAfL,GAAoDA,EAEtEpB,EAAY8B,KAAKC,KAAMhB,EAAMC,EAAUC,IAGzCJ,YAAYC,UAAUN,iBAAiBwB,UAAYhC"}
|
||||
@@ -0,0 +1,2 @@
|
||||
!function(e){"function"==typeof define&&define.amd?define(e):e()}(function(){var e,t=["scroll","wheel","touchstart","touchmove","touchenter","touchend","touchleave","mouseout","mouseleave","mouseup","mousedown","mousemove","mouseenter","mousewheel","mouseover"];if(function(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});window.addEventListener("test",null,t),window.removeEventListener("test",null,t)}catch(e){}return e}()){var n=EventTarget.prototype.addEventListener;e=n,EventTarget.prototype.addEventListener=function(n,o,r){var i,s="object"==typeof r&&null!==r,u=s?r.capture:r;(r=s?function(e){var t=Object.getOwnPropertyDescriptor(e,"passive");return t&&!0!==t.writable&&void 0===t.set?Object.assign({},e):e}(r):{}).passive=void 0!==(i=r.passive)?i:-1!==t.indexOf(n)&&!0,r.capture=void 0!==u&&u,e.call(this,n,o,r)},EventTarget.prototype.addEventListener._original=e}});
|
||||
//# sourceMappingURL=index.umd.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.umd.js","sources":["../src/index.js","../src/utils.js"],"sourcesContent":["import { eventListenerOptionsSupported } from './utils';\n\nconst defaultOptions = {\n passive: true,\n capture: false\n};\nconst supportedPassiveTypes = [\n 'scroll', 'wheel',\n 'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',\n 'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'\n];\nconst getDefaultPassiveOption = (passive, eventName) => {\n if (passive !== undefined) return passive;\n\n return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive;\n};\n\nconst getWritableOptions = (options) => {\n const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive');\n \n return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined\n ? Object.assign({}, options)\n : options;\n};\n\nconst overwriteAddEvent = (superMethod) => {\n EventTarget.prototype.addEventListener = function (type, listener, options) {\n const usesListenerOptions = typeof options === 'object' && options !== null;\n const useCapture = usesListenerOptions ? options.capture : options;\n\n options = usesListenerOptions ? getWritableOptions(options) : {};\n options.passive = getDefaultPassiveOption(options.passive, type);\n options.capture = useCapture === undefined ? defaultOptions.capture : useCapture;\n\n superMethod.call(this, type, listener, options);\n };\n\n EventTarget.prototype.addEventListener._original = superMethod;\n};\n\nconst supportsPassive = eventListenerOptionsSupported();\n\nif (supportsPassive) {\n const addEvent = EventTarget.prototype.addEventListener;\n overwriteAddEvent(addEvent);\n}\n","export const eventListenerOptionsSupported = () => {\n let supported = false;\n\n try {\n const opts = Object.defineProperty({}, 'passive', {\n get() {\n supported = true;\n }\n });\n\n window.addEventListener('test', null, opts);\n window.removeEventListener('test', null, opts);\n } catch (e) {}\n\n return supported;\n}\n"],"names":["superMethod","supportedPassiveTypes","supported","opts","Object","defineProperty","get","window","addEventListener","removeEventListener","e","eventListenerOptionsSupported","addEvent","EventTarget","prototype","type","listener","options","passive","usesListenerOptions","useCapture","capture","passiveDescriptor","getOwnPropertyDescriptor","writable","undefined","set","assign","getWritableOptions","indexOf","call","this","_original"],"mappings":"iFAyB2BA,EAnBrBC,EAAwB,CAC5B,SAAU,QACV,aAAc,YAAa,aAAc,WAAY,aACrD,WAAY,aAAc,UAAW,YAAa,YAAa,aAAc,aAAc,aAiC7F,GC1C6C,WAC3C,IAAIC,GAAY,EAEhB,IACE,IAAMC,EAAOC,OAAOC,eAAe,GAAI,UAAW,CAChDC,eACEJ,GAAY,KAIhBK,OAAOC,iBAAiB,OAAQ,KAAML,GACtCI,OAAOE,oBAAoB,OAAQ,KAAMN,GACzC,MAAOO,IAET,OAAOR,ED0BeS,GAEH,CACnB,IAAMC,EAAWC,YAAYC,UAAUN,iBAlBdR,EAmBPY,EAlBlBC,YAAYC,UAAUN,iBAAmB,SAAUO,EAAMC,EAAUC,GACjE,IAhB6BC,EAgBvBC,EAAyC,iBAAZF,GAAoC,OAAZA,EACrDG,EAAsBD,EAAsBF,EAAQI,QAAUJ,GAEpEA,EAAkBE,EAbK,SAACF,GAC1B,IAAMK,EAAoBlB,OAAOmB,yBAAyBN,EAAS,WAEnE,OAAOK,IAAoD,IAA/BA,EAAkBE,eAA+CC,IAA1BH,EAAkBI,IACjFtB,OAAOuB,OAAO,GAAIV,GAClBA,EAQsCW,CAAmBX,GAAW,IAC9DC,aAnBMO,KADeP,EAoBaD,EAAQC,SAnBlBA,GAEmB,IAA9CjB,EAAsB4B,QAiBgCd,KA5BpD,EA6BPE,EAAQI,aAAyBI,IAAfL,GAAoDA,EAEtEpB,EAAY8B,KAAKC,KAAMhB,EAAMC,EAAUC,IAGzCJ,YAAYC,UAAUN,iBAAiBwB,UAAYhC"}
|
||||
@@ -0,0 +1,79 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Default Passive Events Demo</title>
|
||||
<style>
|
||||
body {
|
||||
height: 2000px;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="style.css" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>Default-passive-events demo page</h1>
|
||||
<p class="h5 color-light">Open up a developer console and try clicking buttons below/scrolling the page.</p>
|
||||
<h4>Now look at the source code. Yes, it's that simple!</43>
|
||||
</header>
|
||||
<main>
|
||||
<p>
|
||||
<button id="1">1</button>
|
||||
<code>addEventListener</code> <strong>without</strong> 3rd argument defaults to <code>{ passive: true, capture: false }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="2">2</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= true</code> defaults to <code>{ passive: true, capture: true }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="3">3</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= false</code> defaults to <code>{ passive: true, capture: false }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="4">4</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= { passive: false }</code> defaults to <code>{ passive: false, capture: false }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="5">5</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= { passive: false, capture: false }</code> defaults to <code>{ passive: false, capture: false }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="6">6</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= { passive: false, capture: true }</code> defaults to <code>{ passive: false, capture: true }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="7">7</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= { passive: true, capture: false }</code> defaults to <code>{ passive: true, capture: false }</code>
|
||||
</p>
|
||||
<p>
|
||||
<button id="8">8</button>
|
||||
<code>addEventListener</code> with 3rd argument <code>= { passive: true, capture: true }</code> defaults to <code>{ passive: true, capture: true }</code>
|
||||
</p>
|
||||
</main>
|
||||
<footer>
|
||||
<a class="accent p-h-10" href="https://github.com/zzarcon/default-passive-events/" alt="Default-passive-events github page">Default-passive-events</a>
|
||||
<iframe class="v-align-m" src="https://ghbtns.com/github-btn.html?user=zzarcon&repo=default-passive-events&type=star&count=true&size=small" frameborder="0" scrolling="0" width="90" height="20"></iframe>
|
||||
</footer>
|
||||
|
||||
<script src="https://unpkg.com/default-passive-events"></script>
|
||||
<script>
|
||||
document.getElementById('1').addEventListener('mouseup', onMouseUp); // {passive: true, capture: false}
|
||||
document.getElementById('2').addEventListener('mouseup', onMouseUp, true); // {passive: true, capture: true}
|
||||
document.getElementById('3').addEventListener('mouseup', onMouseUp, false); // {passive: true, capture: false}
|
||||
document.getElementById('4').addEventListener('mouseup', onMouseUp, {passive: false}); // {passive: false, capture: false}
|
||||
document.getElementById('5').addEventListener('mouseup', onMouseUp, {passive: false, capture: false}); // {passive: false, capture: false}
|
||||
document.getElementById('6').addEventListener('mouseup', onMouseUp, {passive: false, capture: true}); // {passive: false, capture: true}
|
||||
document.getElementById('7').addEventListener('mouseup', onMouseUp, {passive: true, capture: false}); // {passive: true, capture: false}
|
||||
document.getElementById('8').addEventListener('mouseup', onMouseUp, {passive: true, capture: true}); // {passive: true, capture: true}
|
||||
document.addEventListener('scroll', onScroll);
|
||||
|
||||
function onScroll(e) {
|
||||
console.log('onScroll', this);
|
||||
}
|
||||
|
||||
function onMouseUp (e) {
|
||||
console.log('onMouseUp', this);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
+106
@@ -0,0 +1,106 @@
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: Tahoma, Helvetica, sans-serif;
|
||||
font-size: 10px;
|
||||
color: #212121;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
h5, .h5 {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: .2em;
|
||||
background: #B3E5FC;
|
||||
font-family: monospace, 'Lucida console', sans-serif;
|
||||
}
|
||||
|
||||
header, footer, main {
|
||||
box-sizing: border-box;
|
||||
padding-left: 15%;
|
||||
padding-right: 15%;
|
||||
}
|
||||
|
||||
header, footer {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
background: #03A9F4;
|
||||
box-shadow: 0 1px 8px 1px rgba(0,0,0,.4);
|
||||
}
|
||||
|
||||
button, a {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
button {
|
||||
border: none;
|
||||
margin: 5px 10px;
|
||||
padding: 5px 20px;
|
||||
font-size: 1.6rem;
|
||||
border-radius: 2px;
|
||||
background: #448AFF;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,.4);
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
cursor: pointer;
|
||||
transition: box-shadow .15s ease-in-out,
|
||||
opacity .15s ease-in-out;
|
||||
}
|
||||
|
||||
button:hover, a:hover {
|
||||
opacity: .9;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
box-shadow: 0 2px 6px 1px rgba(0,0,0,.3);
|
||||
}
|
||||
|
||||
.p-h-10 {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.v-align-m {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.color-light {
|
||||
color: #B3E5FC;
|
||||
}
|
||||
|
||||
main {
|
||||
padding-top: 20px;
|
||||
padding-bottom: 40px; /* so main would be never overlapped by footer */
|
||||
}
|
||||
|
||||
footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
font-size: 1.2rem;
|
||||
text-align: right;
|
||||
}
|
||||
@@ -0,0 +1,45 @@
|
||||
{
|
||||
"name": "default-passive-events",
|
||||
"version": "2.0.0",
|
||||
"description": "Makes {passive: true} by default when EventListenerOptions are supported",
|
||||
"main": "dist/index.js",
|
||||
"source": "src/index.js",
|
||||
"module": "dist/index.module.js",
|
||||
"esmodule": "dist/index.modern.js",
|
||||
"unpkg": "dist/index.umd.js",
|
||||
"scripts": {
|
||||
"test": "jest",
|
||||
"test-ci": "jest --runInBand --coverage",
|
||||
"build": "microbundle",
|
||||
"watch": "microbundle watch",
|
||||
"prepublishOnly": "yarn test-ci && yarn build",
|
||||
"version": "yarn build && git add dist"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/zzarcon/default-passive-events.git"
|
||||
},
|
||||
"author": "zzarcon",
|
||||
"contributors": [
|
||||
"FRS <jakub.freisler@gmail.com> (https://github.com/frsgit)"
|
||||
],
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/zzarcon/default-passive-events/issues"
|
||||
},
|
||||
"homepage": "https://github.com/zzarcon/default-passive-events#readme",
|
||||
"dependencies": {},
|
||||
"devDependencies": {
|
||||
"jest": "^26.1.0",
|
||||
"microbundle": "^0.12.2"
|
||||
},
|
||||
"files": [
|
||||
"dist/",
|
||||
"src/",
|
||||
"LICENSE",
|
||||
"yarn.lock"
|
||||
],
|
||||
"jest": {
|
||||
"resetMocks": true
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
import { eventListenerOptionsSupported } from './utils';
|
||||
|
||||
const defaultOptions = {
|
||||
passive: true,
|
||||
capture: false
|
||||
};
|
||||
const supportedPassiveTypes = [
|
||||
'scroll', 'wheel',
|
||||
'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',
|
||||
'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'
|
||||
];
|
||||
const getDefaultPassiveOption = (passive, eventName) => {
|
||||
if (passive !== undefined) return passive;
|
||||
|
||||
return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive;
|
||||
};
|
||||
|
||||
const getWritableOptions = (options) => {
|
||||
const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive');
|
||||
|
||||
return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined
|
||||
? Object.assign({}, options)
|
||||
: options;
|
||||
};
|
||||
|
||||
const overwriteAddEvent = (superMethod) => {
|
||||
EventTarget.prototype.addEventListener = function (type, listener, options) {
|
||||
const usesListenerOptions = typeof options === 'object' && options !== null;
|
||||
const useCapture = usesListenerOptions ? options.capture : options;
|
||||
|
||||
options = usesListenerOptions ? getWritableOptions(options) : {};
|
||||
options.passive = getDefaultPassiveOption(options.passive, type);
|
||||
options.capture = useCapture === undefined ? defaultOptions.capture : useCapture;
|
||||
|
||||
superMethod.call(this, type, listener, options);
|
||||
};
|
||||
|
||||
EventTarget.prototype.addEventListener._original = superMethod;
|
||||
};
|
||||
|
||||
const supportsPassive = eventListenerOptionsSupported();
|
||||
|
||||
if (supportsPassive) {
|
||||
const addEvent = EventTarget.prototype.addEventListener;
|
||||
overwriteAddEvent(addEvent);
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
export const eventListenerOptionsSupported = () => {
|
||||
let supported = false;
|
||||
|
||||
try {
|
||||
const opts = Object.defineProperty({}, 'passive', {
|
||||
get() {
|
||||
supported = true;
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener('test', null, opts);
|
||||
window.removeEventListener('test', null, opts);
|
||||
} catch (e) {}
|
||||
|
||||
return supported;
|
||||
}
|
||||
+6006
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user