@internetarchive/bookreader 5.0.0-8 → 5.0.0-80

package/tests/jest/BookReader/Mode2Up.test.js

@@ -0,0 +1,98 @@
+
+import sinon from 'sinon';
+import { Mode2Up } from '@/src/BookReader/Mode2Up.js';
+import BookReader from '@/src/BookReader.js';
+import { BookModel } from '@/src/BookReader/BookModel.js';
+import { afterEventLoop } from '../utils';
+/** @typedef {import('@/src/BookReader/options.js').BookReaderOptions} BookReaderOptions */
+
+beforeAll(() => {
+  global.alert = jest.fn();
+});
+afterEach(() => {
+  jest.restoreAllMocks();
+  sinon.restore();
+});
+
+/** @type {BookReaderOptions['data']} */
+const SAMPLE_DATA = [
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image0.jpg', pageNum: '1' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image1.jpg', pageNum: '2' },
+    { width: 123, height: 123, uri: 'https://archive.org/image2.jpg', pageNum: '3' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image3.jpg', pageNum: '4' },
+    { width: 123, height: 123, uri: 'https://archive.org/image4.jpg', pageNum: '5' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image5.jpg', pageNum: '6' },
+  ],
+];
+
+
+describe('Mode2Up', () => {
+  /** @type {BookReader} */
+  let br;
+  /** @type {BookModel} */
+  let bookModel;
+  /** @type {Mode2Up} */
+  let mode2Up;
+
+  beforeEach(() => {
+    br = new BookReader({
+      data: SAMPLE_DATA,
+      el: document.createElement('div'),
+    });
+    br.init();
+    bookModel = new BookModel(br);
+    mode2Up = new Mode2Up(br, bookModel);
+  });
+
+  describe('prepare', () => {
+    it('initializes DOM properly', async () => {
+      const spyAppend = sinon.spy(br.refs.$brContainer, 'append');
+      const spyRequestUpdate = sinon.spy(mode2Up.mode2UpLit, 'requestUpdate');
+      const initFirstRenderSpy = sinon.spy(mode2Up.mode2UpLit, 'initFirstRender');
+      const jumpToIndexSpy = sinon.spy(mode2Up.mode2UpLit, 'jumpToIndex');
+      sinon.stub(mode2Up.mode2UpLit, 'updateComplete').get(() => Promise.resolve());
+      mode2Up.prepare();
+
+      expect(br.refs.$brContainer[0].style.overflow).toEqual('hidden');
+      expect(spyAppend.calledWith(mode2Up.$el)).toBe(true);
+      expect(mode2Up.mode2UpLit.style.opacity).toEqual('0');
+
+      await afterEventLoop();
+
+      expect(initFirstRenderSpy.called).toBe(true);
+      expect(jumpToIndexSpy.called).toBe(false);
+      expect(mode2Up.everShown).toBe(true);
+      expect(spyRequestUpdate.called).toBe(true);
+      expect(mode2Up.mode2UpLit.style.opacity).toEqual('1');
+    });
+  });
+
+  describe('resizePageView', () => {
+    it('updates autoFit when possible', async () => {
+      const updateClientSizesSpy = sinon.stub(mode2Up.mode2UpLit.htmlDimensionsCacher, 'updateClientSizes');
+      const resizeViaAutofitSpy = sinon.spy(mode2Up.mode2UpLit, 'resizeViaAutofit');
+      const recenterStub = sinon.stub(mode2Up.mode2UpLit, 'recenter');
+
+      mode2Up.resizePageView();
+      expect(updateClientSizesSpy.called).toBe(true);
+      expect(resizeViaAutofitSpy.called).toBe(true);
+      expect(recenterStub.called).toBe(true);
+
+      // Test with scale and autoFit as 'none'
+      mode2Up.mode2UpLit.scale = 0.1;
+      mode2Up.mode2UpLit.autoFit = 'none';
+      mode2Up.resizePageView();
+
+      expect(mode2Up.mode2UpLit.autoFit).toEqual('auto');
+      expect(resizeViaAutofitSpy.callCount).toEqual(2);
+      expect(recenterStub.callCount).toEqual(2);
+    });
+  });
+});

package/tests/jest/BookReader/Mode2UpLit.test.js

