Delegate

From 26105034da4fcce7ac883c899d781f016559310d Mon Sep 17 00:00:00 2001 From: ruki Date: Thu, 8 Nov 2018 00:38:48 +0800 Subject: switch to vuepress --- node_modules/delegate/.editorconfig | 22 ++++++ node_modules/delegate/.travis.yml | 3 + node_modules/delegate/demo/delegate.html | 29 ++++++++ node_modules/delegate/demo/multiple.html | 37 +++++++++ node_modules/delegate/demo/undelegate.html | 31 ++++++++ node_modules/delegate/dist/delegate.js | 80 ++++++++++++++++++++ node_modules/delegate/karma.conf.js | 24 ++++++ node_modules/delegate/package.json | 31 ++++++++ node_modules/delegate/readme.md | 99 ++++++++++++++++++++++++ node_modules/delegate/src/closest.js | 33 ++++++++ node_modules/delegate/src/delegate.js | 78 +++++++++++++++++++ node_modules/delegate/test/closest.js | 45 +++++++++++ node_modules/delegate/test/delegate.js | 116 +++++++++++++++++++++++++++++ 13 files changed, 628 insertions(+) create mode 100644 node_modules/delegate/.editorconfig create mode 100644 node_modules/delegate/.travis.yml create mode 100644 node_modules/delegate/demo/delegate.html create mode 100644 node_modules/delegate/demo/multiple.html create mode 100644 node_modules/delegate/demo/undelegate.html create mode 100644 node_modules/delegate/dist/delegate.js create mode 100644 node_modules/delegate/karma.conf.js create mode 100644 node_modules/delegate/package.json create mode 100644 node_modules/delegate/readme.md create mode 100644 node_modules/delegate/src/closest.js create mode 100644 node_modules/delegate/src/delegate.js create mode 100644 node_modules/delegate/test/closest.js create mode 100644 node_modules/delegate/test/delegate.js (limited to 'node_modules/delegate') diff --git a/node_modules/delegate/.editorconfig b/node_modules/delegate/.editorconfig new file mode 100644 index 00000000..0f1d01bd --- /dev/null +++ b/node_modules/delegate/.editorconfig @@ -0,0 +1,22 @@ +# EditorConfig helps developers define and maintain consistent +# coding styles between different editors and IDEs +# http://editorconfig.org + +root = true + +[*] +# Change these settings to your own preference +indent_style = space +indent_size = 4 + +# We recommend you to keep these unchanged +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true + +[*.md] +trim_trailing_whitespace = false + +[{package.json,bower.json}] +indent_size = 2 diff --git a/node_modules/delegate/.travis.yml b/node_modules/delegate/.travis.yml new file mode 100644 index 00000000..833d09d1 --- /dev/null +++ b/node_modules/delegate/.travis.yml @@ -0,0 +1,3 @@ +language: node_js +node_js: + - stable diff --git a/node_modules/delegate/demo/delegate.html b/node_modules/delegate/demo/delegate.html new file mode 100644 index 00000000..3c099210 --- /dev/null +++ b/node_modules/delegate/demo/delegate.html @@ -0,0 +1,29 @@ + + + + + Delegate + + + +

+ + + + + + + + diff --git a/node_modules/delegate/demo/multiple.html b/node_modules/delegate/demo/multiple.html new file mode 100644 index 00000000..af6ca881 --- /dev/null +++ b/node_modules/delegate/demo/multiple.html @@ -0,0 +1,37 @@ + + + + + Delegate + + + +

Item 6
Item 7

+ + + + + + + + diff --git a/node_modules/delegate/demo/undelegate.html b/node_modules/delegate/demo/undelegate.html new file mode 100644 index 00000000..60b59488 --- /dev/null +++ b/node_modules/delegate/demo/undelegate.html @@ -0,0 +1,31 @@ + + + + + Undelegate + + + +

