@npo/player 1.18.4 → 1.20.0

package/README.md

@@ -7,8 +7,11 @@ The video player library for NPO (Nederlandse Publieke Omroep) and other broadca
 # Documentation
 Extensive and up-to-date documentation is available at https://docs.npoplayer.nl
 
+# Code quality
+Code quality is analysed by SonarCloud. The project can be found at https://sonarcloud.io/project/overview?id=NPOstart_npo-player
+
 # Changelog
-Current version: v1.18.0
+Current version: v1.20.0
 
 The changelog is available at https://docs.npoplayer.nl/implementation/web/changelog/
 

package/lib/js/ads/ster.js

@@ -107,6 +107,7 @@ export async function handlePreRolls(playerapi, streamObject, npoplayer) {
         playerapi.on(PlayerEvent.AdFinished, handleAdFinished);
         function handleAdBreakFinished() {
             playerapi.off(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
+            playerapi.off(PlayerEvent.AdError, handleAdBreakFinished);
             npoplayer.adBreakActive = false;
             npoplayer.uiComponents.adbutton?.hide();
             npoplayer.uiComponents.adlabel?.hide();
@@ -117,5 +118,6 @@ export async function handlePreRolls(playerapi, streamObject, npoplayer) {
             resolve();
         }
         playerapi.on(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
+        playerapi.on(PlayerEvent.AdError, handleAdBreakFinished);
     });
 }

package/lib/js/drm/handlers/decideprofile.js

@@ -12,39 +12,39 @@ export async function decideProfile(player, preferredDRM = '') {
         supportedTech = player.getSupportedTech();
         supportedDRM = await player.getSupportedDRM();
     }
-    supportedTech.forEach(function (tech) {
+    for (const tech of supportedTech) {
         if (bestWithoutDRM === '')
             bestWithoutDRM = tech.streaming;
         if (bestWithDRM !== '')
-            return;
-        if (tech.streaming === 'dash') {
-            supportedDRM.forEach(function (drm) {
+            continue;
+        if (tech.streaming === 'dash' && preferredDRM !== 'fairplay') {
+            for (const drm of supportedDRM) {
                 if (bestDRM !== '' && (preferredDRM === '' || preferredDRM.length > 0)) {
-                    return;
+                    continue;
                 }
-                if (['com.widevine.alpha'].includes(drm)) {
+                if (['com.widevine.alpha', 'com.microsoft.playready'].includes(drm) && preferredDRM === '') {
                     bestDRM = 'widevine';
                 }
-                if (['com.microsoft.playready', 'com.microsoft.playready.recommendation'].includes(drm)) {
-                    bestDRM = 'playready';
+                if (['com.apple.fps.1_0', 'com.apple.fps.2_0'].includes(drm) && preferredDRM === 'fairplay') {
+                    bestDRM = 'fairplay';
                 }
-            });
+            }
             if (bestDRM !== '')
                 bestWithDRM = 'dash';
         }
-        if (tech.streaming === 'hls') {
-            if (bestDRM !== '' && (preferredDRM === '' || bestDRM === preferredDRM)) {
-                return;
-            }
-            supportedDRM.forEach(function (drm) {
-                if (['com.apple.fps.1_0', 'com.apple.fps.2_0'].includes(drm)) {
+        if (tech.streaming === 'hls' || preferredDRM === 'fairplay') {
+            for (const drm of supportedDRM) {
+                if (bestDRM !== '' && (preferredDRM === '' || bestDRM === preferredDRM)) {
+                    continue;
+                }
+                if (['com.apple.fps.1_0', 'com.apple.fps.2_0'].includes(drm) && preferredDRM === 'fairplay') {
                     bestDRM = 'fairplay';
                 }
-            });
+            }
             if (bestDRM !== '')
                 bestWithDRM = 'hls';
         }
-    });
+    }
     if (bestWithDRM !== '')
         return { profileName: bestWithDRM, drm: bestDRM };
     return { profileName: bestWithoutDRM, drm: bestDRM };

package/lib/js/drm/handlers/decideprofile.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/drm/handlers/decideprofile.test.js

@@ -0,0 +1,33 @@
+import { decideProfile } from './decideprofile';
+jest.mock("bitmovin-player");
+describe("decideProfile", () => {
+    let mockPlayerAPI;
+    beforeEach(() => {
+        mockPlayerAPI = {
+            getSupportedTech: jest.fn().mockReturnValue([
+                { streaming: 'dash' },
+                { streaming: 'hls' },
+            ]),
+            getSupportedDRM: jest.fn().mockResolvedValue([
+                'com.widevine.alpha',
+                'com.microsoft.playready',
+                'com.apple.fps.1_0',
+            ]),
+        };
+    });
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+    it("should return empty profile when player is null", async () => {
+        const result = await decideProfile(null);
+        expect(result).toEqual({ profileName: '', drm: '' });
+    });
+    it("should return profile with dash streaming and widevine DRM", async () => {
+        const result = await decideProfile(mockPlayerAPI);
+        expect(result).toEqual({ profileName: 'dash', drm: 'widevine' });
+    });
+    it("should return profile with hls streaming and fairplay DRM", async () => {
+        const result = await decideProfile(mockPlayerAPI, 'fairplay');
+        expect(result).toEqual({ profileName: 'hls', drm: 'fairplay' });
+    });
+});

package/lib/js/fragments/removefragments.d.ts

@@ -1,3 +1,2 @@
-import { PlayerAPI } from 'bitmovin-player';
 import { UIManager } from 'bitmovin-player-ui';
-export declare function removeFragments(player: PlayerAPI, uiManager: UIManager): Promise<void>;
+export declare function removeFragments(uiManager: UIManager): void;

package/lib/js/fragments/removefragments.js

@@ -1,9 +1,5 @@
-import { PlayerEvent } from 'bitmovin-player';
-import { checkFunction, seekFunction } from './setfragments';
-export async function removeFragments(player, uiManager) {
+export function removeFragments(uiManager) {
     uiManager.getTimelineMarkers().forEach(marker => {
         uiManager.removeTimelineMarker(marker);
     });
-    player.off(PlayerEvent.TimeChanged, checkFunction());
-    player.off(PlayerEvent.Seek, seekFunction());
 }

package/lib/js/fragments/removefragments.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/fragments/removefragments.test.js

@@ -0,0 +1,26 @@
+import { removeFragments } from './removefragments';
+describe("removeFragments", () => {
+    it("should remove all timeline markers", () => {
+        const mockUIManager = {
+            getTimelineMarkers: jest.fn().mockReturnValue([
+                { id: 1, time: 10 },
+                { id: 2, time: 20 },
+                { id: 3, time: 30 },
+            ]),
+            removeTimelineMarker: jest.fn(),
+        };
+        removeFragments(mockUIManager);
+        expect(mockUIManager.removeTimelineMarker).toHaveBeenCalledTimes(3);
+        expect(mockUIManager.removeTimelineMarker).toHaveBeenCalledWith({ id: 1, time: 10 });
+        expect(mockUIManager.removeTimelineMarker).toHaveBeenCalledWith({ id: 2, time: 20 });
+        expect(mockUIManager.removeTimelineMarker).toHaveBeenCalledWith({ id: 3, time: 30 });
+    });
+    it("should not remove any timeline markers if there are none", () => {
+        const mockUIManager = {
+            getTimelineMarkers: jest.fn().mockReturnValue([]),
+            removeTimelineMarker: jest.fn(),
+        };
+        removeFragments(mockUIManager);
+        expect(mockUIManager.removeTimelineMarker).not.toHaveBeenCalled();
+    });
+});

package/lib/js/fragments/setfragments.d.ts

@@ -3,4 +3,4 @@ import { type Fragments } from '../../types/interfaces';
 import { UIManager } from 'bitmovin-player-ui';
 export declare const checkFunction: () => (e: any) => void;
 export declare const seekFunction: () => (e: any) => void;
-export declare function setFragments(player: PlayerAPI, uiManager: UIManager, fragments: Fragments): Promise<void>;
+export declare function setFragments(player: PlayerAPI, uiManager: UIManager, fragments: Fragments): void;

package/lib/js/fragments/setfragments.js

@@ -2,20 +2,25 @@ import { PlayerEvent } from 'bitmovin-player';
 import { removeFragments } from './removefragments';
 let fragment = null;
 let playerInstance = null;
+let isFinished = false;
 const setTitle = () => {
-    const element = document.querySelector('.bmpui-npo-player .bmpui-seekbar-label-title');
-    if (element !== null && element.textContent === '') {
+    const element = playerInstance?.getContainer()?.querySelector('.bmpui-npo-player .bmpui-seekbar-label-title');
+    if (element !== null && element?.textContent === '') {
         element.textContent = fragment?.title || '';
     }
 };
 export const checkFunction = () => (e) => {
     if (!fragment || !playerInstance)
         return;
-    if (e.time > fragment.end) {
+    playerInstance.off(PlayerEvent.TimeChanged, checkFunction());
+    if (e.time > fragment.end && !isFinished) {
+        isFinished = true;
         playerInstance.seek(Math.max(fragment.start, fragment.end));
         playerInstance.pause();
+        playerInstance?.getContainer().querySelector('.bmpui-npo-player')?.classList.add('bmpui-player-state-replay');
     }
-    else if (e.time < fragment.start) {
+    else if (e.time < fragment.start || (e.time > fragment.end && isFinished)) {
+        isFinished = false;
         playerInstance.seek(fragment.start);
     }
     setTitle();
@@ -23,13 +28,14 @@ export const checkFunction = () => (e) => {
 export const seekFunction = () => (e) => {
     if (!fragment || !playerInstance)
         return;
+    playerInstance.off(PlayerEvent.Seek, seekFunction());
     const seekTarget = e.seekTarget ? e.seekTarget : e.to.time;
     if (seekTarget > fragment.end || seekTarget < fragment.start) {
         playerInstance.seek(Math.max(fragment.start, Math.min(fragment.end, seekTarget)));
     }
     setTitle();
 };
-export async function setFragments(player, uiManager, fragments) {
+export function setFragments(player, uiManager, fragments) {
     fragment = fragments.sections[0] || null;
     playerInstance = player;
     const unplayableClass = 'seekbar-marker-unplayable';
@@ -37,12 +43,16 @@ export async function setFragments(player, uiManager, fragments) {
         if (!fragment)
             return;
         player.seek(fragment.start);
-        if (player.isPaused())
+        if (player.isPaused() && playerInstance?.getConfig().playback?.autoplay === true) {
             void player.play();
+        }
     };
     const addMarkers = () => {
         if (!fragment)
             return;
+        playerInstance?.off(PlayerEvent.Ready, addMarkers);
+        removeFragments(uiManager);
+        setTitle();
         const timelineMarkers = [
             {
                 time: 0,
@@ -61,12 +71,8 @@ export async function setFragments(player, uiManager, fragments) {
             uiManager.addTimelineMarker(marker);
         });
         playFragmentFromStart();
-        player.on(PlayerEvent.TimeChanged, checkFunction());
-        player.on(PlayerEvent.Seek, seekFunction());
+        playerInstance?.on(PlayerEvent.TimeChanged, checkFunction());
+        playerInstance?.on(PlayerEvent.Seek, seekFunction());
     };
-    player.off(PlayerEvent.TimeChanged, checkFunction());
-    player.off(PlayerEvent.Seek, seekFunction());
-    await removeFragments(player, uiManager);
-    addMarkers();
-    setTitle();
+    playerInstance?.on(PlayerEvent.Ready, addMarkers);
 }

package/lib/js/fragments/setfragments.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/fragments/setfragments.test.js

@@ -0,0 +1,72 @@
+import { setFragments } from './setfragments';
+import { PlayerEvent } from 'bitmovin-player';
+const SEEKBAR_MARKER_UNPLAYABLE = 'seekbar-marker-unplayable';
+describe("setFragments", () => {
+    let mockPlayer;
+    let mockUIManager;
+    let fragments;
+    beforeEach(() => {
+        jest.clearAllMocks();
+        mockPlayer = {
+            seek: jest.fn(),
+            isPaused: jest.fn().mockReturnValue(true),
+            play: jest.fn(),
+            pause: jest.fn(),
+            off: jest.fn(),
+            on: jest.fn().mockImplementation((event, handler) => {
+                if (event === PlayerEvent.Ready) {
+                    handler();
+                }
+            }),
+            getContainer: jest.fn().mockReturnValue({
+                querySelector: jest.fn().mockReturnValue({
+                    textContent: '',
+                    classList: {
+                        add: jest.fn()
+                    }
+                })
+            }),
+            getConfig: jest.fn().mockReturnValue({
+                playback: {
+                    autoplay: true
+                }
+            })
+        };
+        mockUIManager = {
+            addTimelineMarker: jest.fn(),
+            getTimelineMarkers: jest.fn().mockReturnValue([]),
+            removeTimelineMarker: jest.fn()
+        };
+        fragments = {
+            sections: [
+                {
+                    start: 10,
+                    end: 20,
+                    title: 'Test Fragment',
+                    cssClasses: [SEEKBAR_MARKER_UNPLAYABLE]
+                }
+            ]
+        };
+    });
+    it("should set fragments correctly and handle autoplay", async () => {
+        setFragments(mockPlayer, mockUIManager, fragments);
+        expect(mockPlayer.seek).toHaveBeenCalledWith(fragments.sections[0].start);
+        expect(mockPlayer.play).toHaveBeenCalled();
+        expect(mockUIManager.addTimelineMarker).toHaveBeenCalledTimes(2);
+    });
+    it("should correctly set the title of the fragment", async () => {
+        setFragments(mockPlayer, mockUIManager, fragments);
+        expect(mockUIManager.addTimelineMarker).toHaveBeenCalledWith({
+            time: 0,
+            title: "Niet beschikbaar",
+            cssClasses: [SEEKBAR_MARKER_UNPLAYABLE],
+            duration: 10
+        });
+        expect(mockUIManager.addTimelineMarker).toHaveBeenCalledWith({
+            time: 20,
+            duration: 10000000,
+            title: "Niet beschikbaar",
+            cssClasses: [SEEKBAR_MARKER_UNPLAYABLE],
+        });
+    });
+});

package/lib/js/playeractions/handlers/handleoffsets.js

@@ -6,12 +6,15 @@ export function handleStartOffset(player, offset) {
         }
         return;
     }
-    player.on(PlayerEvent.SourceLoaded, () => {
+    const seek = () => {
+        player.off(PlayerEvent.SourceLoaded, seek);
+        player.off(PlayerEvent.AdBreakFinished, seek);
+        player.off(PlayerEvent.AdError, seek);
         player.seek(offset);
-    });
-    player.on(PlayerEvent.AdBreakFinished, () => {
-        player.seek(offset);
-    });
+    };
+    player.on(PlayerEvent.SourceLoaded, seek);
+    player.on(PlayerEvent.AdBreakFinished, seek);
+    player.on(PlayerEvent.AdError, seek);
 }
 export function shiftToProgramStart(player, timestamp) {
     if (player == null)

package/lib/js/playeractions/handlers/processsourceconfig.js

@@ -36,13 +36,19 @@ function setDrm(sourceConfig, drm, _streamObject) {
             };
             break;
         case 'widevine':
-            sourceConfig.drm = {
-                widevine: {
-                    LA_URL: npoDrmGateway + _streamObject.stream.drmToken,
-                    audioRobustness: 'SW_SECURE_CRYPTO',
-                    videoRobustness: 'SW_SECURE_CRYPTO'
-                }
-            };
+            fetch('https://npo-drm-gateway.samgcloud.nepworldwide.nl/widevine_player_cert.bin')
+                .then(response => response.arrayBuffer())
+                .then(certificate => {
+                sourceConfig.drm = {
+                    widevine: {
+                        serverCertificate: certificate,
+                        LA_URL: npoDrmGateway + _streamObject.stream.drmToken,
+                        audioRobustness: 'SW_SECURE_CRYPTO',
+                        videoRobustness: 'SW_SECURE_CRYPTO'
+                    }
+                };
+            })
+                .catch(error => console.error('Error:', error));
             break;
         case 'playready':
             sourceConfig.drm = {

package/lib/js/playeractions/handlers/removereplayclass.d.ts

@@ -0,0 +1,2 @@
+import { PlayerAPI } from 'bitmovin-player';
+export declare function removeReplayClass(player: PlayerAPI | null): void;

package/lib/js/playeractions/handlers/removereplayclass.js

@@ -0,0 +1,11 @@
+import { PlayerEvent } from 'bitmovin-player';
+export function removeReplayClass(player) {
+    if (!player)
+        return;
+    player.off(PlayerEvent.Seek, () => {
+        removeReplayClass(player);
+    });
+    const playerContainer = player.getContainer();
+    playerContainer.classList.remove('bmpui-player-state-finished');
+    playerContainer.classList.remove('bmpui-player-state-replay');
+}

package/lib/js/playeractions/handlers/removereplayclass.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/playeractions/handlers/removereplayclass.test.js

@@ -0,0 +1,28 @@
+import { removeReplayClass } from './removereplayclass';
+import { PlayerEvent } from 'bitmovin-player';
+describe('removeReplayClass', () => {
+    let mockPlayer;
+    let mockPlayerContainer;
+    beforeEach(() => {
+        jest.clearAllMocks();
+        mockPlayerContainer = document.createElement('div');
+        mockPlayerContainer.classList.add('bmpui-player-state-finished', 'bmpui-player-state-replay');
+        mockPlayer = {
+            off: jest.fn(),
+            getContainer: jest.fn().mockReturnValue(mockPlayerContainer),
+        };
+    });
+    it('should remove "bmpui-player-state-finished" and "bmpui-player-state-replay" classes from the player container', () => {
+        removeReplayClass(mockPlayer);
+        expect(mockPlayerContainer.classList.contains('bmpui-player-state-finished')).toBe(false);
+        expect(mockPlayerContainer.classList.contains('bmpui-player-state-replay')).toBe(false);
+    });
+    it('should unregister the Seek event listener', () => {
+        removeReplayClass(mockPlayer);
+        expect(mockPlayer.off).toHaveBeenCalledWith(PlayerEvent.Seek, expect.any(Function));
+    });
+    it('should not unregister the Seek event listener if the player is null', () => {
+        removeReplayClass(null);
+        expect(mockPlayer.off).not.toHaveBeenCalled();
+    });
+});

package/lib/js/playeractions/handlers/resolvekeypress.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/playeractions/handlers/resolvekeypress.test.js

@@ -0,0 +1,80 @@
+import { resolveKeyPress } from './resolvekeypress';
+import { ViewMode } from 'bitmovin-player';
+import { mockNpoPlayer } from '../../../../tests/mocks/mockNpoplayer';
+describe('resolveKeyPress', () => {
+    let mockPlayer;
+    let mockNpoplayer = mockNpoPlayer;
+    let e;
+    beforeEach(() => {
+        jest.clearAllMocks();
+        mockPlayer = {
+            seek: jest.fn(),
+            isPaused: jest.fn().mockReturnValue(true),
+            play: jest.fn(),
+            pause: jest.fn(),
+            isMuted: jest.fn(),
+            unmute: jest.fn(),
+            getViewMode: jest.fn(),
+            setViewMode: jest.fn(),
+            getContainer: jest.fn().mockReturnValue({
+                querySelector: jest.fn().mockReturnValue({
+                    textContent: '',
+                    classList: {
+                        add: jest.fn()
+                    }
+                })
+            }),
+            getConfig: jest.fn().mockReturnValue({
+                playback: {
+                    autoplay: true
+                }
+            })
+        };
+        e = new KeyboardEvent('keydown');
+    });
+    it('should mute/unmute the player when "KeyM" is pressed', () => {
+        mockPlayer.isMuted.mockReturnValue(true);
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'KeyM' });
+        expect(mockPlayer.unmute).toHaveBeenCalled();
+    });
+    it('should enter/exit fullscreen mode when "KeyF" is pressed', () => {
+        mockPlayer.getViewMode.mockReturnValue(ViewMode.Inline);
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'KeyF' });
+        expect(mockPlayer.setViewMode).toHaveBeenCalledWith(ViewMode.Fullscreen);
+    });
+    it('should play/pause the player when "Space" is pressed', () => {
+        mockPlayer.isPaused.mockReturnValue(true);
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'Space' });
+        expect(mockPlayer.play).toHaveBeenCalled();
+    });
+    it('should increase the volume when "ArrowUp" is pressed', () => {
+        mockPlayer.isMuted.mockReturnValue(true);
+        mockNpoplayer.increaseVolume = jest.fn();
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'ArrowUp' });
+        expect(mockPlayer.unmute).toHaveBeenCalled();
+        expect(mockNpoplayer.increaseVolume).toHaveBeenCalled();
+    });
+    it('should decrease the volume when "ArrowDown" is pressed', () => {
+        mockPlayer.isMuted.mockReturnValue(true);
+        mockNpoplayer.decreaseVolume = jest.fn();
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'ArrowDown' });
+        expect(mockPlayer.unmute).toHaveBeenCalled();
+        expect(mockNpoplayer.decreaseVolume).toHaveBeenCalled();
+    });
+    it('should go backwards when "ArrowLeft" is pressed', () => {
+        mockNpoplayer.goBackwards = jest.fn();
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'ArrowLeft' });
+        expect(mockNpoplayer.goBackwards).toHaveBeenCalledWith(10);
+    });
+    it('should go forward when "ArrowRight" is pressed', () => {
+        mockNpoplayer.goForward = jest.fn();
+        resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'ArrowRight' });
+        expect(mockNpoplayer.goForward).toHaveBeenCalledWith(10);
+    });
+    it('should hide the settings panel when "Escape" is pressed', () => {
+        if (mockNpoplayer.uiComponents.settingsPanel) {
+            resolveKeyPress(mockPlayer, mockNpoplayer, { ...e, code: 'Escape' });
+            expect(mockNpoplayer.uiComponents.settingsPanel.hide).toHaveBeenCalled();
+        }
+    });
+});