@@ -0,0 +1,190 @@
+import sinon from "sinon";
+import { BookModel } from "@/src/BookReader/BookModel.js";
+import { Mode2UpLit } from "@/src/BookReader/Mode2UpLit.js";
+
+/** @type {import('@/src/BookReader/options.js').BookReaderOptions['data']} */
+const SAMPLE_DATA = [
+  [
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image0.jpg",
+      pageNum: "1",
+    },
+  ],
+  [
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image1.jpg",
+      pageNum: "2",
+    },
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image2.jpg",
+      pageNum: "3",
+    },
+  ],
+  [
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image3.jpg",
+      pageNum: "4",
+    },
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image4.jpg",
+      pageNum: "5",
+    },
+  ],
+  [
+    {
+      width: 123,
+      height: 123,
+      uri: "https://archive.org/image5.jpg",
+      pageNum: "6",
+    },
+  ],
+];
+
+function make_dummy_br(overrides = {}) {
+  return Object.assign({
+    updateFirstIndex() {},
+    _components: {
+      navbar: {
+        updateNavIndexThrottled() {},
+      },
+    },
+    data: [],
+  }, overrides);
+}
+
+afterEach(() => {
+  sinon.restore();
+});
+
+describe("computePageHeight", () => {
+  test("Always returns the median", () => {
+    const mode = new Mode2UpLit({
+      getMedianPageSizeInches: () => ({ width: 100, height: 200 }),
+    }, null);
+    expect(mode.computePageHeight(null)).toEqual(200);
+    expect(mode.computePageHeight({ widthInches: 300, heightInches: 400 }))
+      .toEqual(200);
+  });
+});
+
+describe("computePageWidth", () => {
+  test("returns relative to pageHeight", () => {
+    const mode = new Mode2UpLit(null, null);
+    sinon.stub(mode, "computePageHeight").returns(6);
+
+    expect(mode.computePageWidth({ widthInches: 2, heightInches: 6 })).toEqual(
+      2,
+    );
+    expect(mode.computePageWidth({ widthInches: 3, heightInches: 6 })).toEqual(
+      3,
+    );
+    expect(mode.computePageWidth({ widthInches: 2, heightInches: 4 })).toEqual(
+      2 * 6 / 4,
+    );
+  });
+});
+
+describe("computePositions", () => {
+  const LEFT_COVER_EXPECTED = {
+    leafEdgesLeftStart: -0.246,
+    leafEdgesLeftMainWidth: 0,
+    leafEdgesLeftMovingStart: -0.246,
+    leafEdgesLeftMovingWidth: 0,
+    leafEdgesLeftEnd: -0.246,
+    leafEdgesLeftFullWidth: 0,
+    pageLeftStart: -0.246,
+    pageLeftWidth: 0.246,
+    pageLeftEnd: 0,
+    gutter: 0,
+    pageRightStart: 0,
+    pageRightWidth: 0.246,
+    pageRightEnd: 0.246,
+    leafEdgesRightStart: 0.246,
+    leafEdgesRightMovingWidth: 0,
+    leafEdgesRightMainStart: 0.246,
+    leafEdgesRightMainWidth: 0.006,
+    leafEdgesRightEnd: 0.252,
+    leafEdgesRightFullWidth: 0.006,
+    spreadWidth: 0.492,
+    bookWidth: 0.498
+  };
+  const SPREAD_EXPECTED = {
+    leafEdgesLeftStart: -0.246,
+    leafEdgesLeftMainWidth: 0.002,
+    leafEdgesLeftMovingStart: -0.244,
+    leafEdgesLeftMovingWidth: 0,
+    leafEdgesLeftEnd: -0.244,
+    leafEdgesLeftFullWidth: 0.002,
+    pageLeftStart: -0.244,
+    pageLeftWidth: 0.246,
+    pageLeftEnd: 0.002,
+    gutter: 0.002,
+    pageRightStart: 0.002,
+    pageRightWidth: 0.246,
+    pageRightEnd: 0.248,
+    leafEdgesRightStart: 0.248,
+    leafEdgesRightMovingWidth: 0,
+    leafEdgesRightMainStart: 0.248,
+    leafEdgesRightMainWidth: 0.004,
+    leafEdgesRightEnd: 0.252,
+    leafEdgesRightFullWidth: 0.004,
+    spreadWidth: 0.492,
+    bookWidth: 0.498
+  };
+  const RIGHT_COVER_EXPECTED = {
+    leafEdgesLeftStart: -0.242,
+    leafEdgesLeftMainWidth: 0.006,
+    leafEdgesLeftMovingStart: -0.236,
+    leafEdgesLeftMovingWidth: 0,
+    leafEdgesLeftEnd: -0.236,
+    leafEdgesLeftFullWidth: 0.006,
+    pageLeftStart: -0.236,
+    pageLeftWidth: 0.246,
+    pageLeftEnd: 0.01,
+    gutter: 0.01,
+    pageRightStart: 0.01,
+    pageRightWidth: 0,
+    pageRightEnd: 0.01,
+    leafEdgesRightStart: 0.01,
+    leafEdgesRightMovingWidth: 0,
+    leafEdgesRightMainStart: 0.01,
+    leafEdgesRightMainWidth: 0,
+    leafEdgesRightEnd: 0.01,
+    leafEdgesRightFullWidth: 0,
+    spreadWidth: 0.246,
+    bookWidth: 0.252
+  };
+
+  test("left cover page", () => {
+    const br = make_dummy_br({ data: SAMPLE_DATA });
+    const book = new BookModel(br);
+    const mode = new Mode2UpLit(book, br);
+    expect(mode.computePositions(null, book.getPage(0))).toEqual(LEFT_COVER_EXPECTED);
+  });
+
+  test("spread", () => {
+    const br = make_dummy_br({ data: SAMPLE_DATA });
+    const book = new BookModel(br);
+    const mode = new Mode2UpLit(book, br);
+
+    expect(mode.computePositions(book.getPage(1), book.getPage(2))).toEqual(SPREAD_EXPECTED);
+  });
+
+  test("right cover page", () => {
+    const br = make_dummy_br({ data: SAMPLE_DATA });
+    const book = new BookModel(br);
+    const mode = new Mode2UpLit(book, br);
+
+    expect(mode.computePositions(book.getPage(-1), null)).toEqual(RIGHT_COVER_EXPECTED);
+  });
+});

