events-polyfill - npm Package Compare versions

Comparing version 1.1.0 to 1.1.1

event-constructor-polyfill.js

@@ -6,2 +6,3 @@ (function() {
 
+  // ✓, ✗
 
@@ -14,18 +15,15 @@ /**
   } catch (error) {
+    var CustomEventOriginal = window.CustomEvent || window.Event;
     var CustomEvent = function(eventName, params) {
       params = params || {};
-      params.bubbles    = (typeof params.bubbles === 'boolean') ? params.bubbles : false;
-      params.cancelable = (typeof params.cancelable === 'boolean') ? params.cancelable : false;
-      params.detail     = params.detail || {};
-
       var event = document.createEvent('CustomEvent');
       event.initCustomEvent(
         eventName,
-        params.bubbles,
-        params.cancelable,
-        params.detail
+        (params.bubbles === void 0) ? false : params.bubbles,
+        (params.cancelable === void 0) ? false : params.cancelable,
+        (params.detail === void 0) ? {} : params.detail
       );
       return event;
     };
-    CustomEvent.prototype = window.Event.prototype;
+    CustomEvent.prototype = CustomEventOriginal.prototype;
     window.CustomEvent = CustomEvent;
@@ -36,3 +34,14 @@ }
   /**
-   * Polyfill MouseEvent
+   * Polyfill MouseEvent : https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent
+   *  - screenX ✓
+   *  - screenY ✓
+   *  - clientX ✓
+   *  - clientY ✓
+   *  - ctrlKey ✓
+   *  - shiftKey ✓
+   *  - altKey ✓
+   *  - metaKey ✓
+   *  - button ✓
+   *  - buttons ✓
+   *  - region ✓
    */
@@ -42,41 +51,32 @@ try {
   } catch (error) {
+    var MouseEventOriginal = window.MouseEvent || window.Event;
     var MouseEvent = function(eventName, params) {
       params = params || {};
-      params.bubbles    = (typeof params.bubbles === 'boolean') ? params.bubbles : false;
-      params.cancelable = (typeof params.cancelable === 'boolean') ? params.cancelable : false;
-      params.view       = params.view || window;
-      params.detail     = (typeof params.detail === 'number') ? params.detail : 1;
-      params.screenX    = (typeof params.screenX === 'number') ? params.screenX : 0;
-      params.screenY    = (typeof params.screenY === 'number') ? params.screenY : 0;
-      params.clientX    = (typeof params.clientX === 'number') ? params.clientX : 0;
-      params.clientY    = (typeof params.clientY === 'number') ? params.clientY : 0;
-      params.ctrlKey    = (typeof params.clientY === 'boolean') ? params.ctrlKey : false;
-      params.altKey     = (typeof params.altKey === 'boolean') ? params.altKey : false;
-      params.shiftKey   = (typeof params.shiftKey === 'boolean') ? params.shiftKey : false;
-      params.metaKey    = (typeof params.metaKey === 'boolean') ? params.metaKey : false;
-      params.button     = (typeof params.button === 'number') ? params.button : 1;
+      var event = document.createEvent('MouseEvent');
 
-      params.relatedTarget = params.relatedTarget || null;
-
-      var event = document.createEvent('MouseEvent');
+      // https://msdn.microsoft.com/en-us/library/ff975292(v=vs.85).aspx
       event.initMouseEvent(
         eventName,
-        params.bubbles,
-        params.cancelable,
-        params.view,
-        params.detail,
-        params.screenX,
-        params.screenY,
-        params.clientX,
-        params.clientY,
-        params.ctrlKey,
-        params.altKey,
-        params.shiftKey,
-        params.metaKey,
-        params.button,
-        params.relatedTarget
+        (params.bubbles === void 0) ? false : params.bubbles,
+        (params.cancelable === void 0) ? false : params.cancelable,
+        (params.view === void 0) ? window : params.view,
+        (params.detail === void 0) ? 0 : params.detail,
+        (params.screenX === void 0) ? 0 : params.screenX,
+        (params.screenY === void 0) ? 0 : params.screenY,
+        (params.clientX === void 0) ? 0 : params.clientX,
+        (params.clientY === void 0) ? 0 : params.clientY,
+        (params.ctrlKey === void 0) ? false : params.ctrlKey,
+        (params.altKey === void 0) ? false : params.altKey,
+        (params.shiftKey === void 0) ? false : params.shiftKey,
+        (params.metaKey === void 0) ? false : params.metaKey,
+        (params.button === void 0) ? 0 : params.button,
+        (params.relatedTarget === void 0) ? null : params.relatedTarget
       );
+
+      event.buttons = (params.buttons === void 0) ? 0 : params.buttons;
+      event.region  = (params.region === void 0) ? null : params.region;
+
       return event;
     };
-    MouseEvent.prototype = window.Event.prototype;
+    MouseEvent.prototype = MouseEventOriginal.prototype;
     window.MouseEvent = MouseEvent;
@@ -86,3 +86,16 @@ }
   /**
-   * Polyfill KeyboardEvent
+   * Polyfill KeyboardEvent : https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/KeyboardEvent
+   *  - key ✓
+   *  - char ✓
+   *  - code ✓
+   *  - location ✓
+   *  - ctrlKey ✓
+   *  - shiftKey ✓
+   *  - altKey ✓
+   *  - metaKey ✓
+   *  - repeat ✓
+   *  - isComposing ✗
+   *  - charCode ✓
+   *  - keyCode ✓
+   *  - which ✓
    */
@@ -92,33 +105,34 @@ try {
   } catch (error) {
+    var KeyboardEventOriginal = window.KeyboardEvent || window.Event;
     var KeyboardEvent = function(eventName, params) {
       params = params || {};
-      params.bubbles    = (typeof params.bubbles === 'boolean') ? params.bubbles : false;
-      params.cancelable = (typeof params.cancelable === 'boolean') ? params.cancelable : false;
-      params.view       = params.view || window;
-      params.ctrlKey    = (typeof params.clientY === 'boolean') ? params.ctrlKey : false;
-      params.altKey     = (typeof params.altKey === 'boolean') ? params.altKey : false;
-      params.shiftKey   = (typeof params.shiftKey === 'boolean') ? params.shiftKey : false;
-      params.metaKey    = (typeof params.metaKey === 'boolean') ? params.metaKey : false;
-      params.keyCode    = (typeof params.button === 'number') ? params.keyCode : 0;
-      params.charCode   = (typeof params.charCode === 'number') ? params.charCode : 0;
+      var event = document.createEvent('KeyboardEvent');
 
-
-      var event = document.createEvent('KeyboardEvent');
-      event.iniKeyEvent(
+      // https://msdn.microsoft.com/en-us/library/ff975297(v=vs.85).aspx
+      event.initKeyboardEvent(
         eventName,
-        params.bubbles,
-        params.cancelable,
-        params.view,
-        params.ctrlKey,
-        params.altKey,
-        params.shiftKey,
-        params.metaKey,
-        params.keyCode,
-        params.charCode
+        (params.bubbles === void 0) ? false : params.bubbles,
+        (params.cancelable === void 0) ? false : params.cancelable,
+        (params.view === void 0) ? window : params.view,
+        (params.key === void 0) ? '' : params.key,
+        (params.location === void 0) ? 0 : params.location,
+        ((params.ctrlKey === true) ? 'Control ' : '') +
+        ((params.altKey === true) ? 'Alt ' : '') +
+        ((params.shiftKey === true) ? 'Shift ' : '') +
+        ((params.metaKey === true) ? 'Meta ' : ''),
+        (params.repeat === void 0) ? false : params.repeat,
+        (params.locale === void 0) ? navigator.language : params.locale
       );
+
+      event.keyCode   = (params.keyCode === void 0) ? 0 : params.keyCode;
+      event.code      = (params.code === void 0) ? '' : params.code;
+      event.charCode  = (params.charCode === void 0) ? 0 : params.charCode;
+      event.char      = (params.charCode === void 0) ? '' : params.charCode;
+      event.which     = (params.which === void 0) ? 0 : params.which;
+
       return event;
     };
-    KeyboardEvent.prototype = window.Event.prototype;
+    KeyboardEvent.prototype = KeyboardEventOriginal.prototype;
     window.KeyboardEvent = KeyboardEvent;
   }
 })();

event-listener-polyfill.js

@@ -78,3 +78,4 @@ (function() {
     } else {
-      throw new Error('Unsupported listener type for addEventListener');
+      return listener;
+      // throw new Error('Unsupported listener type for addEventListener');
     }
@@ -162,7 +163,290 @@ };
 
+  EventListenerHelper.polyfillEventTypesName = function(type, target) {
+    var eventTypesPolyfiller = EventListenerHelper.eventTypes[type];
+    if(typeof eventTypesPolyfiller === 'undefined') {
+      return type;
+    } else {
+      var i = 0;
+      for(; i < eventTypesPolyfiller.length; i++) {
+        if(('on' + eventTypesPolyfiller[i]) in target) {
+          return eventTypesPolyfiller[i];
+        }
+      }
 
-  EventListenerHelper.polyfillListener = function(_class) {
+      if(i === eventTypesPolyfiller.length) {
+        throw new Error('Not supported type <' + type + '>');
+      }
+    }
+  };
 
-    EventListenerHelper.addEventListener = _class.prototype.addEventListener;
-    _class.prototype.addEventListener = function(type, listener, options) {
+
+  EventListenerHelper.keyCodes = [
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "Backspace",
+    "Tab",
+    null,
+    null,
+    "Numpad5",
+    "NumpadEnter",
+    null,
+    null,
+    "ShiftLeft",
+    "ControlRight",
+    "AltRight",
+    "Pause",
+    "CapsLock",
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "Escape",
+    null,
+    null,
+    null,
+    null,
+    "Space",
+    "PageUp",
+    "PageDown",
+    "End",
+    "Home",
+    "ArrowLeft",
+    "ArrowUp",
+    "ArrowRight",
+    "ArrowDown",
+    null,
+    null,
+    null,
+    null,
+    "Insert",
+    "Delete",
+    null,
+    "Digit0",
+    "Digit1",
+    "Digit2",
+    "Digit3",
+    "Digit4",
+    "Digit5",
+    "Digit6",
+    "Digit7",
+    "Digit8",
+    "Digit9",
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "KeyA",
+    "KeyB",
+    "KeyC",
+    "KeyD",
+    "KeyE",
+    "KeyF",
+    "KeyG",
+    "KeyH",
+    "KeyI",
+    "KeyJ",
+    "KeyK",
+    "KeyL",
+    "KeyM",
+    "KeyN",
+    "KeyO",
+    "KeyP",
+    "KeyQ",
+    "KeyR",
+    "KeyS",
+    "KeyT",
+    "KeyU",
+    "KeyV",
+    "KeyW",
+    "KeyX",
+    "KeyZ",
+    "KeyY",
+    "MetaLeft",
+    "MetaRight",
+    "ContextMenu",
+    null,
+    null,
+    "Numpad0",
+    "Numpad1",
+    "Numpad2",
+    "Numpad3",
+    "Numpad4",
+    "Numpad5",
+    "Numpad6",
+    "Numpad7",
+    "Numpad8",
+    "Numpad9",
+    "NumpadMultiply",
+    "NumpadAdd",
+    null,
+    "NumpadSubtract",
+    "NumpadDecimal",
+    "NumpadDivide",
+    "F1",
+    "F2",
+    "F3",
+    "F4",
+    "F5",
+    "F6",
+    "F7",
+    "F8",
+    "F9",
+    "F10",
+    "F11",
+    "F12",
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "NumLock",
+    "ScrollLock",
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "BracketLeft",
+    null,
+    "Comma",
+    "Slash",
+    "Period",
+    "Backquote",
+    "BracketRight",
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    null,
+    "Minus",
+    "Quote",
+    "Equal",
+    "Semicolon",
+    "Backslash",
+    null,
+    null,
+    "IntlBackslash"
+  ];
+
+  window.buildKeyCodes = function() {
+    window.addEventListener('keydown', function(event) {
+      if(EventListenerHelper.keyCodes[event.keyCode] && EventListenerHelper.keyCodes[event.keyCode] !== event.code) {
+        console.warn('Detect same keyCode for 2 different codes : ' + event.code + ' (current) vs ' + EventListenerHelper.keyCodes[event.keyCode] + '(old)');
+      }
+      EventListenerHelper.keyCodes[event.keyCode] = event.code;
+      event.preventDefault();
+      event.stopPropagation();
+    });
+  };
+
+  window.endBuildKeyCodes = function() {
+    console.log(JSON.stringify(EventListenerHelper.keyCodes, null, '\t'));
+  };
+
+
+  EventListenerHelper.polyfillEventTypesObject = function(event) {
+   if(event instanceof KeyboardEvent) {
+      if(!('code' in event)) {
+        event.code = EventListenerHelper.keyCodes[event.keyCode];
+      }
+    }
+  };
+
+  EventListenerHelper.polyfilledConstructors = {};
+
+  EventListenerHelper.polyfillListener = function() {
+    EventListenerHelper.polyfillListenerConstructor(EventTarget);
+    if(!(window instanceof EventTarget)) { EventListenerHelper.polyfillListenerConstructor(Window); }
+  };
+
+  EventListenerHelper.polyfillListenerConstructor = function(constructor, name) {
+    var polyfilledConstructor = {
+      name: name,
+      addEventListener: constructor.prototype.addEventListener,
+      removeEventListener:  constructor.prototype.removeEventListener
+    };
+
+    constructor.prototype.addEventListener = function(type, listener, options) {
       var formattedArguments      = EventListenerHelper.getFormattedArguments(type, listener, options);
@@ -176,22 +460,9 @@ var registeredEventListener = EventListenerHelper.getRegisteredEventListener(this, formattedArguments);
 
-        vendorArguments.type = formattedArguments.type;
+        vendorArguments.type = formattedArguments.options.polyfill ?
+          EventListenerHelper.polyfillEventTypesName(formattedArguments.type) :
+          formattedArguments.type
+        ;
 
-        if(formattedArguments.options.polyfill) {
-          var eventTypesPolyfiller = EventListenerHelper.eventTypes[formattedArguments.type];
-          if(typeof eventTypesPolyfiller !== 'undefined') {
-            var i;
-            for(i = 0; i < eventTypesPolyfiller.length; i++) {
-              if(('on' + eventTypesPolyfiller[i]) in this) {
-                vendorArguments.type = eventTypesPolyfiller[i];
-                break;
-              }
-            }
-
-            if(i === eventTypesPolyfiller.length) {
-              throw new Error('Not supported type <' + type + '>');
-            }
-          }
-        }
-
         vendorArguments.listener = function(event) {
+            // once
           if(formattedArguments.options.once && !EventListenerHelper.supportedOptions.once) {
@@ -201,2 +472,3 @@ this.removeEventListener(type, listener, options);
 
+            // passive
           if(formattedArguments.options.passive && !EventListenerHelper.supportedOptions.passive) {
@@ -208,4 +480,6 @@ event.preventDefault = function() {
 
+            // polyfill
           if(formattedArguments.options.polyfill) {
             event.type = formattedArguments.type;
+            EventListenerHelper.polyfillEventTypesObject(event);
           }
@@ -216,7 +490,4 @@
 
-        if(EventListenerHelper.supportedOptions.some) {
-          vendorArguments.options = formattedArguments.options;
-        } else {
-          vendorArguments.options = formattedArguments.options.capture;
-        }
+        vendorArguments.options = EventListenerHelper.supportedOptions.some ?
+          formattedArguments.options : formattedArguments.options.capture;
 
@@ -229,3 +500,3 @@ formattedArguments.vendorArguments = vendorArguments;
 
-        EventListenerHelper.addEventListener.call(
+        polyfilledConstructor.addEventListener.call(
           this,
@@ -239,4 +510,3 @@ vendorArguments.type,
 
-    EventListenerHelper.removeEventListener = _class.prototype.removeEventListener;
-    _class.prototype.removeEventListener = function(type, listener, options) {
+    constructor.prototype.removeEventListener = function(type, listener, options) {
       var formattedArguments      = EventListenerHelper.getFormattedArguments(type, listener, options);
@@ -247,3 +517,3 @@ var registeredEventListener = EventListenerHelper.getRegisteredEventListener(this, formattedArguments);
         EventListenerHelper.unregisterEventListener(this, formattedArguments);
-        EventListenerHelper.removeEventListener.call(
+        polyfilledConstructor.removeEventListener.call(
           this,
@@ -255,6 +525,7 @@ registeredEventListener.vendorArguments.type,
       } else {
-        EventListenerHelper.removeEventListener.call(this, type, listener, options);
+        polyfilledConstructor.removeEventListener.call(this, type, listener, options);
       }
-    }
+    };
 
+    EventListenerHelper.polyfilledConstructors[name] = polyfilledConstructor;
   };
@@ -269,3 +540,3 @@
     EventListenerHelper.getSupportedOptions();
-    EventListenerHelper.polyfillListener(EventTarget);
+    EventListenerHelper.polyfillListener();
   };
@@ -276,2 +547,4 @@
 
+  window.EventListenerHelper = EventListenerHelper;
+
   // var div = document.createElement('div');
@@ -278,0 +551,0 @@ // document.body.innerHTML = '';

package.json

 {
   "name": "events-polyfill",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Polyfill event : EventListener, EventTarget, CustomEvent, MouseEvent, KeyboardEvent",
@@ -5,0 +5,0 @@ "main": "event-constructor-polyfill.js",

README.md

@@ -5,2 +5,7 @@ ### Polyfill different events classes and methods to match last ES7 specifications
 
+#### Install
+```
+npm i events-polyfill --save
+```
+
 #### event-constructor-polyfill.js
@@ -19,4 +24,7 @@ Polyfill for : [CustomEvent](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent), [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) and [KeyboardEvent](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent)
 Polyfill vendor prefixed events like 'pointerlockchange' (try 'pointerlockchange', 'mozpointerlockchange' and 'webkitpointerlockchange') and some *'experimental'* events like 'wheel' (try 'wheel', 'mousewheel', 'DOMMouseScroll')
-Can be disabled (ex: for custom events) with option 'polyfill' set to false.
 
+* If option 'polyfill' set to false : disable polyfill (ex: for custom events)
+* If option 'polyfill' set to true AND can't be polyfilled : throw an error (allow you to check is event type is supported)
+
+
 Polyfilled types :
@@ -23,0 +31,0 @@ ```js

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

22261

increased by29.69%

Lines of code

623

increased by80.58%

Number of lines in readme file

57

increased by16.33%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes