├── .flowconfig ├── .gitignore ├── .jscsrc ├── .jsinspectrc ├── .travis.yml ├── LICENSE ├── README.md ├── package.json ├── rollup.config.js ├── src ├── index.js └── index.js.flow ├── test ├── flow │ └── dom-event-test.js ├── helper │ ├── FakeEventTarget.js │ └── observe.js ├── index-test.js └── mocha.opts └── type-definitions └── dom-event.d.ts /.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | 3 | [include] 4 | 5 | [libs] 6 | 7 | [lints] 8 | 9 | [options] 10 | suppress_comment=\\(.\\|\n\\)*\\$ExpectError 11 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .idea/ 3 | coverage/ 4 | dist/ 5 | .nyc_output/ 6 | -------------------------------------------------------------------------------- /.jscsrc: -------------------------------------------------------------------------------- 1 | { 2 | "preset": "crockford", 3 | "esnext": true, 4 | "disallowDanglingUnderscores": null, 5 | "requireMultipleVarDecl": null, 6 | "requireSemicolons": true, 7 | "requireSpacesInAnonymousFunctionExpression": false 8 | } 9 | -------------------------------------------------------------------------------- /.jsinspectrc: -------------------------------------------------------------------------------- 1 | { 2 | "threshold": 35 3 | } 4 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | sudo: false 3 | node_js: 4 | - "8" 5 | - "6" 6 | env: 7 | - CXX=g++-4.8 8 | branches: 9 | only: 10 | - master -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016 mostjs 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # most dom-event 2 | 3 | Streamlined DOM events for [@most/core](https://github.com/mostjs/core). Now you can write: 4 | 5 | ```js 6 | import { click } from '@most/dom-event'; 7 | import { tap, runEffects } from "@most/core"; 8 | import { newDefaultScheduler } from "@most/scheduler"; 9 | 10 | const clickStream = click(el); 11 | 12 | runEffects(tap(console.log, clickStream), newDefaultScheduler()); 13 | ``` 14 | 15 | ## Install 16 | 17 | `npm install --save @most/dom-event` 18 | 19 | ## API 20 | 21 | ### Events 22 | 23 | #### <eventName> :: (EventTarget t, Event e) => t → boolean=false → Stream e 24 | 25 | See [the source](src/index.js) for all the supported event names. Each has the general signature: 26 | 27 | ```js 28 | const stream = eventName(domNode, useCapture = false); 29 | ``` 30 | 31 | ### domEvent 32 | 33 | #### domEvent :: (EventTarget t, Event e) => String → t → boolean=false → Stream e 34 | 35 | If there's an event type that isn't supported, you can use the general `domEvent` API: 36 | 37 | ```js 38 | const stream = domEvent(eventName, domNode, useCapture = false); 39 | ``` 40 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@most/dom-event", 3 | "version": "2.2.0", 4 | "description": "Streamlined DOM Events for most.js", 5 | "main": "dist/index.js", 6 | "module": "dist/index.es.js", 7 | "typings": "type-definitions/dom-event.d.ts", 8 | "files": [ 9 | "dist", 10 | "type-definitions" 11 | ], 12 | "scripts": { 13 | "build": "npm run build:dist && npm run build:min && npm run build:flow", 14 | "build:dist": "rollup -c", 15 | "build:min": "uglifyjs dist/index.js -o dist/index.min.js", 16 | "build:flow": "cpy src/index.js.flow dist --rename index.js.flow", 17 | "prepublish": "npm run build", 18 | "test": "npm run test:lint && npm run test:unit && npm run test:flow", 19 | "test:unit": "nyc mocha", 20 | "test:lint": "standard --fix 'src/*.js' 'test/*.js' --verbose | snazzy", 21 | "test:flow": "flow check" 22 | }, 23 | "repository": { 24 | "type": "git", 25 | "url": "git+https://github.com/mostjs/dom-event.git" 26 | }, 27 | "keywords": [ 28 | "most", 29 | "reactive", 30 | "event", 31 | "functional", 32 | "async", 33 | "dom" 34 | ], 35 | "author": "brian@hovercraftstudios.com", 36 | "license": "MIT", 37 | "bugs": { 38 | "url": "https://github.com/mostjs/dom-event/issues" 39 | }, 40 | "homepage": "https://github.com/mostjs/dom-event#readme", 41 | "devDependencies": { 42 | "@briancavalier/assert": "^3.4.0", 43 | "@most/core": "^0.13.0", 44 | "buba": "^4.0.2", 45 | "cpy-cli": "^1.0.1", 46 | "flow-bin": "^0.55.0", 47 | "mocha": "^3.0.2", 48 | "nyc": "^11.2.1", 49 | "rollup": "^0.50.0", 50 | "rollup-plugin-buble": "0.15.0", 51 | "snazzy": "^7.0.0", 52 | "standard": "^10.0.3", 53 | "uglify-js": "^3.1.1" 54 | }, 55 | "standard": { 56 | "ignore": [ 57 | "test/flow" 58 | ] 59 | }, 60 | "dependencies": { 61 | "@most/scheduler": "^0.13.0", 62 | "@most/types": "^0.11.1" 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import buble from 'rollup-plugin-buble' 2 | import pkg from './package.json' 3 | 4 | export default { 5 | input: 'src/index.js', 6 | plugins: [ 7 | buble() 8 | ], 9 | external: ['@most/scheduler'], 10 | output: [ 11 | { 12 | file: pkg.main, 13 | format: 'umd', 14 | name: 'mostDomEvent', 15 | sourcemap: true, 16 | globals: { 17 | '@most/scheduler': 'mostScheduler' 18 | } 19 | }, 20 | { 21 | file: pkg.module, 22 | format: 'es', 23 | sourcemap: true 24 | } 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | /** @license MIT License (c) copyright 2015-2016 original author or authors */ 2 | /** @author Brian Cavalier */ 3 | import { currentTime } from '@most/scheduler' 4 | 5 | // domEvent :: (EventTarget t, Event e) => String -> t -> boolean=false -> Stream e 6 | export const domEvent = (event, node, capture = false) => 7 | new DomEvent(event, node, capture) 8 | 9 | export const blur = (node, capture = false) => domEvent('blur', node, capture) 10 | export const focus = (node, capture = false) => domEvent('focus', node, capture) 11 | export const focusin = (node, capture = false) => domEvent('focusin', node, capture) 12 | export const focusout = (node, capture = false) => domEvent('focusout', node, capture) 13 | export const click = (node, capture = false) => domEvent('click', node, capture) 14 | export const dblclick = (node, capture = false) => domEvent('dblclick', node, capture) 15 | export const mousedown = (node, capture = false) => domEvent('mousedown', node, capture) 16 | export const mouseup = (node, capture = false) => domEvent('mouseup', node, capture) 17 | export const mousemove = (node, capture = false) => domEvent('mousemove', node, capture) 18 | export const mouseover = (node, capture = false) => domEvent('mouseover', node, capture) 19 | export const mouseenter = (node, capture = false) => domEvent('mouseenter', node, capture) 20 | export const mouseout = (node, capture = false) => domEvent('mouseout', node, capture) 21 | export const mouseleave = (node, capture = false) => domEvent('mouseleave', node, capture) 22 | export const change = (node, capture = false) => domEvent('change', node, capture) 23 | export const select = (node, capture = false) => domEvent('select', node, capture) 24 | export const submit = (node, capture = false) => domEvent('submit', node, capture) 25 | export const keydown = (node, capture = false) => domEvent('keydown', node, capture) 26 | export const keypress = (node, capture = false) => domEvent('keypress', node, capture) 27 | export const keyup = (node, capture = false) => domEvent('keyup', node, capture) 28 | export const input = (node, capture = false) => domEvent('input', node, capture) 29 | export const contextmenu = (node, capture = false) => domEvent('contextmenu', node, capture) 30 | export const resize = (node, capture = false) => domEvent('resize', node, capture) 31 | export const scroll = (node, capture = false) => domEvent('scroll', node, capture) 32 | export const error = (node, capture = false) => domEvent('error', node, capture) 33 | 34 | export const hashchange = (node, capture = false) => domEvent('hashchange', node, capture) 35 | export const popstate = (node, capture = false) => domEvent('popstate', node, capture) 36 | export const load = (node, capture = false) => domEvent('load', node, capture) 37 | export const unload = (node, capture = false) => domEvent('unload', node, capture) 38 | 39 | export const pointerdown = (node, capture = false) => domEvent('pointerdown', node, capture) 40 | export const pointerup = (node, capture = false) => domEvent('pointerup', node, capture) 41 | export const pointermove = (node, capture = false) => domEvent('pointermove', node, capture) 42 | export const pointerover = (node, capture = false) => domEvent('pointerover', node, capture) 43 | export const pointerenter = (node, capture = false) => domEvent('pointerenter', node, capture) 44 | export const pointerout = (node, capture = false) => domEvent('pointerout', node, capture) 45 | export const pointerleave = (node, capture = false) => domEvent('pointerleave', node, capture) 46 | 47 | export const touchstart = (node, capture = false) => domEvent('touchstart', node, capture) 48 | export const touchend = (node, capture = false) => domEvent('touchend', node, capture) 49 | export const touchmove = (node, capture = false) => domEvent('touchmove', node, capture) 50 | export const touchcancel = (node, capture = false) => domEvent('touchcancel', node, capture) 51 | 52 | class DomEvent { 53 | constructor (event, node, capture) { 54 | this.event = event 55 | this.node = node 56 | this.capture = capture 57 | } 58 | 59 | run (sink, scheduler) { 60 | const send = e => tryEvent(currentTime(scheduler), e, sink) 61 | const dispose = () => this.node.removeEventListener(this.event, send, this.capture) 62 | 63 | this.node.addEventListener(this.event, send, this.capture) 64 | 65 | return { dispose } 66 | } 67 | } 68 | 69 | function tryEvent (t, x, sink) { 70 | try { 71 | sink.event(t, x) 72 | } catch (e) { 73 | sink.error(t, e) 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /src/index.js.flow: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import type { Stream } from "@most/types" 4 | 5 | declare export function domEvent(event: 'blur', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 6 | declare export function domEvent(event: 'focus', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 7 | declare export function domEvent(event: 'focusin', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 8 | declare export function domEvent(event: 'focusout', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 9 | declare export function domEvent(event: 'click', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 10 | declare export function domEvent(event: 'dblclick', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 11 | declare export function domEvent(event: 'mousedown', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 12 | declare export function domEvent(event: 'mouseup', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 13 | declare export function domEvent(event: 'mousemove', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 14 | declare export function domEvent(event: 'mouseover', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 15 | declare export function domEvent(event: 'mouseenter', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 16 | declare export function domEvent(event: 'mouseout', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 17 | declare export function domEvent(event: 'mouseleave', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 18 | declare export function domEvent(event: 'change', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 19 | declare export function domEvent(event: 'select', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 20 | declare export function domEvent(event: 'submit', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 21 | declare export function domEvent(event: 'keydown', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 22 | declare export function domEvent(event: 'keypress', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 23 | declare export function domEvent(event: 'keyup', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 24 | declare export function domEvent(event: 'input', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 25 | declare export function domEvent(event: 'contextmenu', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 26 | declare export function domEvent(event: 'resize', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 27 | declare export function domEvent(event: 'scroll', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 28 | declare export function domEvent(event: 'error', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 29 | 30 | declare export function domEvent(event: 'hashchange', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 31 | declare export function domEvent(event: 'popstate', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 32 | declare export function domEvent(event: 'load', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 33 | declare export function domEvent(event: 'unload', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 34 | 35 | declare export function domEvent(event: 'pointerdown', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 36 | declare export function domEvent(event: 'pointerup', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 37 | declare export function domEvent(event: 'pointermove', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 38 | declare export function domEvent(event: 'pointerover', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 39 | declare export function domEvent(event: 'pointerenter', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 40 | declare export function domEvent(event: 'pointerout', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 41 | declare export function domEvent(event: 'pointerleave', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 42 | 43 | declare export function domEvent(event: 'touchstart', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 44 | declare export function domEvent(event: 'touchend', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 45 | declare export function domEvent(event: 'touchmove', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 46 | declare export function domEvent(event: 'touchcancel', node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 47 | 48 | declare export function domEvent(event: string, node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 49 | 50 | declare export function blur(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 51 | declare export function focus(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 52 | declare export function focusin(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 53 | declare export function focusout(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 54 | declare export function click(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 55 | declare export function dblclick(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 56 | declare export function mousedown(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 57 | declare export function mouseup(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 58 | declare export function mousemove(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 59 | declare export function mouseover(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 60 | declare export function mouseenter(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 61 | declare export function mouseout(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 62 | declare export function mouseleave(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 63 | declare export function change(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 64 | declare export function select(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 65 | declare export function submit(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 66 | declare export function keydown(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 67 | declare export function keypress(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 68 | declare export function keyup(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 69 | declare export function input(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 70 | declare export function contextmenu(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 71 | declare export function resize(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 72 | declare export function scroll(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 73 | declare export function error(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 74 | 75 | declare export function hashchange(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 76 | declare export function popstate(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 77 | declare export function load(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 78 | declare export function unload(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 79 | 80 | declare export function pointerdown(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 81 | declare export function pointerup(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 82 | declare export function pointermove(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 83 | declare export function pointerover(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 84 | declare export function pointerenter(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 85 | declare export function pointerout(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 86 | declare export function pointerleave(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 87 | 88 | declare export function touchstart(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 89 | declare export function touchend(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 90 | declare export function touchmove(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 91 | declare export function touchcancel(node: EventTarget, capture?: EventListenerOptionsOrUseCapture): Stream 92 | -------------------------------------------------------------------------------- /test/flow/dom-event-test.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import { domEvent, click } from '../../src' 4 | import { observe } from '../helper/observe' 5 | 6 | const el = document.createElement('div') 7 | 8 | observe((d: Event) => {}, domEvent('any', el)) 9 | 10 | observe((d: MouseEvent) => {}, domEvent('click', el)) 11 | observe((d: MouseEvent) => {}, click(el)) 12 | -------------------------------------------------------------------------------- /test/helper/FakeEventTarget.js: -------------------------------------------------------------------------------- 1 | export default class FakeEventTarget { 2 | constructor () { 3 | this.handler = this.event = this.capture = void 0 4 | this.removedEvent = this.removedCapture = void 0 5 | } 6 | 7 | emit (x) { 8 | if (typeof this.handler !== 'function') { 9 | return 10 | } 11 | this.handler.call(void 0, x) 12 | } 13 | 14 | addEventListener (e, handler, capture) { 15 | this.event = e 16 | this.handler = handler 17 | this.capture = capture 18 | } 19 | 20 | removeEventListener (e, handler, capture) { 21 | if (handler !== this.handler) { 22 | throw new Error('unexpected handler passed to removeEventListener') 23 | } 24 | this.removedEvent = e 25 | this.removedCapture = capture 26 | this.handler = this.event = this.capture = void 0 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /test/helper/observe.js: -------------------------------------------------------------------------------- 1 | import { runEffects, tap } from '@most/core' 2 | import { newDefaultScheduler } from '@most/scheduler' 3 | 4 | export const drain = s => { 5 | return runEffects(s, newDefaultScheduler()) 6 | } 7 | 8 | export const observe = (f, s) => { 9 | return drain(tap(f, s)) 10 | } 11 | 12 | export const collect = s => { 13 | const into = [] 14 | return observe(x => into.push(x), s).then(() => into) 15 | } 16 | 17 | -------------------------------------------------------------------------------- /test/index-test.js: -------------------------------------------------------------------------------- 1 | /** @license MIT License (c) copyright 2015-2016 original author or authors */ 2 | /** @author Brian Cavalier */ 3 | 4 | import { describe, it } from 'mocha' 5 | import { take } from '@most/core' 6 | import { eq, fail } from '@briancavalier/assert' 7 | import FakeEventTarget from './helper/FakeEventTarget' 8 | import * as DOMEvent from '../src/index' 9 | import { observe, collect, drain } from './helper/observe' 10 | 11 | const verifyAddEventListener = (eventType, capture) => { 12 | const t = new FakeEventTarget() 13 | const s = DOMEvent.domEvent(eventType, t, capture) 14 | 15 | verifyAdd(eventType, capture, t, s) 16 | } 17 | 18 | const verifyAddEventListenerMethod = (eventType, capture) => { 19 | const t = new FakeEventTarget() 20 | const s = DOMEvent[eventType](t, capture) 21 | 22 | verifyAdd(eventType, capture, t, s) 23 | } 24 | 25 | const verifyAdd = (eventType, capture, t, s) => { 26 | drain(s) 27 | 28 | eq(eventType, t.event) 29 | eq(capture, t.capture) 30 | } 31 | 32 | const verifyRemoveEventListener = (eventType, capture) => { 33 | const t = new FakeEventTarget() 34 | const s = DOMEvent.domEvent(eventType, t, capture) 35 | 36 | return verifyRemove(eventType, capture, t, s) 37 | } 38 | 39 | const verifyRemoveEventListenerMethod = (eventType, capture) => { 40 | const t = new FakeEventTarget() 41 | const s = DOMEvent[eventType](t, capture) 42 | 43 | return verifyRemove(eventType, capture, t, s) 44 | } 45 | 46 | const verifyRemove = (eventType, capture, t, s) => { 47 | setTimeout(() => t.emit(1), 0) 48 | 49 | return drain(take(1, s)).then(() => { 50 | eq(eventType, t.removedEvent) 51 | eq(capture, t.removedCapture) 52 | }) 53 | } 54 | 55 | describe('domEvent', () => { 56 | it('should call addEventListener with expected parameters', () => { 57 | return verifyAddEventListener('test', true) 58 | }) 59 | 60 | it('should call addEventListener with expected parameters', () => { 61 | return verifyAddEventListener('test', false) 62 | }) 63 | 64 | it('should call addEventListener with expected parameters', () => { 65 | const t = new FakeEventTarget() 66 | const s = DOMEvent.domEvent('test', t) 67 | 68 | verifyAdd('test', false, t, s) 69 | }) 70 | 71 | it('should propagate events', () => { 72 | const t = new FakeEventTarget() 73 | const s = DOMEvent.domEvent('test', t) 74 | 75 | setTimeout(() => { 76 | t.emit(1) 77 | t.emit(2) 78 | t.emit(3) 79 | }, 0) 80 | 81 | return collect(take(3, s)) 82 | .then(eq([1, 2, 3])) 83 | }) 84 | 85 | it('should propagate errors', () => { 86 | const t = new FakeEventTarget() 87 | const s = DOMEvent.domEvent('test', t) 88 | 89 | setTimeout(() => t.emit(1), 0) 90 | 91 | const expected = new Error() 92 | return observe(_ => { throw expected }, s) 93 | .then(x => fail(false, `expected error, but got event ${x}`), eq(expected)) 94 | }) 95 | 96 | it('should call removeEventListener with expected parameters', () => { 97 | return verifyRemoveEventListener('test', true) 98 | }) 99 | 100 | it('should call removeEventListener with expected parameters', () => { 101 | return verifyRemoveEventListener('test', false) 102 | }) 103 | 104 | it('should call removeEventListener with expected parameters', () => { 105 | const t = new FakeEventTarget() 106 | const s = DOMEvent.domEvent('test', t) 107 | 108 | return verifyRemove('test', false, t, s) 109 | }) 110 | 111 | Object.keys(DOMEvent) 112 | .filter(key => key !== 'domEvent') 113 | .forEach(eventType => { 114 | describe(`${eventType}()`, () => { 115 | it('should call addEventListener with expected parameters', () => { 116 | verifyAddEventListenerMethod(eventType, true) 117 | }) 118 | 119 | it('should call addEventListener with expected parameters', () => { 120 | verifyAddEventListenerMethod(eventType, false) 121 | }) 122 | 123 | it('should call addEventListener with expected parameters', () => { 124 | const t = new FakeEventTarget() 125 | const s = DOMEvent[eventType](t) 126 | 127 | verifyAdd(eventType, false, t, s) 128 | }) 129 | 130 | it('should propagate events', () => { 131 | const t = new FakeEventTarget() 132 | const s = DOMEvent[eventType](t) 133 | 134 | setTimeout(() => { 135 | t.emit(1) 136 | t.emit(2) 137 | t.emit(3) 138 | }, 0) 139 | 140 | return collect(take(3, s)) 141 | .then(eq([1, 2, 3])) 142 | }) 143 | 144 | it('should call removeEventListener with expected parameters', () => { 145 | return verifyRemoveEventListenerMethod(eventType, true) 146 | }) 147 | 148 | it('should call removeEventListener with expected parameters', () => { 149 | return verifyRemoveEventListenerMethod(eventType, false) 150 | }) 151 | 152 | it('should call removeEventListener with expected parameters', () => { 153 | const t = new FakeEventTarget() 154 | const s = DOMEvent[eventType](t) 155 | 156 | return verifyRemove(eventType, false, t, s) 157 | }) 158 | }) 159 | }) 160 | }) 161 | -------------------------------------------------------------------------------- /test/mocha.opts: -------------------------------------------------------------------------------- 1 | --require buba/register 2 | -------------------------------------------------------------------------------- /type-definitions/dom-event.d.ts: -------------------------------------------------------------------------------- 1 | import { Stream } from "@most/types"; 2 | 3 | export function domEvent(event: E, node: Element, capture?: boolean | AddEventListenerOptions): Stream 4 | export function domEvent(event: E, node: HTMLElement, capture?: boolean | AddEventListenerOptions): Stream 5 | export function domEvent(event: E, node: SVGElement, capture?: boolean | AddEventListenerOptions): Stream 6 | export function domEvent(event: string, node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream 7 | 8 | export function blur(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 9 | export function focus(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 10 | export function focusin(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 11 | export function focusout(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 12 | export function click(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 13 | export function dblclick(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 14 | export function mousedown(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 15 | export function mouseup(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 16 | export function mousemove(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 17 | export function mouseover(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 18 | export function mouseenter(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 19 | export function mouseout(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 20 | export function mouseleave(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 21 | export function change(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 22 | export function select(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 23 | export function submit(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 24 | export function keydown(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 25 | export function keypress(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 26 | export function keyup(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 27 | export function input(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 28 | export function contextmenu(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 29 | export function resize(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 30 | export function scroll(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 31 | export function error(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 32 | 33 | export function hashchange(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 34 | export function popstate(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 35 | export function load(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 36 | export function unload(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 37 | 38 | export function pointerdown(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 39 | export function pointerup(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 40 | export function pointermove(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 41 | export function pointerover(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 42 | export function pointerenter(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 43 | export function pointerout(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 44 | export function pointerleave(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 45 | 46 | export function touchstart(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 47 | export function touchend(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 48 | export function touchmove(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 49 | export function touchcancel(node: EventTarget, capture?: boolean | AddEventListenerOptions): Stream; 50 | --------------------------------------------------------------------------------