@internetarchive/bookreader 5.0.0-9 → 5.0.0-90

package/tests/jest/plugins/url/UrlPlugin.test.js

@@ -0,0 +1,198 @@
+import { UrlPlugin } from '@/src/plugins/url/UrlPlugin';
+
+afterEach(() => {
+  jest.clearAllMocks();
+});
+
+describe('UrlPlugin tests', () => {
+  const urlPlugin = new UrlPlugin();
+
+  describe('urlStateToUrlString tests', () => {
+    test('urlStateToUrlString with known states in schema', () => {
+      const urlState = { page: 'n7', mode: '1up', search: 'foo' };
+      const urlStateWithQueries = { page: 'n7', mode: '1up', q: 'hello', view: 'theater', sort: 'title_asc' };
+
+      const expectedUrlFromState = 'page/n7/mode/1up?q=foo';
+      const expectedUrlFromStateWithQueries = 'page/n7/mode/1up?q=hello&view=theater&sort=title_asc';
+
+      expect(urlPlugin.urlStateToUrlString(urlState)).toBe(expectedUrlFromState);
+      expect(urlPlugin.urlStateToUrlString(urlStateWithQueries)).toBe(expectedUrlFromStateWithQueries);
+    });
+
+    test('encodes page number', () => {
+      expect(urlPlugin.urlStateToUrlString({ page: '12/46' })).toBe(`page/12%2F46`);
+    });
+
+    test('urlStateToUrlString with unknown states in schema', () => {
+      const urlState = { page: 'n7', mode: '1up' };
+      const urlStateWithQueries = { page: 'n7', mode: '1up', q: 'hello', viewer: 'theater', sortBy: 'title_asc' };
+
+      const expectedUrlFromState = 'page/n7/mode/1up';
+      const expectedUrlFromStateWithQueries = 'page/n7/mode/1up?q=hello&viewer=theater&sortBy=title_asc';
+
+      expect(urlPlugin.urlStateToUrlString(urlState)).toBe(expectedUrlFromState);
+      expect(urlPlugin.urlStateToUrlString(urlStateWithQueries)).toBe(expectedUrlFromStateWithQueries);
+    });
+
+    test('urlStateToUrlString with boolean value', () => {
+      const urlState = { page: 'n7', mode: '1up', search: 'foo', view: 'theater', wrapper: 'false' };
+      const expectedUrlFromState = 'page/n7/mode/1up?q=foo&view=theater&wrapper=false';
+
+      expect(urlPlugin.urlStateToUrlString(urlState)).toBe(expectedUrlFromState);
+    });
+  });
+
+  describe('urlStringToUrlState tests', () => {
+    test('urlStringToUrlState without query string', () => {
+      const url = '/page/n7/mode/2up';
+      const url1 = '/page/n7/mode/1up';
+
+      expect(urlPlugin.urlStringToUrlState(url)).toEqual({page: 'n7', mode: '2up'});
+      expect(urlPlugin.urlStringToUrlState(url1)).toEqual({page: 'n7', mode: '1up'});
+    });
+
+    test('decodes page number', () => {
+      expect(urlPlugin.urlStringToUrlState('/page/12%2F46')).toStrictEqual({ page: '12/46' });
+    });
+
+    test('urlStringToUrlState with deprecated_for', () => {
+      const url = '/page/n7/mode/2up/search/hello';
+
+      expect(urlPlugin.urlStringToUrlState(url)).toEqual({page: 'n7', mode: '2up', q: 'hello'});
+    });
+
+    test('urlStringToUrlState with query string', () => {
+      const url = '/page/n7/mode/2up/search/hello?view=theather&foo=bar&sort=title_asc';
+      const url1 = '/mode/2up?ref=ol&ui=embed&wrapper=false&view=theater';
+
+      expect(urlPlugin.urlStringToUrlState(url)).toEqual(
+        {page: 'n7', mode: '2up', q: 'hello', view: 'theather', foo: 'bar', sort: 'title_asc'},
+      );
+      expect(urlPlugin.urlStringToUrlState(url1)).toEqual(
+        {mode: '2up', ref: 'ol', ui: 'embed', wrapper: 'false', view: 'theater'},
+      );
+    });
+
+    test('urlStringToUrlState compare search and ?q', () => {
+      const url = '/page/n7/mode/2up/search/hello';
+      urlPlugin.urlState = { q: 'hello' };
+
+      expect(urlPlugin.urlStringToUrlState(url)).toEqual({page: 'n7', mode: '2up', q: 'hello'});
+    });
+  });
+
+  describe('url plugin helper functions', () => {
+    test('setUrlParam', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.setUrlParam('page', '20');
+      urlPlugin.setUrlParam('mode', '2up');
+
+      expect(urlPlugin.urlState).toEqual({page: '20', mode: '2up'});
+    });
+
+    test('removeUrlParam', () => {
+      urlPlugin.setUrlParam('page', '20');
+      urlPlugin.setUrlParam('mode', '2up');
+      urlPlugin.removeUrlParam('mode');
+
+      expect(urlPlugin.urlState).toEqual({page: '20'});
+    });
+
+    test('getUrlParam', () => {
+      urlPlugin.setUrlParam('page', '20');
+      urlPlugin.setUrlParam('mode', '2up');
+      expect(urlPlugin.getUrlParam('page')).toEqual('20');
+      expect(urlPlugin.getUrlParam('mode')).toEqual('2up');
+    });
+  });
+
+  describe('pullFromAddressBar and pushToAddressBar - hash mode', () => {
+    test('url first load - empty state', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlMode = 'hash';
+
+      urlPlugin.pullFromAddressBar({ pathname: '', search: '', hash: '#' });
+      expect(urlPlugin.urlState).toEqual({});
+
+      urlPlugin.pushToAddressBar();
+      expect(window.location.hash).toEqual('');
+    });
+
+    test('url without mode state value - use default', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlMode = 'hash';
+
+      urlPlugin.pullFromAddressBar({ pathname: '', search: '', hash: '#page/12' });
+      expect(urlPlugin.urlState).toEqual({page: '12'});
+
+      urlPlugin.pushToAddressBar();
+      expect(window.location.hash).toEqual('#page/12');
+    });
+
+    test('url with query param', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlMode = 'hash';
+
+      urlPlugin.pullFromAddressBar({ pathname: '', search: '', hash: '#page/12?q=hello&view=theater' });
+      expect(urlPlugin.urlState).toEqual({page: '12', q: 'hello', view: 'theater'});
+
+      urlPlugin.pushToAddressBar();
+      expect(window.location.hash).toEqual('#page/12?q=hello&view=theater');
+    });
+  });
+
+  describe('pullFromAddressBar and pushToAddressBar - history mode', () => {
+    test('url first load - empty state', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlHistoryBasePath = '/details/foo';
+      urlPlugin.urlMode = 'history';
+
+      urlPlugin.pullFromAddressBar({ pathname: '', search: '', hash: '' });
+      expect(urlPlugin.urlState).toEqual({});
+
+      urlPlugin.pushToAddressBar();
+      expect(window.location.pathname).toEqual('/details/foo');
+    });
+
+    test('url without mode state value', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlHistoryBasePath = '/details/foo/';
+      urlPlugin.urlMode = 'history';
+
+      urlPlugin.pullFromAddressBar({ pathname: '/details/foo/page/12', search: '', hash: '' });
+      expect(urlPlugin.urlState).toEqual({page: '12'});
+
+      urlPlugin.pushToAddressBar();
+      expect(window.location.pathname).toEqual('/details/foo/page/12');
+    });
+
+    test('url with query param', () => {
+      urlPlugin.urlState = {};
+      urlPlugin.urlHistoryBasePath = '/details/foo/';
+      urlPlugin.urlMode = 'history';
+
+      urlPlugin.pullFromAddressBar({ pathname: '/details/foo/page/12', search: '?q=hello&view=theater', hash: '' });
+      expect(urlPlugin.urlState).toEqual({page: '12', q: 'hello', view: 'theater'});
+
+      urlPlugin.pushToAddressBar();
+      const locationUrl = `${window.location.pathname}${window.location.search}`;
+      expect(locationUrl).toEqual('/details/foo/page/12?q=hello&view=theater');
+    });
+
+    test('strips leading slash of incoming path name for no double slash', () => {
+      const urlPlugin = new UrlPlugin();
+      urlPlugin.urlMode = 'history';
+
+      urlPlugin.urlHistoryBasePath = '/details/SubBookTest/book1/GPORFP/';
+      urlPlugin.urlState = {
+        "mode": "1up",
+      };
+
+      urlPlugin.setUrlParam('sort', 'title_asc');
+      urlPlugin.setUrlParam('mode', 'thumb');
+
+      expect(window.location.href).toEqual('http://localhost/details/SubBookTest/book1/GPORFP/mode/thumb?sort=title_asc');
+    });
+  });
+
+});

