electrum-events - npm Package Compare versions

Comparing version 1.0.5 to 1.1.0

lib/event-handlers.js

@@ -53,2 +53,12 @@ 'use strict';
   _createClass(EventHandlers, [{
+    key: 'getValue',
+    value: function getValue(target) {
+      return this._valueGetter(target);
+    }
+  }, {
+    key: 'getStates',
+    value: function getStates(target) {
+      return this._statesGetter(target);
+    }
+  }, {
     key: 'handleFocus',
@@ -59,6 +69,6 @@ value: function handleFocus(ev) {
       this.notify(ev, function (e) {
-        return _this.processChangeEvent(e);
+        return _this.processChangeEvent(e, 'focus');
       });
       this.notify(ev, function (e) {
-        return _this.processFocusEvent(e);
+        return _this.processFocusEvent(e, 'focus');
       });
@@ -73,3 +83,3 @@ ev.stopPropagation();
       this.notify(ev, function (e) {
-        return _this2.processChangeEvent(e);
+        return _this2.processChangeEvent(e, 'change');
       });
@@ -85,3 +95,3 @@ ev.stopPropagation();
       this.notify(ev, function (e) {
-        return _this3.processChangeEvent(e);
+        return _this3.processChangeEvent(e, 'key-down');
       });
@@ -95,3 +105,3 @@ }
       this.notify(ev, function (e) {
-        return _this4.processChangeEvent(e);
+        return _this4.processChangeEvent(e, 'key-up');
       });
@@ -105,3 +115,3 @@ }
       this.notify(ev, function (e) {
-        return _this5.processChangeEvent(e);
+        return _this5.processChangeEvent(e, 'key-press');
       });
@@ -115,3 +125,3 @@ }
       this.notify(ev, function (e) {
-        return _this6.processChangeEvent(e);
+        return _this6.processChangeEvent(e, 'select');
       });
@@ -131,7 +141,8 @@ }
     key: 'processChangeEvent',
-    value: function processChangeEvent(ev) {
+    value: function processChangeEvent(ev, source) {
+      this.log(ev, source);
       var bus = this.bus;
       if (bus && 'notify' in bus) {
         var target = ev.target;
-        bus.notify.apply(bus, [this.props, this._valueGetter(target)].concat(_toConsumableArray(this._statesGetter(target))));
+        bus.notify.apply(bus, [this.props, this.getValue(target)].concat(_toConsumableArray(this.getStates(target))));
       }
@@ -141,3 +152,4 @@ }
     key: 'processFocusEvent',
-    value: function processFocusEvent() {
+    value: function processFocusEvent(ev, source) {
+      this.log(ev, source);
       var bus = this.bus;
@@ -149,2 +161,13 @@ if (bus && 'dispatch' in bus) {
   }, {
+    key: 'log',
+    value: function log(ev, source) {
+      if (this.debug) {
+        if (typeof this._debug === 'function') {
+          this._debug(source, ev);
+        } else {
+          console.log(source + ': %O', ev);
+        }
+      }
+    }
+  }, {
     key: 'props',
@@ -159,2 +182,10 @@ get: function get() {
     }
+  }, {
+    key: 'debug',
+    get: function get() {
+      return !!this._debug;
+    },
+    set: function set(value) {
+      this._debug = value;
+    }
   }], [{
@@ -161,0 +192,0 @@ key: 'inject',

package.json

 {
   "name": "electrum-events",
-  "version": "1.0.5",
+  "version": "1.1.0",
   "description": "Electrum Events forwards web component events to the bus.",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -14,3 +14,3 @@ # Electrum Events
 * `handleChange`
-* `handleKeyDown` and `handleKeyUp`
+* `handleKeyDown`, `handleKeyUp` and `handleKeyPress`
 * `handleSelect`
@@ -24,1 +24,18 @@
   They are sent with the `bus.dispatch()` function.
+
+# Debug with active logging
+
+Class `EventHandlers` has a property `debug` which can be set to log
+events to the console, which may prove convenient to better understand
+what happens.
+
+For customized logging, set `debug` to a function:
+
+```javascript
+const eh = new EventHandlers (obj, bus);
+eh.debug = (source, event) => { /* ... */ };
+```
+
+The `source` argument will be one of `focus`, `change`, `key-down`,
+`key-up`, `key-press` and `select`, while the `event` property gives
+full access to the event being processed.

src/event-handlers.js

@@ -38,5 +38,21 @@ 'use strict';
 
+  get debug () {
+    return !!this._debug;
+  }
+
+  set debug (value) {
+    this._debug = value;
+  }
+
+  getValue (target) {
+    return this._valueGetter (target);
+  }
+
+  getStates (target) {
+    return this._statesGetter (target);
+  }
+
   handleFocus (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
-    this.notify (ev, e => this.processFocusEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'focus'));
+    this.notify (ev, e => this.processFocusEvent (e, 'focus'));
     ev.stopPropagation ();
@@ -46,3 +62,3 @@ }
   handleChange (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'change'));
     ev.stopPropagation ();
@@ -53,15 +69,15 @@ ev.preventDefault ();
   handleKeyDown (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'key-down'));
   }
 
   handleKeyUp (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'key-up'));
   }
 
   handleKeyPress (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'key-press'));
   }
 
   handleSelect (ev) {
-    this.notify (ev, e => this.processChangeEvent (e));
+    this.notify (ev, e => this.processChangeEvent (e, 'select'));
   }