package/tests/jest/BookReader/ModeCoordinateSpace.test.js

@@ -0,0 +1,16 @@
+import { ModeCoordinateSpace } from "@/src/BookReader/ModeCoordinateSpace";
+
+describe("worldUnitsToRenderedPixels", () => {
+  test("0 case", () => {
+    const mcs = new ModeCoordinateSpace({ scale: 1 });
+    expect(mcs.worldUnitsToRenderedPixels(0)).toBe(0);
+  });
+
+  test("Misc cases", () => {
+    const mcs = new ModeCoordinateSpace({ scale: 1 });
+    mcs.screenDPI = 100;
+    expect(mcs.worldUnitsToRenderedPixels(1)).toBe(100);
+    mcs.screenDPI = 78;
+    expect(mcs.worldUnitsToRenderedPixels(1)).toBe(78);
+  });
+});

package/tests/jest/BookReader/ModeSmoothZoom.test.js

@@ -0,0 +1,218 @@
+import sinon from 'sinon';
+import interact from 'interactjs';
+import { EventTargetSpy, afterEventLoop } from '../utils.js';
+import { ModeSmoothZoom, TouchesMonitor } from '@/src/BookReader/ModeSmoothZoom.js';
+/** @typedef {import('@/src/BookReader/ModeSmoothZoom.js').SmoothZoomable} SmoothZoomable */
+
+/**
+ * @param {Partial<SmoothZoomable>} overrides
+ * @returns {SmoothZoomable}
+ */
+function dummy_mode(overrides = {}) {
+  return {
+    $container: document.createElement('div'),
+    $visibleWorld: document.createElement('div'),
+    scale: 1,
+    htmlDimensionsCacher: {
+      clientWidth: 100,
+      clientHeight: 100,
+      boundingClientRect: { left: 0, top: 0 },
+    },
+    scaleCenter: {x: 0.5, y: 0.5},
+    ...overrides
+  };
+}
+
+afterEach(() => {
+  sinon.restore();
+  try {
+    interact.removeDocument(document);
+  } catch (e) {}
+});
+
+describe('ModeSmoothZoom', () => {
+  test('handle iOS-only gesture events', () => {
+    const mode = dummy_mode();
+    const msz = new ModeSmoothZoom(mode);
+    sinon.stub(msz, '_pinchStart');
+    sinon.stub(msz, '_pinchMove');
+    sinon.stub(msz, '_pinchEnd');
+
+    msz.attach();
+
+    const gesturestart = new Event('gesturestart', {});
+    mode.$container.dispatchEvent(gesturestart);
+    expect(msz._pinchStart.callCount).toBe(1);
+  });
+
+  test('sets will-change', async () => {
+    const mode = dummy_mode();
+    const msz = new ModeSmoothZoom(mode);
+    msz.attach();
+    expect(mode.$visibleWorld.style.willChange).toBeFalsy();
+    msz._pinchStart();
+    expect(mode.$visibleWorld.style.willChange).toBe('transform');
+    await msz._pinchEnd();
+    expect(mode.$visibleWorld.style.willChange).toBe('auto');
+  });
+
+  test('pinch move updates scale', () => {
+    const mode = dummy_mode();
+    const msz = new ModeSmoothZoom(mode);
+    msz.attach();
+    // disable buffering
+    msz.bufferFn = (callback) => callback();
+    msz._pinchStart();
+    expect(mode.scale).toBe(1);
+    msz._pinchMove({ scale: 2, center: { x: 0, y: 0 }});
+    expect(mode.scale).toBe(2);
+  });
+
+  test('updateScaleCenter sets scaleCenter in unitless coordinates', () => {
+    const mode = dummy_mode({
+      htmlDimensionsCacher: {
+        clientWidth: 200,
+        clientHeight: 100,
+        boundingClientRect: {
+          left: 5,
+          top: 50
+        }
+      }
+    });
+    const msz = new ModeSmoothZoom(mode);
+    expect(msz.scaleCenter).toEqual({ x: 0.5, y: 0.5 });
+    msz.updateScaleCenter({ clientX: 85, clientY: 110 });
+    expect(msz.scaleCenter).toEqual({ x: 0.4, y: 0.6 });
+  });
+
+  test('detaches all listeners', async () => {
+    const mode = dummy_mode();
+    const msz = new ModeSmoothZoom(mode);
+
+    const documentEventSpy = EventTargetSpy.wrap(document);
+    const containerEventSpy = EventTargetSpy.wrap(mode.$container);
+    const visibleWorldSpy = EventTargetSpy.wrap(mode.$visibleWorld);
+
+    msz.attach();
+    await afterEventLoop();
+    expect(documentEventSpy._totalListenerCount).toBeGreaterThan(0);
+    expect(containerEventSpy._totalListenerCount).toBeGreaterThan(0);
+
+    msz.detach();
+    expect(documentEventSpy._totalListenerCount).toBe(0);
+    expect(containerEventSpy._totalListenerCount).toBe(0);
+    expect(visibleWorldSpy._totalListenerCount).toBe(0);
+  });
+
+  test('attach can be called twice without double attachments', () => {
+    const mode = dummy_mode();
+    const msz = new ModeSmoothZoom(mode);
+
+    const documentEventSpy = EventTargetSpy.wrap(document);
+    const containerEventSpy = EventTargetSpy.wrap(mode.$container);
+    const visibleWorldSpy = EventTargetSpy.wrap(mode.$visibleWorld);
+
+    msz.attach();
+    const documentListenersCount = documentEventSpy._totalListenerCount;
+    const containerListenersCount = containerEventSpy._totalListenerCount;
+    const visibleWorldListenersCount = visibleWorldSpy._totalListenerCount;
+
+    msz.attach();
+    expect(documentEventSpy._totalListenerCount).toBe(documentListenersCount);
+    expect(containerEventSpy._totalListenerCount).toBe(containerListenersCount);
+    expect(visibleWorldSpy._totalListenerCount).toBe(visibleWorldListenersCount);
+  });
+
+  describe('_handleCtrlWheel', () => {
+    test('non-ctrl wheel events ignored', () => {
+      const mode = dummy_mode();
+      const msz = new ModeSmoothZoom(mode);
+      expect(mode.scale).toBe(1);
+      const ev = new WheelEvent('wheel', { ctrlKey: false, deltaY: 20 });
+      const preventDefaultSpy = sinon.spy(ev, 'preventDefault');
+      msz._handleCtrlWheel(ev);
+      expect(preventDefaultSpy.callCount).toBe(0);
+      expect(mode.scale).toBe(1);
+    });
+
+    test('ctrl-wheel events update scale', () => {
+      const mode = dummy_mode();
+      const msz = new ModeSmoothZoom(mode);
+      expect(mode.scale).toBe(1);
+      const ev = new WheelEvent('wheel', { ctrlKey: true, deltaY: 20 });
+      const preventDefaultSpy = sinon.spy(ev, 'preventDefault');
+      msz._handleCtrlWheel(ev);
+      expect(preventDefaultSpy.callCount).toBe(1);
+      expect(mode.scale).not.toBe(1);
+    });
+  });
+
+  describe("updateViewportOnZoom", () => {
+    test("adjusts scroll position when zooming in", () => {
+      const mode = dummy_mode();
+      const msz = new ModeSmoothZoom(mode);
+      mode.$container.scrollTop = 100;
+      mode.$container.scrollLeft = 100;
+
+      msz.updateViewportOnZoom(2, 1);
+
+      expect(mode.$container.scrollTop).toBeGreaterThan(100);
+      expect(mode.$container.scrollLeft).toBeGreaterThan(100);
+    });
+
+    test("updates scroll position when zooming out", () => {
+      const mode = dummy_mode();
+      const msz = new ModeSmoothZoom(mode);
+      mode.$container.scrollTop = 100;
+      mode.$container.scrollLeft = 100;
+
+      msz.updateViewportOnZoom(0.5, 1);
+
+      expect(mode.$container.scrollTop).toBeLessThan(100);
+      expect(mode.$container.scrollLeft).toBeLessThan(100);
+    });
+  });
+});
+
+
+describe("TouchesMonitor", () => {
+  /** @type {HTMLElement} */
+  let container;
+  /** @type {TouchesMonitor} */
+  let monitor;
+
+  beforeEach(() => {
+    container = document.createElement("div");
+    monitor = new TouchesMonitor(container);
+  });
+
+  afterEach(() => {
+    monitor.detach();
+  });
+
+  test("should start with 0 touches", () => {
+    expect(monitor.touches).toBe(0);
+  });
+
+  test("should update touch count on touch events", () => {
+    monitor.attach();
+    container.dispatchEvent(new TouchEvent("touchstart", { touches: [{}] }));
+    expect(monitor.touches).toBe(1);
+
+    container.dispatchEvent(new TouchEvent("touchstart", { touches: [{}, {}] }));
+    expect(monitor.touches).toBe(2);
+
+    container.dispatchEvent(new TouchEvent("touchend", { touches: [{}] }));
+    expect(monitor.touches).toBe(1);
+
+    container.dispatchEvent(new TouchEvent("touchend", { touches: [] }));
+  });
+
+  test("should detach all listeners", () => {
+    const spy = EventTargetSpy.wrap(container);
+    monitor.attach();
+    expect(spy._totalListenerCount).toBeGreaterThan(0);
+    monitor.detach();
+    expect(spy._totalListenerCount).toBe(0);
+  });
+});