package/tests/{plugins → jest/plugins/url}/plugin.url.test.js

@@ -1,6 +1,6 @@
-
-import BookReader from '../../src/BookReader.js';
-import '../../src/plugins/plugin.url.js';
+import BookReader from '@/src/BookReader.js';
+import '@/src/plugins/url/plugin.url.js';
+import sinon from 'sinon';
 
 let br;
 beforeAll(() => {
@@ -10,6 +10,7 @@ beforeAll(() => {
 
 afterEach(() => {
   jest.clearAllMocks();
+  sinon.restore();
 });
 
 describe('Plugin: URL controller', () => {
@@ -26,10 +27,10 @@ describe('Plugin: URL controller', () => {
     expect(defaultOptions).toHaveProperty('updateWindowTitle');
     expect(defaultOptions).toHaveProperty('defaults');
     expect(defaultOptions).toHaveProperty('bookId');
-  })
+  });
 
   test('has a whitelist of params that it tracks', () => {
-    ['page', 'search', 'mode', 'region', 'highlight']
+    ['page', 'search', 'mode', 'region', 'highlight'];
     const { defaultOptions: { urlTrackedParams } } = BookReader;
     expect(Array.isArray(urlTrackedParams)).toEqual(true);
     expect(urlTrackedParams.find(param => param === 'page')).toBeTruthy();
@@ -37,7 +38,8 @@ describe('Plugin: URL controller', () => {
     expect(urlTrackedParams.find(param => param === 'mode')).toBeTruthy();
     expect(urlTrackedParams.find(param => param === 'region')).toBeTruthy();
     expect(urlTrackedParams.find(param => param === 'highlight')).toBeTruthy();
-  })
+    expect(urlTrackedParams.find(param => param === 'view')).toBeTruthy();
+  });
 
   test('initializes polling for url changes if using hash', () => {
     BookReader.prototype.urlStartLocationPolling = jest.fn();
@@ -53,14 +55,14 @@ describe('Plugin: URL controller', () => {
     BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
       index: 88,
       mode: 1,
-      search: ''
+      search: '',
     }));
     br.options.urlMode = 'history';
     br.init();
     br.urlUpdateFragment();
 
     expect(window.history.replaceState).toHaveBeenCalled();
-  })
+  });
 
   test('updates URL when mode changes', () => {
     window.history.replaceState = jest.fn();
@@ -69,14 +71,14 @@ describe('Plugin: URL controller', () => {
     BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
       index: 2,
       mode: 2,
-      search: ''
+      search: '',
     }));
     br.options.urlMode = 'history';
     br.init();
     br.urlUpdateFragment();
 
     expect(window.history.replaceState).toHaveBeenCalled();
-  })
+  });
 
   test('updates URL when search changes', () => {
     window.history.replaceState = jest.fn();
@@ -85,7 +87,24 @@ describe('Plugin: URL controller', () => {
     BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
       index: 1,
       mode: 2,
-      search: 'foo'
+      search: 'foo',
+    }));
+    BookReader.prototype.search = jest.fn();
+    br.options.urlMode = 'history';
+    br.init();
+    br.urlUpdateFragment();
+
+    expect(window.history.replaceState).toHaveBeenCalled();
+  });
+
+  test('updates URL when view changes', () => {
+    window.history.replaceState = jest.fn();
+    BookReader.prototype.currentIndex = jest.fn(() => 1);
+    BookReader.prototype.urlReadFragment = jest.fn(() => '');
+    BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
+      index: 1,
+      mode: 2,
+      view: 'theater',
     }));
     BookReader.prototype.search = jest.fn();
     br.options.urlMode = 'history';