+ + + + + + + + diff --git a/node_modules/delegate/dist/delegate.js b/node_modules/delegate/dist/delegate.js new file mode 100644 index 00000000..5763dfeb --- /dev/null +++ b/node_modules/delegate/dist/delegate.js @@ -0,0 +1,80 @@ +(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.delegate = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o +``` + +## Usage + +### Add event delegation + +#### With the default base (`document`) + +```js +delegate('.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); +``` + +#### With an element as base + +```js +delegate(document.body, '.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); +``` + +#### With a selector (of existing elements) as base + +```js +delegate('.container', '.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); +``` + +#### With an array/array-like of elements as base + +```js +delegate(document.querySelectorAll('.container'), '.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); +``` + +### Remove event delegation + +#### With a single base element (default or specified) + +```js +var delegation = delegate(document.body, '.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); + +delegation.destroy(); +``` + +#### With multiple elements (via selector or array) + +Note: selectors are always treated as multiple elements, even if one or none are matched. `delegate()` will return an array. + +```js +var delegations = delegate('.container', '.btn', 'click', function(e) { + console.log(e.delegateTarget); +}, false); + +delegations.forEach(function (delegation) { + delegation.destroy(); +}); +``` + +## Browser Support + +|

| +|:---:|:---:|:---:|:---:|:---:|:---:| +| Latest ✔ | Latest ✔ | Latest ✔ | 9+ ✔ | Latest ✔ | Latest ✔ | + +## License + +[MIT License](http://zenorocha.mit-license.org/) © Zeno Rocha diff --git a/node_modules/delegate/src/closest.js b/node_modules/delegate/src/closest.js new file mode 100644 index 00000000..842ea074 --- /dev/null +++ b/node_modules/delegate/src/closest.js @@ -0,0 +1,33 @@ +var DOCUMENT_NODE_TYPE = 9; + +/** + * A polyfill for Element.matches() + */ +if (typeof Element !== 'undefined' && !Element.prototype.matches) { + var proto = Element.prototype; + + proto.matches = proto.matchesSelector || + proto.mozMatchesSelector || + proto.msMatchesSelector || + proto.oMatchesSelector || + proto.webkitMatchesSelector; +} + +/** + * Finds the closest parent that matches a selector. + * + * @param {Element} element + * @param {String} selector + * @return {Function} + */ +function closest (element, selector) { + while (element && element.nodeType !== DOCUMENT_NODE_TYPE) { + if (typeof element.matches === 'function' && + element.matches(selector)) { + return element; + } + element = element.parentNode; + } +} + +module.exports = closest; diff --git a/node_modules/delegate/src/delegate.js b/node_modules/delegate/src/delegate.js new file mode 100644 index 00000000..9d9397d1 --- /dev/null +++ b/node_modules/delegate/src/delegate.js @@ -0,0 +1,78 @@ +var closest = require('./closest'); + +/** + * Delegates event to a selector. + * + * @param {Element} element + * @param {String} selector + * @param {String} type + * @param {Function} callback + * @param {Boolean} useCapture + * @return {Object} + */ +function _delegate(element, selector, type, callback, useCapture) { + var listenerFn = listener.apply(this, arguments); + + element.addEventListener(type, listenerFn, useCapture); + + return { + destroy: function() { + element.removeEventListener(type, listenerFn, useCapture); + } + } +} + +/** + * Delegates event to a selector. + * + * @param {Element|String|Array} [elements] + * @param {String} selector + * @param {String} type + * @param {Function} callback + * @param {Boolean} useCapture + * @return {Object} + */ +function delegate(elements, selector, type, callback, useCapture) { + // Handle the regular Element usage + if (typeof elements.addEventListener === 'function') { + return _delegate.apply(null, arguments); + } + + // Handle Element-less usage, it defaults to global delegation + if (typeof type === 'function') { + // Use `document` as the first parameter, then apply arguments + // This is a short way to .unshift `arguments` without running into deoptimizations + return _delegate.bind(null, document).apply(null, arguments); + } + + // Handle Selector-based usage + if (typeof elements === 'string') { + elements = document.querySelectorAll(elements); + } + + // Handle Array-like based usage + return Array.prototype.map.call(elements, function (element) { + return _delegate(element, selector, type, callback, useCapture); + }); +} + +/** + * Finds closest match and invokes callback. + * + * @param {Element} element + * @param {String} selector + * @param {String} type + * @param {Function} callback + * @return {Function} + */ +function listener(element, selector, type, callback) { + return function(e) { + e.delegateTarget = closest(e.target, selector); + + if (e.delegateTarget) { + callback.call(element, e); + } + } +} + +module.exports = delegate; diff --git a/node_modules/delegate/test/closest.js b/node_modules/delegate/test/closest.js new file mode 100644 index 00000000..6a9e25f9 --- /dev/null +++ b/node_modules/delegate/test/closest.js @@ -0,0 +1,45 @@ +var closest = require('../src/closest'); + +describe('closest', function() { + before(function() { + var html = '

' + + '

'; + + document.body.innerHTML += html; + + global.a = document.querySelector('#a'); + global.b = document.querySelector('#b'); + global.c = document.querySelector('#c'); + }); + + after(function() { + document.body.innerHTML = ''; + }); + + it('should return the closest parent based on the selector', function() { + assert.ok(closest(global.c, '#b'), global.b); + assert.ok(closest(global.c, '#a'), global.a); + assert.ok(closest(global.b, '#a'), global.a); + }); + + it('should return itself if the same selector is passed', function() { + assert.ok(closest(document.body, 'body'), document.body); + }); + + it('should not throw on elements without matches()', function() { + var fakeElement = { + nodeType: -1, // anything but DOCUMENT_NODE_TYPE + parentNode: null, + matches: undefined // undefined to emulate Elements without this function + }; + + try { + closest(fakeElement, '#a') + } catch (err) { + assert.fail(); + } + }); +}); diff --git a/node_modules/delegate/test/delegate.js b/node_modules/delegate/test/delegate.js new file mode 100644 index 00000000..669738f6 --- /dev/null +++ b/node_modules/delegate/test/delegate.js @@ -0,0 +1,116 @@ +var delegate = require('../src/delegate'); +var simulant = require('simulant'); + +describe('delegate', function() { + before(function() { + var html = '

Item 1
Item 2
Item 3
Item 4
Item 5

'; + + document.body.innerHTML += html; + + global.container = document.querySelector('ul'); + global.anchor = document.querySelector('a'); + + global.spy = sinon.spy(global.container, 'removeEventListener'); + }); + + after(function() { + global.spy.restore(); + document.body.innerHTML = ''; + }); + + it('should add an event listener', function(done) { + delegate(global.container, 'a', 'click', function() { + done(); + }); + + simulant.fire(global.anchor, simulant('click')); + }); + + it('should remove an event listener', function() { + var delegation = delegate(global.container, 'a', 'click', function() {}); + + delegation.destroy(); + assert.ok(global.spy.calledOnce); + }); + + it('should use `document` if the element is unspecified', function(done) { + delegate('a', 'click', function() { + done(); + }); + + simulant.fire(global.anchor, simulant('click')); + }); + + it('should remove an event listener the unspecified base (`document`)', function() { + var delegation = delegate('a', 'click', function() {}); + var spy = sinon.spy(document, 'removeEventListener'); + + delegation.destroy(); + assert.ok(spy.calledOnce); + + spy.restore(); + }); + + it('should add event listeners to all the elements in a base selector', function() { + var spy = sinon.spy(); + delegate('li', 'a', 'click', spy); + + var anchors = document.querySelectorAll('a'); + simulant.fire(anchors[0], simulant('click')); + simulant.fire(anchors[1], simulant('click')); + assert.ok(spy.calledTwice); + }); + + it('should remove the event listeners from all the elements in a base selector', function() { + var items = document.querySelectorAll('li') + var spies = Array.prototype.map.call(items, function (li) { + return sinon.spy(li, 'removeEventListener'); + }); + + var delegations = delegate('li', 'a', 'click', function() {}); + delegations.forEach(function (delegation) { + delegation.destroy(); + }); + + spies.every(function (spy) { + var success = spy.calledOnce; + spy.restore(); + return success; + }); + }); + + it('should add event listeners to all the elements in a base array', function() { + var spy = sinon.spy(); + var items = document.querySelectorAll('li') + delegate(items, 'a', 'click', spy); + + var anchors = document.querySelectorAll('a') + simulant.fire(anchors[0], simulant('click')); + simulant.fire(anchors[1], simulant('click')); + assert.ok(spy.calledTwice); + }); + + it('should remove the event listeners from all the elements in a base array', function() { + var items = document.querySelectorAll('li') + var spies = Array.prototype.map.call(items, function (li) { + return sinon.spy(li, 'removeEventListener'); + }); + + var delegations = delegate(items, 'a', 'click', function() {}); + delegations.forEach(function (delegation) { + delegation.destroy(); + }); + + spies.every(function (spy) { + var success = spy.calledOnce; + spy.restore(); + return success; + }); + }); +}); -- cgit v1.2.3