@internetarchive/bookreader 5.0.0-46-alpha2 → 5.0.0-46-no-right-click

package/src/plugins/search/view.js

@@ -1,5 +1,3 @@
-import { escapeHTML } from "../../BookReader/utils.js";
-
 class SearchView {
   /**
    * @param {object} params
@@ -15,7 +13,7 @@ class SearchView {
     // Search results are returned as a text blob with the hits wrapped in
     // triple mustaches. Hits occasionally include text beyond the search
     // term, so everything within the staches is captured and wrapped.
-    this.matcher = new RegExp('{{{(.+?)}}}', 'gs');
+    this.matcher = new RegExp('{{{(.+?)}}}', 'g');
     this.matches = [];
     this.cacheDOMElements();
     this.bindEvents();
@@ -236,18 +234,15 @@ class SearchView {
 
       const percentThrough = this.br.constructor.util.cssPercentage(pageIndex, this.br.getNumLeafs() - 1);
 
-      const escapedQueryString = escapeHTML(queryString);
-      const queryStringWithB = escapedQueryString.replace(this.matcher, '<b>$1</b>');
+      const queryStringWithB = queryString.replace(this.matcher, '<b>$1</b>');
 
       let queryStringWithBTruncated = '';
 
       if (queryString.length > 100) {
-        queryStringWithBTruncated = queryString.replace(/^(.{100}[^\s]*).*/, "$1");
-
-        // If truncating, we must escape *after* truncation occurs (but before wrapping in <b>)
-        queryStringWithBTruncated = escapeHTML(queryStringWithBTruncated)
+        queryStringWithBTruncated = queryString
+          .replace(/^(.{100}[^\s]*).*/, "$1")
           .replace(this.matcher, '<b>$1</b>')
-          + '...';
+                + '...';
       }
 
       // draw marker

package/tests/jest/BookNavigator/book-navigator.test.js

@@ -13,8 +13,9 @@ import VolumesProvider from '@/src/BookNavigator/volumes/volumes-provider.js';
 import { ModalManager } from '@internetarchive/modal-manager';
 import { SharedResizeObserver } from '@internetarchive/shared-resize-observer';
 import '@/src/BookNavigator/book-navigator.js';
+import { sleep } from '@/src/BookReader/utils';
 
