@readium/navigator 2.2.9 → 2.3.1

package/src/protection/IframeEmbeddingDetector.ts

@@ -0,0 +1,73 @@
+export interface IframeEmbeddingDetectorOptions {
+    /** Callback when iframe embedding is detected */
+    onDetected?: (isCrossOrigin: boolean) => void;
+}
+
+export class IframeEmbeddingDetector {
+    private options: IframeEmbeddingDetectorOptions;
+    private observer?: MutationObserver;
+    private detected = false;
+
+    constructor(options: IframeEmbeddingDetectorOptions) {
+        if (!options.onDetected) {
+            throw new Error('onDetected callback is required');
+        }
+        
+        this.options = options;
+        this.setupDetection();
+    }
+
+    private isIframed(): { isEmbedded: boolean; isCrossOrigin: boolean } {
+        try {
+            // If we can access top, check if we're in an iframe
+            const isEmbedded = window.self !== window.top;
+            if (!isEmbedded) {
+                return { isEmbedded: false, isCrossOrigin: false };
+            }
+            
+            // Try to access top's location - will throw if cross-origin
+            // @ts-ignore - We know this might throw
+            const isCrossOrigin = !window.top.location.href;
+            return { isEmbedded: true, isCrossOrigin };
+        } catch (e) {
+            // If we can't access top due to same-origin policy, it's cross-origin
+            return { isEmbedded: true, isCrossOrigin: true };
+        }
+    }
+
+    private setupDetection() {
+        const { isEmbedded, isCrossOrigin } = this.isIframed();
+        if (isEmbedded) {
+            this.handleDetected(isCrossOrigin);
+            return;
+        }
+
+        // Set up a listener for future checks in case the page is embedded later
+        this.observer = new MutationObserver(() => {
+            const { isEmbedded, isCrossOrigin } = this.isIframed();
+            if (isEmbedded && !this.detected) {
+                this.handleDetected(isCrossOrigin);
+                this.observer?.disconnect(); // No need to observe further
+            }
+        });
+
+        this.observer.observe(document.documentElement, {
+            childList: true,
+            subtree: true,
+            attributes: true
+        });
+
+        window.addEventListener("unload", () => this.destroy());
+    }
+
+    private handleDetected(isCrossOrigin: boolean) {
+        this.detected = true;
+        this.options.onDetected?.(isCrossOrigin);
+    }
+
+    public destroy() {
+        this.observer?.disconnect();
+        this.observer = undefined;
+        this.detected = false;
+    }
+}

package/src/protection/NavigatorProtector.ts