package/lib/js/tracking/handlers/eventlogging.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/js/tracking/handlers/eventlogging.test.js

@@ -0,0 +1,46 @@
+import { logEvent } from './eventlogging';
+import { mockNpoPlayer } from '../../../../tests/mocks/mockNpoplayer';
+describe('logEvent', () => {
+    let npoplayer;
+    beforeEach(() => {
+        npoplayer = mockNpoPlayer;
+    });
+    it('should not log event if player is not available', () => {
+        npoplayer.player = null;
+        if (npoplayer.streamTracker && npoplayer.player) {
+            logEvent(npoplayer, 'start');
+            expect(npoplayer.streamTracker.start).not.toHaveBeenCalled();
+            expect(npoplayer.logEmitter.emit).not.toHaveBeenCalled();
+        }
+    });
+    it('should not log event if streamTracker is not available', () => {
+        npoplayer.streamTracker = null;
+        if (npoplayer.streamTracker) {
+            logEvent(npoplayer, 'start');
+            expect(npoplayer.logEmitter.emit).not.toHaveBeenCalled();
+        }
+    });
+    it('should not log event if adBreakActive is true', () => {
+        npoplayer.adBreakActive = true;
+        if (npoplayer.streamTracker) {
+            logEvent(npoplayer, 'start');
+            expect(npoplayer.streamTracker.start).not.toHaveBeenCalled();
+            expect(npoplayer.logEmitter.emit).not.toHaveBeenCalled();
+        }
+    });
+    it('should log event and call the corresponding streamTracker handler', () => {
+        if (npoplayer.streamTracker) {
+            logEvent(npoplayer, 'start');
+            expect(npoplayer.streamTracker.start).toHaveBeenCalledWith({ stream_position: 10 });
+            expect(npoplayer.logEmitter.emit).toHaveBeenCalledWith('logEvent', 'start');
+        }
+    });
+    it('should log event and call the seek streamTracker handler with data', () => {
+        const data = { position: 20 };
+        if (npoplayer.streamTracker) {
+            logEvent(npoplayer, 'seek', data);
+            expect(npoplayer.streamTracker.seek).toHaveBeenCalledWith(data);
+            expect(npoplayer.logEmitter.emit).toHaveBeenCalledWith('logEvent', 'seek');
+        }
+    });
+});