-const promise0 = () => new Promise(res => setTimeout(res, 0));
+const promise0 = () => new Promise((res) => setTimeout(res, 0));
 
 const container = (sharedObserver = null) => {
   const itemStub = {
@@ -22,7 +23,7 @@ const container = (sharedObserver = null) => {
       identifier: 'foo',
       creator: 'bar',
       title: 'baz',
-    }
+    },
   };
   const modalMgr = new ModalManager();
   return html`
@@ -32,18 +33,18 @@ const container = (sharedObserver = null) => {
       .sharedObserver=${sharedObserver || new SharedResizeObserver()}
       .modal=${modalMgr}
     >
-      <div slot="main">
-        <div id="BookReader"></div>
-        <p class="visible-in-reader">now showing</p>
+      <div slot='main'>
+        <div id='BookReader'></div>
+        <p class='visible-in-reader'>now showing</p>
       <\div>
     </book-navigator>
   `;
 };
 
 window.ResizeObserver = class ResizeObserver {
-  observe = sinon.fake()
-  unobserve = sinon.fake()
-  disconnect = sinon.fake()
+  observe = sinon.fake();
+  unobserve = sinon.fake();
+  disconnect = sinon.fake();
 };
 
 afterEach(() => {
@@ -52,11 +53,11 @@ afterEach(() => {
   const body = document.querySelector('body');
   body.innerHTML = '';
   sinon.restore();
+  window.archive_analytics = null;
 });
 
-
 describe('<book-navigator>', () => {
-  describe("How it loads", () => {
+  describe('How it loads', () => {
     describe('Attaches BookReader listeners before `br.init` is called', () => {
       test('binds global event listeners', async () => {
         const el = fixtureSync(container());
@@ -71,7 +72,7 @@ describe('<book-navigator>', () => {
           jumpToIndex: sinon.fake(),
           options: { enableMultipleBooks: false }, // for multipleBooks
           el: '#BookReader',
-          refs: {}
+          refs: {},
         };
 
         const sharedObserver = new SharedResizeObserver();
@@ -85,9 +86,11 @@ describe('<book-navigator>', () => {
 
         expect(brStub.resize.callCount).toEqual(0);
 
-        window.dispatchEvent(new CustomEvent('BookReader:PostInit', {
-          detail: { props: brStub }
-        }));
+        window.dispatchEvent(
+          new CustomEvent('BookReader:PostInit', {
+            detail: { props: brStub },
+          })
+        );
         await elementUpdated(el);
 
         expect(el.emitLoadingStatusUpdate.callCount).toEqual(1);
@@ -120,13 +123,15 @@ describe('<book-navigator>', () => {
       const itemImage = fixtureSync(el.itemImage);
       expect(itemImage).toBeInstanceOf(HTMLImageElement);
       expect(itemImage.getAttribute('class')).toEqual('cover-img');
-      expect(itemImage.getAttribute('src')).toEqual('https://https://foo.archive.org/services/img/foo');
+      expect(itemImage.getAttribute('src')).toEqual(
+        'https://https://foo.archive.org/services/img/foo'
+      );
     });
   });
   describe('Menu/Layer Provider', () => {
     describe('Connecting with a provider:', () => {
       // loads Providers with base shared resources
-      test('We load 3 Sub Menus by default', async() => {
+      test('We load 3 Sub Menus by default', async () => {
         const el = fixtureSync(container());
         const $brContainer = document.createElement('div');
         const brStub = {
@@ -135,8 +140,8 @@ describe('<book-navigator>', () => {
           jumpToIndex: sinon.fake(),
           options: {},
           refs: {
-            $brContainer
-          }
+            $brContainer,
+          },
         };
         el.bookreader = brStub;
         await el.elementUpdated;
@@ -151,10 +156,12 @@ describe('<book-navigator>', () => {
         expect(el.menuProviders.share).toBeInstanceOf(SharingProvider);
 
         expect(defaultMenus).toContain('visualAdjustments');
-        expect(el.menuProviders.visualAdjustments).toBeInstanceOf(VisualAdjustmentsProvider);
+        expect(el.menuProviders.visualAdjustments).toBeInstanceOf(
+          VisualAdjustmentsProvider
+        );
       });
       describe('Loading Sub Menus By Plugin Flags', () => {
-        test('Search: uses `enableSearch` flag', async() => {
+        test('Search: uses `enableSearch` flag', async () => {
           const el = fixtureSync(container());
           const $brContainer = document.createElement('div');
           const brStub = {
@@ -163,8 +170,8 @@ describe('<book-navigator>', () => {
             jumpToIndex: sinon.fake(),
             options: { enableSearch: true },
             refs: {
-              $brContainer
-            }
+              $brContainer,
+            },
           };
           el.bookreader = brStub;
           await el.elementUpdated;
@@ -176,9 +183,9 @@ describe('<book-navigator>', () => {
           expect(el.menuProviders.search).toBeInstanceOf(SearchProvider);
 
           // also adds a menu shortcut
-          expect(el.menuShortcuts.find(m => m.id === 'search')).toBeDefined();
+          expect(el.menuShortcuts.find((m) => m.id === 'search')).toBeDefined();
         });
-        test('Volumes/Multiple Books: uses `enableMultipleBooks` flag', async() => {
+        test('Volumes/Multiple Books: uses `enableMultipleBooks` flag', async () => {
           const el = fixtureSync(container());
           const $brContainer = document.createElement('div');
           const brStub = {
@@ -189,13 +196,13 @@ describe('<book-navigator>', () => {
               enableMultipleBooks: true,
               multipleBooksList: {
                 by_subprefix: {
-                  fooSubprefix: 'beep'
-                }
-              }
+                  fooSubprefix: 'beep',
+                },
+              },
             },
             refs: {
-              $brContainer
-            }
+              $brContainer,
+            },
           };
           el.bookreader = brStub;
           await el.elementUpdated;
@@ -207,7 +214,9 @@ describe('<book-navigator>', () => {
           expect(el.menuProviders.volumes).toBeInstanceOf(VolumesProvider);
 
           // also adds a menu shortcut
-          expect(el.menuShortcuts.find(m => m.id === 'volumes')).toBeDefined();
+          expect(
+            el.menuShortcuts.find((m) => m.id === 'volumes')
+          ).toBeDefined();
         });
       });
       test('keeps track of base shared resources for providers in: `baseProviderConfig`', () => {
@@ -315,7 +324,9 @@ describe('<book-navigator>', () => {
               console.log();
               sidePanelConfig = e.detail;
             });
-            const toggleSearchMenuEvent = new Event('BookReader:ToggleSearchMenu');
+            const toggleSearchMenuEvent = new Event(
+              'BookReader:ToggleSearchMenu'
+            );
             window.dispatchEvent(toggleSearchMenuEvent);
 
             await elementUpdated(el);
@@ -327,15 +338,15 @@ describe('<book-navigator>', () => {
     });
   });
 
-  describe('Resizing',() => {
+  describe('Resizing', () => {
     test('keeps track of `brWidth` and `brHeight`', async () => {
       const el = fixtureSync(container());
       const brStub = {
         resize: sinon.fake(),
         options: {},
         refs: {
-          $brContainer: document.createElement('div')
-        }
+          $brContainer: document.createElement('div'),
+        },
       };
       el.bookreader = brStub;
       await elementUpdated(el);
@@ -345,9 +356,9 @@ describe('<book-navigator>', () => {
       const mockResizeEvent = {
         contentRect: {
           height: 500,
-          width: 900
+          width: 900,
         },
-        target: el.mainBRContainer
+        target: el.mainBRContainer,
       };
       el.handleResize(mockResizeEvent);
 
@@ -364,8 +375,8 @@ describe('<book-navigator>', () => {
         resize: sinon.fake(),
         options: {},
         refs: {
-          $brContainer: document.createElement('div')
-        }
+          $brContainer: document.createElement('div'),
+        },
       };
 
       el.bookreader = brStub;
@@ -470,7 +481,7 @@ describe('<book-navigator>', () => {
 
       expect(el.closeFullscreen.callCount).toEqual(1);
     });
-    test('removes Fullscreen shortcut when leaving fullscreen', async() => {
+    test('removes Fullscreen shortcut when leaving fullscreen', async () => {
       const el = fixtureSync(container());
       const brStub = {
         isFullscreen: () => false,
@@ -489,7 +500,7 @@ describe('<book-navigator>', () => {
       expect(el.menuShortcuts.length).toEqual(0);
       expect(el.emitMenuShortcutsUpdated.callCount).toEqual(1);
     });
-    test('Event: Listens for `BookReader:FullscreenToggled', async() => {
+    test('Event: Listens for `BookReader:FullscreenToggled', async () => {
       const el = fixtureSync(container());
       const brStub = {
         isFullscreen: () => true,
@@ -591,40 +602,5 @@ describe('<book-navigator>', () => {
         expect(preventDefaultSpy.called).toEqual(true);
       });
     });
-    it('Allows unrestricted books access to context menu', async () => {
-      window.archive_analytics = { send_event_no_sampling: sinon.fake() };
-
-      const el = fixtureSync(container());
-      const brStub = {
-        options: { restricted: false },
-      };
-
-      el.bookreader = brStub;
-      el.bookIsRestricted = false;
-
-      await el.elementUpdated;
-
-      expect(window.archive_analytics.send_event_no_sampling.called).toEqual(
-        false
-      );
-
-      const body = document.querySelector('body');
-      // const element stub for img.BRpageimage
-      const imgBRpageimage = document.createElement('img');
-      imgBRpageimage.classList.add('not-targeted-element');
-      body.appendChild(imgBRpageimage);
-      const contextMenuEvent = new Event('contextmenu', { bubbles: true });
-
-      // Set spy on contextMenuEvent to check if `preventDefault` is called
-      const preventDefaultSpy = sinon.spy(contextMenuEvent, 'preventDefault');
-      expect(preventDefaultSpy.called).toEqual(false);
-
-      imgBRpageimage.dispatchEvent(contextMenuEvent);
-
-      // analytics fires
-      expect(window.archive_analytics.send_event_no_sampling.called).toEqual(true);
-      // we do not prevent default
-      expect(preventDefaultSpy.called).toEqual(false);
-    });
   });
 });

package/tests/jest/BookNavigator/search/search-results.test.js

@@ -46,25 +46,6 @@ const results = [{
   }],
 }];
 
-const resultWithScript = [{
-  text: `foo bar <script>const msg = 'test' + ' failure'; document.write(msg);</script> {{{${searchQuery}}}} baz`,
-  cover: '//placehold.it/30x44',
-  title: 'Book title',
-  displayPageNumber: 'Page 24',
-  par: [{
-    boxes: [{
-      r: 2672, b: 792, t: 689, page: 24, l: 2424,
-    }],
-    b: 1371,
-    t: 689,
-    page_width: 3658,
-    r: 3192,
-    l: 428,
-    page_height: 5357,
-    page: 24,
-  }],
-}];
-
 describe('<ia-book-search-results>', () => {
   afterEach(() => {
     sinon.restore();
@@ -107,20 +88,7 @@ describe('<ia-book-search-results>', () => {
     sinon.replace(IABookSearchResults.prototype, 'createRenderRoot', function createRenderRoot() { return this; });
     const el = await fixture(container(results));
 
-    // Lit inserts HTML comments that inhibit searching for exact innerHTML matches.
-    // So query the DOM for the match instead.
-    const match = el.querySelector('book-search-result mark');
-    expect(match?.textContent).toEqual(searchQuery);
-  });
-
-  test('renders results that contain sanitized HTML tags', async () => {
-    sinon.replace(IABookSearchResults.prototype, 'createRenderRoot', function createRenderRoot() { return this; });
-    // A result whose text contains a <script> tag that will insert 'test failure' into the element if not sanitized
-    const el = await fixture(container(resultWithScript));
-
-    const match = el.querySelector('book-search-result mark');
-    expect(match?.textContent).toEqual(searchQuery);
-    expect(el.innerHTML).not.toContain('test failure');
+    expect(el.innerHTML).toContain(`<mark>${searchQuery}</mark>`);
   });
 
   test('renders results that contain an optional cover image', async () => {

package/tests/jest/plugins/search/plugin.search.view.test.js

@@ -27,27 +27,6 @@ const results = {
     }]
   }]
 };
-const resultWithScript = {
-  ia: "adventuresofoli00dick",
-  q: "child",
-  indexed: true,
-  page_count: 644,
-  body_length: 666,
-  leaf0_missing: false,
-  matches: [{
-    text: 'foo bar <script>alert(1);</script> {{{keyword}}} baz',
-    par: [{
-      boxes: [{r: 1221, b: 2121, t: 2075, page: 37, l: 1107}],
-      b: 2535,
-      t: 1942,
-      page_width: 1790,
-      r: 1598,
-      l: 50,
-      page_height: 2940,
-      page: 37
-    }]
-  }]
-};
 beforeEach(() => {
   $.ajax = jest.fn().mockImplementation(() => {
     // return from:
@@ -102,14 +81,6 @@ describe('View: Plugin: Search', () => {
       expect(searchResultsNav.querySelector('.prev')).toBeDefined();
       expect(searchResultsNav.querySelector('.next')).toBeDefined();
     });
-    test('disallows xss from search results', () => {
-      br.init();
-      const event = new CustomEvent(`${namespace}SearchCallback`);
-      const options = { goToFirstResult: false };
-      br.searchView.handleSearchCallback(event, { results: resultWithScript, options });
-
-      expect(br.searchView.dom.searchNavigation.parent().html()).not.toContain('<script>alert(1);</script>');
-    });
 
     describe('Click events handlers', () => {
       it('triggers custom event when toggling side menu', () => {

package/webpack.config.js

@@ -86,7 +86,7 @@ module.exports = [
     ...shared,
 
     entry: {
-      'jquery-3.js': { import: './src/jquery-wrapper.js' },
+      'jquery-1.10.1.js': { import: './src/jquery-wrapper.js' },
     },
   },
 ];