@@ -0,0 +1,95 @@
+import { AutomationDetector } from "./AutomationDetector";
+import { DevToolsDetector } from "./DevToolsDetector";
+import { IframeEmbeddingDetector } from "./IframeEmbeddingDetector";
+import { PrintProtector } from "./PrintProtector";
+import { ContextMenuProtector } from "./ContextMenuProtector";
+import { ContextMenuEvent } from "@readium/navigator-html-injectables";
+import { IContentProtectionConfig } from "../Navigator";
+
+export const NAVIGATOR_SUSPICIOUS_ACTIVITY_EVENT = "readium:navigator:suspiciousActivity";
+
+export class NavigatorProtector {
+    private automationDetector?: AutomationDetector;
+    private devToolsDetector?: DevToolsDetector;
+    private iframeEmbeddingDetector?: IframeEmbeddingDetector;
+    private printProtector?: PrintProtector;
+    private contextMenuProtector?: ContextMenuProtector;
+
+    private dispatchSuspiciousActivity(type: string, detail: Record<string, unknown>) {
+        const event = new CustomEvent(NAVIGATOR_SUSPICIOUS_ACTIVITY_EVENT, {
+            detail: {
+                type,
+                timestamp: Date.now(),
+                ...detail
+            }
+        });
+        window.dispatchEvent(event);
+    }
+
+    constructor(
+        config: IContentProtectionConfig = {}
+    ) {
+        // Enable DevTools detection if explicitly enabled in config
+        if (config.monitorDevTools) {
+            this.devToolsDetector = new DevToolsDetector({
+                onDetected: () => {
+                    this.dispatchSuspiciousActivity("developer_tools", {
+                        targetFrameSrc: "",
+                        key: "",
+                        code: "",
+                        keyCode: -1,
+                        ctrlKey: false,
+                        altKey: false,
+                        shiftKey: false,
+                        metaKey: false
+                    });
+                }
+            });
+        }
+
+        // Enable automation detection if explicitly enabled in config
+        if (config.checkAutomation) {
+            this.automationDetector = new AutomationDetector({
+                onDetected: (tool: string) => {
+                    this.dispatchSuspiciousActivity("automation_detected", { tool });
+                }
+            });
+        }
+        
+        // Enable iframe embedding detection if explicitly enabled in config
+        if (config.checkIFrameEmbedding) {
+            this.iframeEmbeddingDetector = new IframeEmbeddingDetector({
+                onDetected: (isCrossOrigin: boolean) => {
+                    this.dispatchSuspiciousActivity("iframe_embedding_detected", { isCrossOrigin });
+                }
+            });
+        }
+
+        // Enable print protection if configured
+        if (config.protectPrinting?.disable) {
+            this.printProtector = new PrintProtector({
+                ...config.protectPrinting,
+                onPrintAttempt: () => {
+                    this.dispatchSuspiciousActivity("print", {});
+                }
+            });
+        }
+        
+        // Enable context menu protection if configured
+        if (config.disableContextMenu) {
+            this.contextMenuProtector = new ContextMenuProtector({
+                onContextMenuBlocked: (event: ContextMenuEvent) => {
+                    this.dispatchSuspiciousActivity("context_menu", event as unknown as Record<string, unknown>);
+                }
+            });
+        }
+    }
+
+    public destroy() {
+        this.automationDetector?.destroy();
+        this.devToolsDetector?.destroy();
+        this.iframeEmbeddingDetector?.destroy();
+        this.printProtector?.destroy();
+        this.contextMenuProtector?.destroy();
+    }
+}

package/src/protection/PrintProtector.ts

@@ -0,0 +1,58 @@
+export interface NavigatorPrintProtectionConfig {
+    disable?: boolean;
+    watermark?: string;
+    onPrintAttempt?: () => void;
+}
+
+export class PrintProtector {
+    private styleElement: HTMLStyleElement | null = null;
+    private beforePrintHandler: ((e: Event) => void) | null = null;
+    private onPrintAttempt?: () => void;
+
+    constructor(config: NavigatorPrintProtectionConfig = {}) {
+        this.onPrintAttempt = config.onPrintAttempt;
+        if (config.disable) {
+            this.setupPrintProtection(config.watermark);
+        }
+    }
+
+    private setupPrintProtection(watermark?: string) {
+        const style = document.createElement("style");
+        style.textContent = `
+            @media print {
+                body * {
+                    display: none !important;
+                }
+                body::after {
+                    content: "${watermark || 'Printing has been disabled'}";
+                    font-size: 200%;
+                    display: block;
+                    text-align: center;
+                    margin-top: 50vh;
+                    transform: translateY(-50%);
+                }
+            }
+        `;
+        document.head.appendChild(style);
+        this.styleElement = style;
+
+        this.beforePrintHandler = (e: Event) => {
+            e.preventDefault();
+            this.onPrintAttempt?.();
+            return false;
+        };
+        window.addEventListener("beforeprint", this.beforePrintHandler);
+    }
+
+    public destroy() {
+        if (this.beforePrintHandler) {
+            window.removeEventListener("beforeprint", this.beforePrintHandler);
+            this.beforePrintHandler = null;
+        }
+        
+        if (this.styleElement?.parentNode) {
+            this.styleElement.parentNode.removeChild(this.styleElement);
+            this.styleElement = null;
+        }
+    }
+}