package/tests/jest/BookReader/ModeThumb.test.js

@@ -0,0 +1,71 @@
+
+import sinon from 'sinon';
+import BookReader from '@/src/BookReader.js';
+/** @typedef {import('@/src/BookReader/options.js').BookReaderOptions} BookReaderOptions */
+
+beforeAll(() => {
+  global.alert = jest.fn();
+});
+afterEach(() => {
+  jest.restoreAllMocks();
+  sinon.restore();
+});
+
+/** @type {BookReaderOptions['data']} */
+const SAMPLE_DATA = [
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image0.jpg', pageNum: '1' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image1.jpg', pageNum: '2' },
+    { width: 123, height: 123, uri: 'https://archive.org/image2.jpg', pageNum: '3' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image3.jpg', pageNum: '4' },
+    { width: 123, height: 123, uri: 'https://archive.org/image4.jpg', pageNum: '5' },
+  ],
+  [
+    { width: 123, height: 123, uri: 'https://archive.org/image5.jpg', pageNum: '6' },
+  ],
+];
+
+describe('zoom', () => {
+  const br = new BookReader({ data: SAMPLE_DATA });
+  br.init();
+
+  test('initializes with default columns', () => {
+    expect(br.thumbColumns).toBe(br.options.thumbColumns);
+  });
+
+  test('removes column and redraws zooming in', () => {
+    const prepare = sinon.spy(br._modes.modeThumb, 'prepare');
+    const startColumns = br.thumbColumns;
+    br._modes.modeThumb.zoom('in');
+    expect(br.thumbColumns).toBe(startColumns - 1);
+    expect(prepare.callCount).toBe(1);
+  });
+
+  test('adds column and redraws zooming out', () => {
+    const prepare = sinon.spy(br._modes.modeThumb, 'prepare');
+    const startColumns = br.thumbColumns;
+    br._modes.modeThumb.zoom('out');
+    expect(br.thumbColumns).toBe(startColumns + 1);
+    expect(prepare.callCount).toBe(1);
+  });
+
+  test('keeps columns and no redraw at zooming in limit', () => {
+    const prepare = sinon.spy(br._modes.modeThumb, 'prepare');
+    br.thumbColumns = br.options.thumbMinZoomColumns;
+    br._modes.modeThumb.zoom('in');
+    expect(br.thumbColumns).toBe(br.options.thumbMinZoomColumns);
+    expect(prepare.callCount).toBe(0);
+  });
+
+  test('keeps columns and no redraw at zooming out limit', () => {
+    const prepare = sinon.spy(br._modes.modeThumb, 'prepare');
+    br.thumbColumns = br.options.thumbMaxZoomColumns;
+    br._modes.modeThumb.zoom('out');
+    expect(br.thumbColumns).toBe(br.options.thumbMaxZoomColumns);
+    expect(prepare.callCount).toBe(0);
+  });
+});