@@ -93,7 +112,27 @@ describe('Plugin: URL controller', () => {
     br.urlUpdateFragment();
 
     expect(window.history.replaceState).toHaveBeenCalled();
-  })
+  });
+
+  test('switches to hashMode if replaceState errors', () => {
+    window.history.replaceState = jest.fn(() => {
+      throw new Error('foo');
+    });
+    BookReader.prototype.currentIndex = jest.fn(() => 1);
+    BookReader.prototype.urlReadFragment = jest.fn(() => '');
+    BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
+      index: 1,
+      mode: 2,
+      view: 'theater',
+    }));
+    BookReader.prototype.search = jest.fn();
+    br.options.urlMode = 'history';
+    br.init();
+    br.urlUpdateFragment();
+
+    expect(window.history.replaceState).toHaveBeenCalled();
+    expect(br.options.urlMode).toEqual('hash');
+  });
 
   test('does not update URL when search in query string', () => {
     window.history.replaceState = jest.fn();
@@ -103,7 +142,7 @@ describe('Plugin: URL controller', () => {
     BookReader.prototype.paramsFromCurrent = jest.fn(() => ({
       index: 1,
       mode: 2,
-      search: 'foo'
+      search: 'foo',
     }));
     BookReader.prototype.search = jest.fn();
     br.options.initialSearchTerm = 'foo';
@@ -112,18 +151,18 @@ describe('Plugin: URL controller', () => {
     br.urlUpdateFragment();
 
     expect(window.history.replaceState).toHaveBeenCalledTimes(0);
-  })
+  });
 
   test('only q= param is selected from url query params', () => {
-    const INTIAL_URL = "http://127.0.0.1:8080/BookReaderDemo/demo-internetarchive.html?ocaid=adventuresofoli00dick&q=foo"
+    const INTIAL_URL = "http://127.0.0.1:8080/BookReaderDemo/demo-internetarchive.html?ocaid=adventuresofoli00dick&q=foo";
     const result = br.urlParamsFiltersOnlySearch(INTIAL_URL);
     expect(result).toBe("?q=foo");
-  })
+  });
 
   test('only q= param is selected from url query params with special character', () => {
-    const INTIAL_URL = "http://127.0.0.1:8080/BookReaderDemo/demo-internetarchive.html?ocaid=adventuresofoli00dick&q=foo%24%24"
+    const INTIAL_URL = "http://127.0.0.1:8080/BookReaderDemo/demo-internetarchive.html?ocaid=adventuresofoli00dick&q=foo%24%24";
     const result = br.urlParamsFiltersOnlySearch(INTIAL_URL);
     expect(result).toBe("?q=foo%24%24");
-  })
+  });
 });
 

