From 2f34122acea2e4ae31b2f641ed26fd55f5c6de36 Mon Sep 17 00:00:00 2001 From: Matthieu Riegler Date: Mon, 28 Aug 2023 21:02:11 +0200 Subject: [PATCH] feat(platform-browser): expose `EventManagerPlugin` in the public API. (#49969) The exposed type of the `EVENT_MANAGER_PLUGINS` token should be in the public API. PR Close #49969 --- goldens/public-api/platform-browser/index.md | 9 +++++++++ .../src/dom/events/event_manager.ts | 17 ++++++++++++++++- .../src/dom/events/hammer_gestures.ts | 2 +- .../src/dom/events/key_events.ts | 9 +-------- .../platform-browser/src/platform-browser.ts | 2 +- packages/platform-server/src/server_events.ts | 11 +++++++---- 6 files changed, 35 insertions(+), 15 deletions(-) diff --git a/goldens/public-api/platform-browser/index.md b/goldens/public-api/platform-browser/index.md index afebeb180139a..2dd2d47dceb8f 100644 --- a/goldens/public-api/platform-browser/index.md +++ b/goldens/public-api/platform-browser/index.md @@ -92,6 +92,15 @@ export class EventManager { static ɵprov: i0.ɵɵInjectableDeclaration; } +// @public +export abstract class EventManagerPlugin { + constructor(_doc: any); + abstract addEventListener(element: HTMLElement, eventName: string, handler: Function): Function; + // (undocumented) + manager: EventManager; + abstract supports(eventName: string): boolean; +} + // @public export const HAMMER_GESTURE_CONFIG: InjectionToken; diff --git a/packages/platform-browser/src/dom/events/event_manager.ts b/packages/platform-browser/src/dom/events/event_manager.ts index 2168be63ac4ab..1d425c7bb9f2c 100644 --- a/packages/platform-browser/src/dom/events/event_manager.ts +++ b/packages/platform-browser/src/dom/events/event_manager.ts @@ -12,7 +12,7 @@ import {Inject, Injectable, InjectionToken, NgZone, ɵRuntimeError as RuntimeErr import {RuntimeErrorCode} from '../../errors'; /** - * The injection token for the event-manager plug-in service. + * The injection token for plugins of the `EventManager` service. * * @publicApi */ @@ -82,13 +82,28 @@ export class EventManager { } } +/** + * The plugin definition for the `EventManager` class + * + * It can be used as a base class to create custom manager plugins, i.e. you can create your own + * class that extends the `EventManagerPlugin` one. + * + * @publicApi + */ export abstract class EventManagerPlugin { + // TODO: remove (has some usage in G3) constructor(private _doc: any) {} // Using non-null assertion because it's set by EventManager's constructor manager!: EventManager; + /** + * Should return `true` for every event name that should be supported by this plugin + */ abstract supports(eventName: string): boolean; + /** + * Implement the behaviour for the supported events + */ abstract addEventListener(element: HTMLElement, eventName: string, handler: Function): Function; } diff --git a/packages/platform-browser/src/dom/events/hammer_gestures.ts b/packages/platform-browser/src/dom/events/hammer_gestures.ts index 5e2fed395031a..fe4f6e4cf2788 100644 --- a/packages/platform-browser/src/dom/events/hammer_gestures.ts +++ b/packages/platform-browser/src/dom/events/hammer_gestures.ts @@ -272,7 +272,7 @@ export class HammerGesturesPlugin extends EventManagerPlugin { * HammerJS to detect gesture events. * * Note that applications still need to include the HammerJS script itself. This module - * simply sets up the coordination layer between HammerJS and Angular's EventManager. + * simply sets up the coordination layer between HammerJS and Angular's `EventManager`. * * @publicApi */ diff --git a/packages/platform-browser/src/dom/events/key_events.ts b/packages/platform-browser/src/dom/events/key_events.ts index f9810ab893d67..8381b6b5fca6e 100644 --- a/packages/platform-browser/src/dom/events/key_events.ts +++ b/packages/platform-browser/src/dom/events/key_events.ts @@ -45,7 +45,6 @@ const MODIFIER_KEY_GETTERS: {[key: string]: (event: KeyboardEvent) => boolean} = }; /** - * @publicApi * A browser plug-in that provides support for handling of key events in Angular. */ @Injectable() @@ -188,12 +187,6 @@ export class KeyEventsPlugin extends EventManagerPlugin { /** @internal */ static _normalizeKey(keyName: string): string { - // TODO: switch to a Map if the mapping grows too much - switch (keyName) { - case 'esc': - return 'escape'; - default: - return keyName; - } + return keyName === 'esc' ? 'escape' : keyName; } } diff --git a/packages/platform-browser/src/platform-browser.ts b/packages/platform-browser/src/platform-browser.ts index 29691fe244d4c..d1a0ad8e689bc 100644 --- a/packages/platform-browser/src/platform-browser.ts +++ b/packages/platform-browser/src/platform-browser.ts @@ -75,7 +75,7 @@ export {Title} from './browser/title'; export {disableDebugTools, enableDebugTools} from './browser/tools/tools'; export {By} from './dom/debug/by'; export {REMOVE_STYLES_ON_COMPONENT_DESTROY} from './dom/dom_renderer'; -export {EVENT_MANAGER_PLUGINS, EventManager} from './dom/events/event_manager'; +export {EVENT_MANAGER_PLUGINS, EventManager, EventManagerPlugin} from './dom/events/event_manager'; export {HAMMER_GESTURE_CONFIG, HAMMER_LOADER, HammerGestureConfig, HammerLoader, HammerModule} from './dom/events/hammer_gestures'; export {DomSanitizer, SafeHtml, SafeResourceUrl, SafeScript, SafeStyle, SafeUrl, SafeValue} from './security/dom_sanitization_service'; export {HydrationFeature, provideClientHydration, HydrationFeatureKind, withNoDomReuse, withNoHttpTransferCache} from './hydration'; diff --git a/packages/platform-server/src/server_events.ts b/packages/platform-server/src/server_events.ts index ea66012b0ed29..cc92ade976d83 100644 --- a/packages/platform-server/src/server_events.ts +++ b/packages/platform-server/src/server_events.ts @@ -8,17 +8,20 @@ import {DOCUMENT, ɵgetDOM as getDOM} from '@angular/common'; import {Inject, Injectable} from '@angular/core'; +import {EventManagerPlugin} from '@angular/platform-browser'; @Injectable() -export class ServerEventManagerPlugin /* extends EventManagerPlugin which is private */ { - constructor(@Inject(DOCUMENT) private doc: any) {} +export class ServerEventManagerPlugin extends EventManagerPlugin { + constructor(@Inject(DOCUMENT) private doc: any) { + super(doc); + } // Handle all events on the server. - supports(eventName: string) { + override supports(eventName: string) { return true; } - addEventListener(element: HTMLElement, eventName: string, handler: Function): Function { + override addEventListener(element: HTMLElement, eventName: string, handler: Function): Function { return getDOM().onAndCancel(element, eventName, handler); } }