package/src/protection/utils/WorkerConsole.ts

@@ -0,0 +1,84 @@
+let idCounter = 0;
+
+function getId(): number {
+  return ++idCounter;
+}
+
+const workerScript = `
+onmessage = function(event) {
+  var action = event.data;
+  var startTime = performance.now()
+
+  console[action.type](...action.payload);
+  postMessage({
+    id: action.id,
+    time: performance.now() - startTime
+  })
+}
+`;
+
+export type WorkerConsoleMethod<Args extends any[]> = (
+  ...args: Args
+) => Promise<{ time: number }>;
+
+export class WorkerConsole {
+  static workerScript = workerScript;
+
+  private readonly worker: Worker;
+  private readonly blobUrl: string;
+  private callbacks: Map<number, (data: { time: number }) => void> = new Map();
+
+  readonly log: WorkerConsoleMethod<Parameters<Console['log']>>;
+  readonly table: WorkerConsoleMethod<Parameters<Console['table']>>;
+  readonly clear: WorkerConsoleMethod<Parameters<Console['clear']>>;
+
+  constructor(worker: Worker, blobUrl: string) {
+    this.worker = worker;
+    this.blobUrl = blobUrl;
+
+    this.worker.onmessage = (event) => {
+      const action = event.data;
+      const id = action.id;
+      const callback = this.callbacks.get(action.id);
+      if (callback) {
+        callback({
+          time: action.time,
+        });
+        this.callbacks.delete(id);
+      }
+    };
+
+    this.log = (...args) => {
+      return this.send('log', ...args);
+    };
+    this.table = (...args) => {
+      return this.send('table', ...args);
+    };
+    this.clear = (...args) => {
+      return this.send('clear', ...args);
+    };
+  }
+
+  private async send(type: string, ...messages: any[]) {
+    const id = getId();
+    return new Promise<{ time: number }>((resolve, reject) => {
+      this.callbacks.set(id, resolve);
+
+      this.worker.postMessage({
+        id,
+        type,
+        payload: messages,
+      });
+
+      setTimeout(() => {
+        reject(new Error('timeout'));
+        this.callbacks.delete(id);
+      }, 2000);
+    });
+  }
+
+  public destroy() {
+    this.worker.terminate();
+    URL.revokeObjectURL(this.blobUrl);
+  }
+}

package/src/protection/utils/console.ts

@@ -0,0 +1,16 @@
+/**
+ * Cache console methods to prevent third-party code from hooking them
+ */
+
+function cacheConsoleMethod<K extends keyof Console>(name: K): Console[K] {
+    if (typeof window !== 'undefined' && console) {
+        return console[name];
+    }
+
+    // Fallback for non-browser environments
+    return (..._args: any[]) => {};
+}
+
+export const log = cacheConsoleMethod('log');
+export const table = cacheConsoleMethod('table');
+export const clear = cacheConsoleMethod('clear');

package/src/protection/utils/match.ts

@@ -0,0 +1,18 @@
+/**
+ * Match utilities for browser compatibility checking
+ */
+
+export interface MatchOptions {
+    includes: (() => boolean)[];
+    excludes: (() => boolean)[];
+}
+
+export function match(options: MatchOptions): boolean {
+    // Check if any exclude condition is true
+    if (options.excludes.some(condition => condition())) {
+        return false;
+    }
+    
+    // Check if any include condition is true
+    return options.includes.some(condition => condition());
+}

package/src/protection/utils/platform.ts