package/tests/jest/setup.js

@@ -0,0 +1,3 @@
+process.on("unhandledRejection", (error) => {
+  throw error;
+});

package/tests/{util → jest/util}/browserSniffing.test.js

@@ -1,6 +1,6 @@
 import {
   isChrome, isFirefox, isSafari,
-} from '../../src/util/browserSniffing.js';
+} from '@/src/util/browserSniffing.js';
 
 const TESTS = [
   {

package/tests/jest/util/docCookies.test.js

@@ -0,0 +1,24 @@
+import * as docCookies from '@/src/util/docCookies.js';
+
+afterEach(() => {
+  jest.clearAllMocks();
+});
+
+describe('Helper function: set and get cookie item', () => {
+  test('set cookie item value', () => {
+    expect(docCookies.setItem('test-cookie', 'jack-sparow')).toBeTruthy();
+  });
+
+  test('get cookie item value', () => {
+    expect(docCookies.getItem('test-cookie')).toEqual('jack-sparow');
+  });
+});
+
+describe('isCookiesBlocked', () => {
+  test('return true if cookies are blocked', () => {
+    expect(docCookies.areCookiesBlocked({ get cookie() { throw new Error(); }})).toBeTruthy();
+  });
+  test('return false if cookies are not blocked', () => {
+    expect(docCookies.areCookiesBlocked({ cookie: 'blah' })).toBeFalsy();
+  });
+});

package/tests/{util → jest/util}/strings.test.js

@@ -1,4 +1,4 @@
-import { APPLY_FILTERS, applyVariables } from '../../src/util/strings.js';
+import { APPLY_FILTERS, applyVariables } from '@/src/util/strings.js';
 
 describe('applyVariables', () => {
   test('null cases', () => {

package/tests/{utils.js → jest/utils.js}

@@ -31,6 +31,44 @@ export function eventTargetMixin() {
   };
 }
 
+/** @implements {EventTarget} */
+export class EventTargetSpy {
+  /** @type {Record<string, Function[]} */
+  _listeners = {}
+  get _totalListenerCount() {
+    return Object.values(this._listeners)
+      .map(a => a.length)
+      .reduce((a, b) => a + b, 0);
+  }
+
+  addEventListener(evName, listener) {
+    const listeners = this._listeners[evName] || [];
+    listeners.push(listener);
+    this._listeners[evName] = listeners;
+  }
+
+  dispatchEvent(evName, ev) {
+    const listeners = this._listeners[evName] || [];
+    listeners.forEach(fn => fn(ev));
+  }
+
+  removeEventListener(evName, listener) {
+    const listeners = this._listeners[evName] || [];
+    this._listeners[evName] = listeners.filter(fn => fn != listener);
+  }
+
+  /**
+   * @param {EventTarget} realEventTarget
+   */
+  static wrap(realEventTarget) {
+    const spy = new EventTargetSpy();
+    realEventTarget.addEventListener = spy.addEventListener.bind(spy);
+    realEventTarget.removeEventListener = spy.removeEventListener.bind(spy);
+    realEventTarget.dispatchEvent = spy.dispatchEvent.bind(spy);
+    return spy;
+  }
+}
+
 /**
  * Lazy deep copy function; only supports objects (no classes)
  * @template T

package/webpack.config.js

@@ -7,15 +7,19 @@ const shared = {
   mode: 'production',
 
   watchOptions: {
-    ignored: ['BookReader/**', 'node_modules/**', 'tests/**']
+    ignored: ['BookReader/**', 'node_modules/**', 'tests/**'],
   },
 
   target: ['web', 'es5'],
 
   module: {
     rules: [
-      { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }
-    ]
+      {
+        test: /\.js$/,
+        exclude: /node_modules[/\\](?!(lit-element|lit-html|lit|@lit)[/\\]).*/,
+        loader: "babel-loader",
+      },
+    ],
   },
 
   output: {
@@ -31,6 +35,9 @@ module.exports = [
 
     // Output file -> srcfile
     entry: {
+      // Polyfill bundles
+      'webcomponents-bundle.js': { import: '@webcomponents/webcomponentsjs/webcomponents-bundle.js' },
+
       // BookReader
       'BookReader.js': './src/BookReader.js',
 
@@ -39,15 +46,14 @@ module.exports = [
       'plugins/plugin.autoplay.js': { import: './src/plugins/plugin.autoplay.js', dependOn: 'BookReader.js' },
       'plugins/plugin.chapters.js': { import: './src/plugins/plugin.chapters.js', dependOn: 'BookReader.js' },
       'plugins/plugin.iframe.js': { import: './src/plugins/plugin.iframe.js', dependOn: 'BookReader.js' },
-      'plugins/plugin.menu_toggle.js': { import: './src/plugins/menu_toggle/plugin.menu_toggle.js', dependOn: 'BookReader.js' },
-      'plugins/plugin.mobile_nav.js': { import: './src/plugins/plugin.mobile_nav.js', dependOn: 'BookReader.js' },
+      'plugins/plugin.iiif.js': { import: './src/plugins/plugin.iiif.js', dependOn: 'BookReader.js' },
       'plugins/plugin.resume.js': { import: './src/plugins/plugin.resume.js', dependOn: 'BookReader.js' },
       'plugins/plugin.search.js': { import: './src/plugins/search/plugin.search.js', dependOn: 'BookReader.js' },
       'plugins/plugin.text_selection.js': { import: './src/plugins/plugin.text_selection.js', dependOn: 'BookReader.js' },
       'plugins/plugin.tts.js': { import: './src/plugins/tts/plugin.tts.js', dependOn: 'BookReader.js' },
-      'plugins/plugin.url.js': { import: './src/plugins/plugin.url.js', dependOn: 'BookReader.js' },
+      'plugins/plugin.url.js': { import: './src/plugins/url/plugin.url.js', dependOn: 'BookReader.js' },
       'plugins/plugin.vendor-fullscreen.js': { import: './src/plugins/plugin.vendor-fullscreen.js', dependOn: 'BookReader.js' },
-      'bookreader-component-bundle.js': { import: './src/BookReaderComponent/BookReaderComponent.js', dependOn: 'BookReader.js' }
+      'ia-bookreader-bundle.js': { import: './src/ia-bookreader/ia-bookreader.js', dependOn: 'BookReader.js' },
     },
 
     externals: {
@@ -60,7 +66,7 @@ module.exports = [
         // Make $ and jQuery available without importing
         $: 'jquery',
         jQuery: 'jquery',
-      })
+      }),
     ],
 
     output: {
@@ -71,7 +77,7 @@ module.exports = [
     // Accurate source maps at the expense of build time.
     // The source map is intentionally exposed
     // to users via sourceMapFilename for prod debugging.
-    devtool: 'source-map'
+    devtool: 'source-map',
   },
 
   // jQuery gets its own build, so that it can be used as an "external" in
@@ -80,7 +86,7 @@ module.exports = [
     ...shared,
 
     entry: {
-      'jquery-1.10.1.js': { import: './src/jquery-wrapper.js' },
+      'jquery-3.js': { import: './src/jquery-wrapper.js' },
     },
   },
 ];

package/.babelrc

@@ -1,12 +0,0 @@
-{
-    "presets": [
-        [
-            "@babel/preset-env",
-            {
-                "targets": "> 2%, ie 11, edge 14, samsung > 9, OperaMini all, UCAndroid > 12",
-                "useBuiltIns": "usage",
-                "corejs": 3
-            }
-        ]
-    ]
-}

package/.dependabot/config.yml

@@ -1,6 +0,0 @@
-version: 1
-
-update_configs:
-  - package_manager: "javascript"
-    directory: "/"
-    update_schedule: "monthly"

package/.testcaferc.json

@@ -1,5 +0,0 @@
-{
-  "appCommand": "npm run serve",
-  "browsers": ["chrome:headless", "firefox:headless"],
-  "src": ["tests/e2e/**/*test.js"]
-}