package/lib/js/ui/components/controlbar.js

@@ -12,8 +12,9 @@ export function createControlBar(npoplayer, settingsPanel) {
         hidden: true
     });
     player?.on(PlayerEvent.CastAvailable, () => {
-        if (player.isCastAvailable())
+        if (player.isCastAvailable()) {
             chromeCastButton.show();
+        }
     });
     const controlbar = new ControlBar({
         components: [

package/lib/js/ui/components/nativemobile/buttons.js

@@ -124,7 +124,6 @@ export function createPlaybackToggleButton() {
     const playbackClickHandler = () => {
         if (!customPlayerbackToggleButton)
             return;
-        console.log('TOGGLE_PLAY_PAUSE', !customPlayerbackToggleButton.isOn());
         sendCustomMessage(CustomMessages.TOGGLE_PLAY_PAUSE, { isChecked: !customPlayerbackToggleButton.isOn() });
     };
     customPlayerbackToggleButton.onClick.unsubscribe(() => {

package/lib/js/ui/components/settingspanel.js

@@ -133,6 +133,7 @@ export function createSettingsPanel(npoplayer) {
     const checkSubtitles = () => {
         player?.off(PlayerEvent.SourceLoaded, checkSubtitles);
         player?.off(PlayerEvent.AdBreakFinished, checkSubtitles);
+        player?.off(PlayerEvent.AdError, checkSubtitles);
         const subtitles = player?.subtitles?.list();
         if (subtitles != null && subtitles.length > 0) {
             subtitlesPanelItem.show();
@@ -144,6 +145,7 @@ export function createSettingsPanel(npoplayer) {
     const checkQuality = () => {
         player?.off(PlayerEvent.SourceLoaded, checkQuality);
         player?.off(PlayerEvent.AdBreakFinished, checkQuality);
+        player?.off(PlayerEvent.AdError, checkQuality);
         if (player?.getAvailableVideoQualities() !== undefined && player?.getAvailableVideoQualities().length > 0) {
             qualityPanelItem.show();
         }
@@ -155,5 +157,7 @@ export function createSettingsPanel(npoplayer) {
     player?.on(PlayerEvent.SourceLoaded, checkQuality);
     player?.on(PlayerEvent.AdBreakFinished, checkSubtitles);
     player?.on(PlayerEvent.AdBreakFinished, checkQuality);
+    player?.on(PlayerEvent.AdError, checkSubtitles);
+    player?.on(PlayerEvent.AdError, checkQuality);
     return settingsPanel;
 }

package/lib/js/ui/handlers/listboxhandlers.js

@@ -9,6 +9,7 @@ export function handleSubtitleListBoxItemSelected(subtitleSettingsOpenButton, se
         e.getItems().forEach((item) => {
             if (item.key === e.getSelectedItem()) {
                 subtitleSettingsOpenButton.setText(item.label);
+                e.selectItem(item.key);
             }
         });
         closeSettingsPanel(settingsPanel, mainSettingsPage);

package/lib/js/ui/handlers/nicamhandler.d.ts

@@ -1,3 +1,6 @@
+import { PlayerAPI } from 'bitmovin-player';
+import { UIManager } from 'bitmovin-player-ui';
 import { StreamObject, StreamOptions } from 'types/interfaces';
 export declare function processNicam(streamObject: StreamObject, nicamElement: HTMLElement | null, streamOptions: StreamOptions | null): void;
 export declare function addNicamIcon(character: string, nicamElement: Element): void;
+export declare function showNicamAfterUiDelay(player: PlayerAPI, uiManager: UIManager | null): void;