@@ -0,0 +1,22 @@
+/**
+ * Platform detection utilities
+ */
+
+export async function isBrave(): Promise<boolean> {
+    // Use native Brave API if available (most reliable)
+    if (typeof navigator !== 'undefined' && (navigator as any).brave && (navigator as any).brave.isBrave) {
+        try {
+            return await Promise.race([
+                (navigator as any).brave.isBrave(),
+                new Promise(resolve => setTimeout(() => resolve(false), 1000))
+            ]);
+        } catch (e) {
+            // API call failed, but we know Brave is available
+            return true;
+        }
+    }
+
+    // Fallback: only when native API doesn't exist at all
+    // If we're not sure, return false to avoid false positives
+    return false;
+}

package/src/webpub/WebPubFrameManager.ts

@@ -2,6 +2,7 @@ import { Loader, ModuleName } from "@readium/navigator-html-injectables";
 import { FrameComms } from "../epub/frame/FrameComms";
 import { ReadiumWindow } from "../../../navigator-html-injectables/types/src/helpers/dom";
 import { sML } from "../helpers";
+import { IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../Navigator";
 
 export class WebPubFrameManager {
     private frame: HTMLIFrameElement;
@@ -10,10 +11,15 @@ export class WebPubFrameManager {
     private comms: FrameComms | undefined;
     private hidden: boolean = true;
     private destroyed: boolean = false;
-
+    private readonly contentProtectionConfig: IContentProtectionConfig;
+    private readonly keyboardPeripheralsConfig: IKeyboardPeripheralsConfig;
     private currModules: ModuleName[] = [];
 
-    constructor(source: string) {
+    constructor(
+        source: string,
+        contentProtectionConfig: IContentProtectionConfig = {},
+        keyboardPeripheralsConfig: IKeyboardPeripheralsConfig = []
+    ) {
         this.frame = document.createElement("iframe");
         this.frame.classList.add("readium-navigator-iframe");
         this.frame.style.visibility = "hidden";
@@ -25,14 +31,17 @@ export class WebPubFrameManager {
         // Protect against background color bleeding
         this.frame.style.backgroundColor = "#FFFFFF";
         this.source = source;
+        
+        // Use the provided content protection config directly without overriding defaults
+        this.contentProtectionConfig = { ...contentProtectionConfig };
+        this.keyboardPeripheralsConfig = [...keyboardPeripheralsConfig];
     }
 
     async load(modules: ModuleName[] = []): Promise<Window> {
         return new Promise((res, rej) => {
-            if(this.loader) {
+            if (this.loader) {
                 const wnd = this.frame.contentWindow!;
-                // Check if currently loaded modules are equal
-                if([...this.currModules].sort().join("|") === [...modules].sort().join("|")) {
+                if ([...this.currModules].sort().join("|") === [...modules].sort().join("|")) {
                     try { res(wnd); } catch (error) {};
                     return;
                 }
@@ -57,6 +66,28 @@ export class WebPubFrameManager {
         });
     }
 
+    private applyContentProtection() {
+        if (!this.comms) this.comms!.resume();
+        
+        // Send content protection config
+        this.comms!.send("peripherals_protection", this.contentProtectionConfig);
+        
+        // Send keyboard peripherals separately
+        if (this.keyboardPeripheralsConfig && this.keyboardPeripheralsConfig.length > 0) {
+            this.comms!.send("keyboard_peripherals", this.keyboardPeripheralsConfig);
+        }
+
+        // Apply scroll protection if enabled
+        if (this.contentProtectionConfig.monitorScrollingExperimental) {
+            this.comms!.send("scroll_protection", {});
+        }
+
+        // Apply print protection if configured
+        if (this.contentProtectionConfig.protectPrinting) {
+            this.comms!.send("print_protection", this.contentProtectionConfig.protectPrinting);
+        }
+    }
+
     async destroy() {
         await this.hide();
         this.loader?.destroy();
@@ -94,6 +125,8 @@ export class WebPubFrameManager {
         return new Promise((res, _) => {
             this.comms?.send("activate", undefined, () => {
                 this.comms?.send("focus", undefined, () => {
+                    // Apply content protection synchronously
+                    this.applyContentProtection();
                     const remove = () => {
                         this.frame.style.removeProperty("visibility");
                         this.frame.style.removeProperty("aria-hidden");

package/src/webpub/WebPubFramePoolManager.ts

@@ -3,6 +3,7 @@ import { Locator, Publication } from "@readium/shared";
 import { WebPubBlobBuilder } from "./WebPubBlobBuilder";
 import { WebPubFrameManager } from "./WebPubFrameManager";
 import { Injector } from "../injection/Injector";
+import { IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../Navigator";
 
 export class WebPubFramePoolManager {
     private readonly container: HTMLElement;
@@ -14,15 +15,21 @@ export class WebPubFramePoolManager {
     private pendingUpdates: Map<string, { inPool: boolean }> = new Map();
     private currentBaseURL: string | undefined;
     private readonly injector?: Injector | null = null;
+    private readonly contentProtectionConfig: IContentProtectionConfig;
+    private readonly keyboardPeripheralsConfig: IKeyboardPeripheralsConfig;
 
     constructor(
         container: HTMLElement, 
         cssProperties?: { [key: string]: string },
-        injector?: Injector | null
+        injector?: Injector | null,
+        contentProtectionConfig: IContentProtectionConfig = {},
+        keyboardPeripheralsConfig: IKeyboardPeripheralsConfig = []
     ) {
         this.container = container;
         this.currentCssProperties = cssProperties;
         this.injector = injector;
+        this.contentProtectionConfig = contentProtectionConfig;
+        this.keyboardPeripheralsConfig = [...keyboardPeripheralsConfig];
     }
 
     async destroy() {
@@ -147,7 +154,7 @@ export class WebPubFramePoolManager {
                     this.blobs.set(href, blobURL);
                 }
 
-                const fm = new WebPubFrameManager(this.blobs.get(href)!);
+                const fm = new WebPubFrameManager(this.blobs.get(href)!, this.contentProtectionConfig, this.keyboardPeripheralsConfig);
                 if(href !== newHref) await fm.hide();
                 this.container.appendChild(fm.iframe);
                 await fm.load(modules);

package/src/webpub/WebPubNavigator.ts

@@ -2,7 +2,7 @@ import { Feature, Link, Locator, Publication, ReadingProgression, LocatorLocatio
 import { VisualNavigator, VisualNavigatorViewport, ProgressionRange } from "../Navigator";
 import { Configurable } from "../preferences/Configurable";
 import { WebPubFramePoolManager } from "./WebPubFramePoolManager";
-import { BasicTextSelection, CommsEventKey, FrameClickEvent, ModuleLibrary, ModuleName, WebPubModules } from "@readium/navigator-html-injectables";
+import { BasicTextSelection, CommsEventKey, ContextMenuEvent, FrameClickEvent, KeyboardEventData, ModuleLibrary, ModuleName, SuspiciousActivityEvent, WebPubModules } from "@readium/navigator-html-injectables";
 import * as path from "path-browserify";
 import { WebPubFrameManager } from "./WebPubFrameManager";
 
@@ -17,11 +17,16 @@ import { WebPubPreferencesEditor } from "./preferences/WebPubPreferencesEditor";
 import { Injector } from "../injection/Injector";
 import { createReadiumWebPubRules } from "../injection/webpubInjectables";
 import { IInjectablesConfig } from "../injection/Injectable";
+import { IContentProtectionConfig, IKeyboardPeripheralsConfig } from "../Navigator";
+import { NavigatorProtector, NAVIGATOR_SUSPICIOUS_ACTIVITY_EVENT } from "../protection/NavigatorProtector";
+import { KeyboardPeripherals, NAVIGATOR_KEYBOARD_PERIPHERAL_EVENT } from "../peripherals/KeyboardPeripherals";
 
 export interface WebPubNavigatorConfiguration {
     preferences: IWebPubPreferences;
     defaults: IWebPubDefaults;
     injectables?: IInjectablesConfig;
+    contentProtection?: IContentProtectionConfig;
+    keyboardPeripherals?: IKeyboardPeripheralsConfig;
 }
 
 export interface WebPubNavigatorListeners {
@@ -34,6 +39,9 @@ export interface WebPubNavigatorListeners {
     customEvent: (key: string, data: unknown) => void;
     handleLocator: (locator: Locator) => boolean;
     textSelected: (selection: BasicTextSelection) => void;
+    contentProtection: (type: string, data: SuspiciousActivityEvent) => void;
+    contextMenu: (data: ContextMenuEvent) => void;
+    peripheral: (data: KeyboardEventData) => void;
 }
 
 const defaultListeners = (listeners: WebPubNavigatorListeners): WebPubNavigatorListeners => ({
@@ -45,7 +53,10 @@ const defaultListeners = (listeners: WebPubNavigatorListeners): WebPubNavigatorL
     scroll: listeners.scroll || (() => {}),
     customEvent: listeners.customEvent || (() => {}),
     handleLocator: listeners.handleLocator || (() => false),
-    textSelected: listeners.textSelected || (() => {})
+    textSelected: listeners.textSelected || (() => {}),
+    contentProtection: listeners.contentProtection || (() => {}),
+    contextMenu: listeners.contextMenu || (() => {}),
+    peripheral: listeners.peripheral || (() => {})
 })
 
 export class WebPubNavigator extends VisualNavigator implements Configurable<WebPubSettings, WebPubPreferences> {
@@ -62,6 +73,12 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
     private _css: WebPubCSS;
     private _preferencesEditor: WebPubPreferencesEditor | null = null;
     private readonly _injector: Injector | null = null;
+    private readonly _contentProtection: IContentProtectionConfig;
+    private readonly _keyboardPeripherals: IKeyboardPeripheralsConfig;
+    private readonly _navigatorProtector: NavigatorProtector | null = null;
+    private readonly _keyboardPeripheralsManager: KeyboardPeripherals | null = null;
+    private readonly _suspiciousActivityListener: ((event: Event) => void) | null = null;
+    private readonly _keyboardPeripheralListener: ((event: Event) => void) | null = null;
     
     private webViewport: VisualNavigatorViewport = {
         readingOrder: [],
@@ -85,7 +102,7 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
         });
 
         // Combine WebPub rules with user-provided injectables
-        const webpubRules = createReadiumWebPubRules();
+        const webpubRules = createReadiumWebPubRules(pub.readingOrder.items);
         const userConfig = configuration.injectables || { rules: [], allowedDomains: [] };
         
         this._injector = new Injector({
@@ -93,8 +110,51 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
             allowedDomains: userConfig.allowedDomains
         });
 
+        // Initialize content protection with provided config or default values
+        this._contentProtection = configuration.contentProtection || {};
+        
+        // Merge keyboard peripherals
+        this._keyboardPeripherals = this.mergeKeyboardPeripherals(
+            this._contentProtection,
+            configuration.keyboardPeripherals || []
+        );
+
+        // Initialize navigator protection if any protection is configured
+        if (this._contentProtection.disableContextMenu ||
+            this._contentProtection.checkAutomation ||
+            this._contentProtection.checkIFrameEmbedding ||
+            this._contentProtection.monitorDevTools ||
+            this._contentProtection.protectPrinting?.disable) {
+            this._navigatorProtector = new NavigatorProtector(this._contentProtection);
+            
+            // Listen for custom events from NavigatorProtector
+            this._suspiciousActivityListener = (event: Event) => {
+                const { type, ...activity } = (event as CustomEvent).detail;
+                if (type === "context_menu") {
+                    this.listeners.contextMenu(activity as ContextMenuEvent);
+                } else {
+                    this.listeners.contentProtection(type, activity);
+                }
+            };
+            window.addEventListener(NAVIGATOR_SUSPICIOUS_ACTIVITY_EVENT, this._suspiciousActivityListener);
+        }
+        
+        // Initialize keyboard peripherals separately (works independently of protection)
+        if (this._keyboardPeripherals.length > 0) {
+            this._keyboardPeripheralsManager = new KeyboardPeripherals({
+                keyboardPeripherals: this._keyboardPeripherals
+            });
+            
+            // Listen for keyboard peripheral events from main window
+            this._keyboardPeripheralListener = (event: Event) => {
+                const activity = (event as CustomEvent).detail;
+                this.listeners.peripheral(activity);
+            };
+            window.addEventListener(NAVIGATOR_KEYBOARD_PERIPHERAL_EVENT, this._keyboardPeripheralListener);
+        }
+
         // Initialize current location
-        if (initialPosition && typeof initialPosition.copyWithLocations === 'function') {
+        if (initialPosition && typeof initialPosition.copyWithLocations === "function") {
             this.currentLocation = initialPosition;
             // Update currentIndex to match the initial position
             const index = this.pub.readingOrder.findIndexWithHref(initialPosition.href);
@@ -109,7 +169,13 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
     public async load() {
         await this.updateCSS(false);
         const cssProperties = this.compileCSSProperties(this._css);
-        this.framePool = new WebPubFramePoolManager(this.container, cssProperties, this._injector);
+        this.framePool = new WebPubFramePoolManager(
+            this.container, 
+            cssProperties, 
+            this._injector,
+            this._contentProtection,
+            this._keyboardPeripherals
+        );
 
         await this.apply();
     }
@@ -282,6 +348,16 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
             case "progress":
                 this.syncLocation(data as ProgressionRange);
                 break;
+            case "content_protection":
+                const activity = data as SuspiciousActivityEvent;
+                this.listeners.contentProtection(activity.type, activity);
+                break;
+            case "context_menu":
+                this.listeners.contextMenu(data as ContextMenuEvent);
+                break;
+            case "keyboard_peripherals":
+                this.listeners.peripheral(data as KeyboardEventData);
+                break;
             case "log":
                 console.log(this.framePool.currentFrames[0]?.source?.split("/")[3], ...(data as any[]));
                 break;
@@ -317,6 +393,14 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
     }
 
     public async destroy() {
+        if (this._suspiciousActivityListener) {
+            window.removeEventListener(NAVIGATOR_SUSPICIOUS_ACTIVITY_EVENT, this._suspiciousActivityListener);
+        }
+        if (this._keyboardPeripheralListener) {
+            window.removeEventListener(NAVIGATOR_KEYBOARD_PERIPHERAL_EVENT, this._keyboardPeripheralListener);
+        }
+        this._navigatorProtector?.destroy();
+        this._keyboardPeripheralsManager?.destroy();
         await this.framePool?.destroy();
     }
 
@@ -419,7 +503,7 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
 
     private async loadLocator(locator: Locator, cb: (ok: boolean) => void) {
         let done = false;
-        let cssSelector = (typeof locator.locations.getCssSelector === 'function') && locator.locations.getCssSelector();
+        let cssSelector = (typeof locator.locations.getCssSelector === "function") && locator.locations.getCssSelector();
         if(locator.text?.highlight) {
             done = await new Promise<boolean>((res, _) => {
                 // Attempt to go to a highlighted piece of text in the resource
@@ -451,7 +535,7 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
         // This sanity check has to be performed because we're still passing non-locator class
         // locator objects to this function. This is not good and should eventually be forbidden
         // or the locator should be deserialized sometime before this function.
-        const hid = (typeof locator.locations.htmlId === 'function') && locator.locations.htmlId();
+        const hid = (typeof locator.locations.htmlId === "function") && locator.locations.htmlId();
         if(hid)
             done = await new Promise<boolean>((res, _) => {
                 // Attempt to go to an HTML ID in the resource