package/tests/{BookReader → jest/BookReader}/Navbar/Navbar.test.js

@@ -1,19 +1,19 @@
 import sinon from 'sinon';
-import { getNavPageNumHtml } from '../../../src/BookReader/Navbar/Navbar.js';
-import BookReader from '../../../src/BookReader.js';
+import { getNavPageNumHtml } from '@/src/BookReader/Navbar/Navbar.js';
+import BookReader from '@/src/BookReader.js';
 
 describe('getNavPageNumHtml', () => {
   const f = getNavPageNumHtml;
   test('handle n-prefixed page numbers', () => {
-    expect(f(3, 40, 'n3', '', 40)).toBe('Page (4 of 40)');
+    expect(f(3, 40, 'n3', '', 40)).toBe('(4 of 40)');
   });
 
   test('handle regular page numbers', () => {
-    expect(f(3, 40, '14', '', 40)).toBe('Page 14 of 40');
+    expect(f(3, 40, '14', '', 40)).toBe('14 of 40');
   });
 
   test('handle no max page', () => {
-    expect(f(3, 40, '14', '', null)).toBe('Page 14');
+    expect(f(3, 40, '14', '', null)).toBe('14');
   });
 });
 
@@ -63,14 +63,14 @@ describe('Navbar slider', () => {
 
   test('on slide change, actual page changes', () => {
     const $slider = navbar.$root.find('.BRpager');
-    const jumpToIndexSpy = sinon.spy(br, 'jumpToIndex');
+    const jumpToIndexStub = sinon.stub(br, 'jumpToIndex');
     expect(br.currentIndex()).toBe(0);
 
     $slider.trigger('slidechange', { value: 3 });
 
     expect(navbar.$root.find('.BRcurrentpage').text().includes('3'));
-    expect(jumpToIndexSpy.callCount).toBe(1);
-    expect(jumpToIndexSpy.args[0][0]).toBe(3);
+    expect(jumpToIndexStub.callCount).toBe(1);
+    expect(jumpToIndexStub.args[0][0]).toBe(3);
   });
 });
 
@@ -97,9 +97,9 @@ describe('Navbar controls overrides', () => {
     const $viewMode = navbar.$root.find('.viewmode');
 
     expect($viewMode.find('.icon-thumb').length).toBe(1);
-    $viewMode.click();
+    $viewMode.trigger("click");
     expect($viewMode.find('.icon-twopg').length).toBe(1);
-    $viewMode.click();
+    $viewMode.trigger("click");
     expect($viewMode.find('.icon-thumb').length).toBe(1);
   });