Drop support for selectors and arrays as "base" (#45)

fregante · Apr 25, 2023 · 5b5138b · 5b5138b
1 parent a13cd0e
commit 5b5138b
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 124 deletions.
diff --git a/delegate.test.ts b/delegate.test.ts
@@ -34,81 +34,6 @@ test('should not add an event listener of the controller has already aborted', (
 	expect(spy).toHaveBeenCalledTimes(0);
 });
 
-test('should add event listeners to all the elements in a base selector', () => {
-	const spy = vi.fn();
-	delegate('li', 'a', 'click', spy);
-
-	const anchors = document.querySelectorAll('a');
-	anchors[0].click();
-	anchors[1].click();
-	expect(spy).toHaveBeenCalledTimes(2);
-});
-
-test('should remove the event listeners from all the elements in a base selector', () => {
-	const spy = vi.fn();
-	const controller = new AbortController();
-	delegate('li', 'a', 'click', spy, {signal: controller.signal});
-	controller.abort();
-
-	for (const anchor of document.querySelectorAll('a')) {
-		anchor.click();
-	}
-
-	expect(spy).toHaveBeenCalledTimes(0);
-});
-
-test('should pass an AbortSignal to the event listeners on all the elements in a base selector', () => {
-	const spy = vi.fn();
-	const controller = new AbortController();
-	delegate('li', 'a', 'click', spy, {signal: controller.signal});
-	controller.abort();
-
-	for (const anchor of document.querySelectorAll('a')) {
-		anchor.click();
-	}
-
-	expect(spy).toHaveBeenCalledTimes(0);
-});
-
-test('should add event listeners to all the elements in a base array', () => {
-	const spy = vi.fn();
-	const items = document.querySelectorAll('li');
-	delegate(items, 'a', 'click', spy);
-
-	const anchors = document.querySelectorAll('a');
-	anchors[0].click();
-	anchors[1].click();
-	expect(spy).toHaveBeenCalledTimes(2);
-});
-
-test('should remove the event listeners from all the elements in a base array', () => {
-	const spy = vi.fn();
-	const items = document.querySelectorAll('li');
-	const controller = new AbortController();
-	delegate(items, 'a', 'click', spy, {signal: controller.signal});
-	controller.abort();
-
-	for (const anchor of document.querySelectorAll('a')) {
-		anchor.click();
-	}
-
-	expect(spy).toHaveBeenCalledTimes(0);
-});
-
-test('should pass an AbortSignal to the event listeners on all the elements in a base array', () => {
-	const spy = vi.fn();
-	const items = document.querySelectorAll('li');
-	const controller = new AbortController();
-	delegate(items, 'a', 'click', spy, {signal: controller.signal});
-	controller.abort();
-
-	for (const anchor of document.querySelectorAll('a')) {
-		anchor.click();
-	}
-
-	expect(spy).toHaveBeenCalledTimes(0);
-});
-
 test('should not fire when the selector matches an ancestor of the base element', () => {
 	const spy = vi.fn();
 	delegate(container, 'body', 'click', spy);

diff --git a/delegate.ts b/delegate.ts
@@ -29,7 +29,7 @@ WeakMap<DelegateEventHandler, Set<string>>
 
 function editLedger(
 	wanted: boolean,
-	baseElement: EventTarget | Document,
+	baseElement: EventTarget,
 	callback: DelegateEventHandler<any, any>,
 	setup: string,
 ): boolean {
@@ -55,12 +55,6 @@ function editLedger(
 	return existed && wanted;
 }
 
-function isEventTarget(
-	elements: EventTarget | Document | Iterable<Element> | string,
-): elements is EventTarget {
-	return typeof (elements as EventTarget).addEventListener === 'function';
-}
-
 function safeClosest(event: Event, selector: string): Element | void {
 	let target = event.target;
 	if (target instanceof Text) {
@@ -85,7 +79,7 @@ function delegate<
 	TElement extends Element = ParseSelector<Selector, HTMLElement>,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: Selector,
 	type: TEventType,
 	callback: DelegateEventHandler<GlobalEventHandlersEventMap[TEventType], TElement>,
@@ -96,7 +90,7 @@ function delegate<
 	TElement extends Element = HTMLElement,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: string,
 	type: TEventType,
 	callback: DelegateEventHandler<GlobalEventHandlersEventMap[TEventType], TElement>,
@@ -108,7 +102,7 @@ function delegate<
 	TElement extends Element,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: string,
 	type: TEventType,
 	callback: DelegateEventHandler<GlobalEventHandlersEventMap[TEventType], TElement>,
@@ -122,20 +116,6 @@ function delegate<
 		return;
 	}
 
-	// Handle Selector-based usage
-	if (typeof base === 'string') {
-		base = document.querySelectorAll(base);
-	}
-
-	// Handle Array-like based usage
-	if (!isEventTarget(base)) {
-		for (const element of base) {
-			delegate(element, selector, type, callback, listenerOptions);
-		}
-
-		return;
-	}
-
 	// Don't pass `once` to `addEventListener` because it needs to be handled in `delegate-it`
 	const {once, ...nativeListenerOptions} = listenerOptions;
 

diff --git a/one-event.ts b/one-event.ts
@@ -14,7 +14,7 @@ async function oneEvent<
 	TElement extends Element = ParseSelector<Selector, HTMLElement>,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: Selector,
 	type: TEventType,
 	options?: DelegateOptions
@@ -24,7 +24,7 @@ async function oneEvent<
 	TElement extends Element = HTMLElement,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: string,
 	type: TEventType,
 	options?: DelegateOptions
@@ -35,7 +35,7 @@ async function oneEvent<
 	TElement extends Element,
 	TEventType extends EventType = EventType,
 >(
-	base: EventTarget | Document | Iterable<Element> | string,
+	base: EventTarget,
 	selector: string,
 	type: TEventType,
 	options?: DelegateOptions,

diff --git a/readme.md b/readme.md
@@ -32,36 +32,20 @@ import delegate from 'delegate-it';
 #### With an element as base
 
 ```js
-delegate(document.body, '.btn', 'click', event => {
-	console.log(event.delegateTarget);
-});
-```
-
-#### With a selector (of existing elements) as base
-
-```js
-delegate('.container', '.btn', 'click', event => {
-	console.log(event.delegateTarget);
-});
-```
-
-#### With an array/array-like of elements as base
-
-```js
-delegate(document.querySelectorAll('.container'), '.btn', 'click', event => {
+delegate(document, '.btn', 'click', event => {
 	console.log(event.delegateTarget);
 });
 ```
 
 #### With listener options
 
 ```js
-delegate(document.body, '.btn', 'click', event => {
+delegate(document, '.btn', 'click', event => {
 	console.log(event.delegateTarget);
 }, true);
 
 // Or equivalent:
-delegate(document.body, '.btn', 'click', event => {
+delegate(document, '.btn', 'click', event => {
 	console.log(event.delegateTarget);
 }, {
 	capture: true
@@ -72,7 +56,7 @@ delegate(document.body, '.btn', 'click', event => {
 
 ```js
 const controller = new AbortController();
-delegate(document.body, '.btn', 'click', event => {
+delegate(document, '.btn', 'click', event => {
 	console.log(event.delegateTarget);
 }, {
 	signal: controller.signal,
@@ -84,7 +68,7 @@ controller.abort();
 #### Listen to one event only
 
 ```js
-delegate(document.body, '.btn', 'click', event => {
+delegate(document, '.btn', 'click', event => {
 	console.log('This will only be called once');
 }, {
 	once: true
@@ -96,7 +80,7 @@ delegate(document.body, '.btn', 'click', event => {
 ```js
 import {oneEvent} from 'delegate-it';
 
-await oneEvent(document.body, '.btn', 'click');
+await oneEvent(document, '.btn', 'click');
 console.log('The body was clicked');
 ```