@@ -120,11 +136,13 @@
 
-  processChangeEvent (ev) {
+  processChangeEvent (ev, source) {
+    this.log (ev, source);
     const bus = this.bus;
     if (bus && 'notify' in bus) {
       const target = ev.target;
-      bus.notify (this.props, this._valueGetter (target), ...this._statesGetter (target));
+      bus.notify (this.props, this.getValue (target), ...this.getStates (target));
     }
   }
 
-  processFocusEvent () {
+  processFocusEvent (ev, source) {
+    this.log (ev, source);
     const bus = this.bus;
@@ -135,4 +153,14 @@ if (bus && 'dispatch' in bus) {
   }
+
+  log (ev, source) {
+    if (this.debug) {
+      if (typeof this._debug === 'function') {
+        this._debug (source, ev);
+      } else {
+        console.log (`${source}: %O`, ev);
+      }
+    }
+  }
 }
 
 /******************************************************************************/

src/test/event-handlers.js

@@ -6,2 +6,4 @@ 'use strict';
 import EventHandlers from '../event-handlers.js';
+import Bus from './dummy-bus.js';
+import Event from './dummy-event.js';
 
@@ -34,19 +36,41 @@ /******************************************************************************/
 
-  describe ('handleKeyDown()', () => {
-    class Bus {
-      constructor () {
-        this._count = 0;
-      }
-      notify (props, value, ...states) {
-        this._count++;
-        this._props = props;
-        this._value = value;
-        this._states = states;
-      }
-    }
+  describe ('handleFocus()', () => {
+    it ('does not invoke bus.notify() and bus.dispatch() when event has no target', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      eh.handleFocus (ev);
+      expect (bus).to.have.property ('_count', 0);
+    });
 
+    it ('invokes bus.notify() and bus.dispatch()', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleFocus (ev);
+      expect (bus).to.have.property ('_count', 2);
+      expect (bus).to.have.property ('_props', emptyProps);
+      expect (bus).to.have.property ('_value', 'x');
+      expect (bus).to.have.property ('_states').deep.equal ([{from: 0, to: 0}]);
+      expect (bus).to.have.property ('_message', 'focus');
+    });
+
+    it ('stops event propagation', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleFocus (ev);
+      expect (ev.propagationStop).to.equal (1);
+      expect (ev.defaultPrevention).to.equal (0);
+    });
+  });
+
+  describe ('handleChange()', () => {
     it ('does not invoke bus.notify() when event has no target', () => {
       const bus = new Bus ();
       const eh = new EventHandlers (emptyObj, bus);
-      eh.handleKeyDown ({});
+      const ev = new Event ();
+      eh.handleChange (ev);
       expect (bus).to.have.property ('_count', 0);
@@ -58,3 +82,5 @@ });
       const eh = new EventHandlers (emptyObj, bus);
-      eh.handleKeyDown ({target: {value: 'x', nodeName: 'INPUT', nodeType: 1}});
+      const ev = new Event ();
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleChange (ev);
       expect (bus).to.have.property ('_count', 1);
@@ -65,5 +91,48 @@ expect (bus).to.have.property ('_props', emptyProps);
     });
+
+    it ('stops event propagation and prevents default event handling', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleChange (ev);
+      expect (ev.propagationStop).to.equal (1);
+      expect (ev.defaultPrevention).to.equal (1);
+    });
   });
+
+  describe ('handleKeyDown()', () => {
+    it ('does not invoke bus.notify() when event has no target', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      eh.handleKeyDown (ev);
+      expect (bus).to.have.property ('_count', 0);
+    });
+
+    it ('invokes bus.notify()', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleKeyDown (ev);
+      expect (bus).to.have.property ('_count', 1);
+      expect (bus).to.have.property ('_props', emptyProps);
+      expect (bus).to.have.property ('_value', 'x');
+      expect (bus).to.have.property ('_states').deep.equal ([{from: 0, to: 0}]);
+    });
+
+    it ('with debug function logs event', () => {
+      const bus = new Bus ();
+      const eh = new EventHandlers (emptyObj, bus);
+      const ev = new Event ();
+      let log = '';
+      eh.debug = (s, e) => log = `${s}: ${e.target.value}`;
+      ev.target = {value: 'x', nodeName: 'INPUT', nodeType: 1};
+      eh.handleKeyDown (ev);
+      expect (log).to.equal ('key-down: x');
+    });
+  });
 });
 
 /******************************************************************************/

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

Improved metrics

Total package byte prevSize

27601

increased by24.69%

Number of package files

19

increased by11.76%

Lines of code

589

increased by35.09%

Number of lines in readme file

40

increased by73.91%

No dependency changes