@internetarchive/bookreader 5.0.0-67 → 5.0.0-68

package/BookReaderDemo/BookReaderDemo.css

@@ -36,21 +36,3 @@ ia-bookreader{
     overflow: hidden;
     margin: 0 auto;
 }
-
-@media only screen and (max-width: 799px) {
-    body.BRbodyMobileNavEnabled {
-        margin: 0;
-        width: 100%;
-        overflow: hidden;
-    }
-    .BRbodyMobileNavEnabled .BookReader {
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        position: absolute;
-        height: 100%;
-        margin: 0;
-        width: 100%;
-    }
-  }

package/BookReaderDemo/BookReaderJSAdvanced.js

@@ -92,9 +92,6 @@ var options = {
     {label: 'Author', value: 'Internet Archive'},
     {label: 'Demo Info', value: 'This demo shows how one could use BookReader with their own content.'},
   ],
-  // This toggles the mobile drawer (not shown in 'embed' mode)
-  enableMobileNav: false,
-  mobileNavTitle: 'BookReader demo',
 
   // Override the path used to find UI images
   imagesBaseURL: '../BookReader/images/',

package/BookReaderDemo/demo-autoplay.html

@@ -15,8 +15,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
     <script src="../BookReader/BookReader.js"></script>
 
-    <!-- Mobile nav plugin -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
     <!-- Autoplay plugin -->
     <script src="../BookReader/plugins/plugin.autoplay.js"></script>
 

package/BookReaderDemo/demo-fullscreen-mobile.html

@@ -15,9 +15,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
     <script src="../BookReader/BookReader.js"></script>
 
-    <!-- Mobile nav plugin -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
-
     <!-- URL-changing plugin -->
     <script src="../BookReader/plugins/plugin.url.js"></script>
 
@@ -31,7 +28,7 @@ html, body { width: 100%; height: 100%; margin: 0; padding: 0; background: grey;
   <div id="BookReader"></div>
   <script type="text/javascript" src="BookReaderJSSimple.js"></script>
   <script>
-    instantiateBookReader('#BookReader', {mobileNavFullscreenOnly: true});
+    instantiateBookReader('#BookReader');
 </script>
 </body>
 </html>

package/BookReaderDemo/demo-fullscreen.html

@@ -15,9 +15,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
     <script src="../BookReader/BookReader.js"></script>
 
-    <!-- Mobile nav plugin -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
-
     <!-- URL-changing plugin -->
     <script src="../BookReader/plugins/plugin.url.js"></script>
 

package/BookReaderDemo/demo-iiif.js

@@ -11,7 +11,6 @@ var br = new BookReader({
 
     // Override the path used to find UI images
     imagesBaseURL: '../BookReader/images/',
-    enableMobileNav: false,
 });
 
 br.IIIF({

package/BookReaderDemo/demo-vendor-fullscreen.html

@@ -15,9 +15,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
     <script src="../BookReader/BookReader.js"></script>
 
-    <!-- Mobile nav plugin -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
-
     <!-- URL-changing plugin -->
     <script src="../BookReader/plugins/plugin.url.js"></script>
 

package/BookReaderDemo/immersion-1up.html

@@ -14,7 +14,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
 
     <!-- plugins needed for archive.org, in same order as archive.org -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
     <script src="../BookReader/plugins/plugin.search.js"></script>
     <script src="../BookReader/plugins/plugin.chapters.js"></script>
     <script src="../BookReader/plugins/plugin.tts.js"></script>

package/BookReaderDemo/immersion-mode.html

@@ -15,9 +15,6 @@
     <link rel="stylesheet" href="../BookReader/BookReader.css"/>
     <script src="../BookReader/BookReader.js"></script>
 
-    <!-- Mobile nav plugin -->
-    <script src="../BookReader/plugins/plugin.mobile_nav.js"></script>
-
     <!-- URL-changing plugin -->
     <script src="../BookReader/plugins/plugin.url.js"></script>
 

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+# 5.0.0-68
+- Fix: 1up zoom wrong on start/entering full screen @cdrini
+- Dev: BREAKING: delete `plugin.mobile_nav.js` no longer used @cdrini
+- Dev: Move page 1 label correction logic to BookReaderJSIA @cdrini
+
 # 5.0.0-67
 - Feature: Re-enable chapters plugin + migrate off mmenu @cdrini
 - Fix: Disable tooltips on touchscreens + fix on IA @cdrini

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/bookreader",
-  "version": "5.0.0-67",
+  "version": "5.0.0-68",
   "description": "The Internet Archive BookReader.",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
   "private": false,
   "dependencies": {
     "@internetarchive/ia-activity-indicator": "^0.0.4",
-    "@internetarchive/ia-item-navigator": "^1.0.4",
+    "@internetarchive/ia-item-navigator": "^1.1.1",
     "@internetarchive/ia-sharing-options": "^1.0.2",
     "@internetarchive/icon-bookmark": "^1.3.4",
     "@internetarchive/icon-dl": "^1.3.4",
@@ -48,11 +48,11 @@
     "@babel/plugin-proposal-decorators": "7.22.7",
     "@babel/preset-env": "7.22.9",
     "@open-wc/testing-helpers": "^2.3.0",
-    "@types/jest": "29.5.3",
+    "@types/jest": "29.5.4",
     "@webcomponents/webcomponentsjs": "^2.6.0",
     "babel-loader": "9.1.3",
     "codecov": "^3.8.3",
-    "concurrently": "7.4.0",
+    "concurrently": "7.6.0",
     "core-js": "3.27.1",
     "cpx2": "4.2.3",
     "eslint": "^7.32.0",
@@ -61,16 +61,15 @@
     "http-server": "14.1.1",
     "interactjs": "^1.10.18",
     "iso-language-codes": "1.1.0",
-    "jest": "29.6.2",
-    "jest-environment-jsdom": "^29.4.3",
+    "jest": "29.6.4",
+    "jest-environment-jsdom": "^29.6.4",
     "jquery": "3.6.1",
     "jquery-colorbox": "1.6.4",
     "jquery-ui": "1.12.1",
     "jquery-ui-touch-punch": "0.2.3",
     "jquery.browser": "0.1.0",
-    "jquery.mmenu": "5.6.5",
     "live-server": "1.2.2",
-    "node-fetch": "3.2.10",
+    "node-fetch": "3.3.2",
     "regenerator-runtime": "0.13.11",
     "sass": "1.64.2",
     "sinon": "^15.1.0",

package/src/BookReader/BookModel.js

@@ -30,18 +30,6 @@ export class BookModel {
     this._medianPageSize = null;
     /** @type {[PageData[], number]} */
     this._getDataFlattenedCached = null;
-
-    // Heal missing first page number assertion
-    const pages = this._getDataFlattened();
-    const firstNumberedPageIndex = pages.findIndex(page => page.pageNum != undefined && !isNaN(parseFloat(page.pageNum)));
-    if (firstNumberedPageIndex != -1 && firstNumberedPageIndex > 0) {
-      const pageNum = parseFloat(pages[firstNumberedPageIndex].pageNum);
-      if (!isNaN(pageNum)) {
-        // Note: Since the pages are always sorted in increasing pageNum/index
-        // order, this will work for both left-to-right and right-to-left books
-        pages[firstNumberedPageIndex - 1].pageNum = pageNum - 1;
-      }
-    }
   }
 
   /** Get median width/height of page in inches. Memoized for performance. */

package/src/BookReader/Mode1Up.js

@@ -77,7 +77,7 @@ export class Mode1Up {
   jumpToIndex(index, pageX, pageY, noAnimate) {
     // Only smooth for small distances
     const distance = Math.abs(this.br.currentIndex() - index);
-    const smooth = !noAnimate && distance <= 4;
+    const smooth = !noAnimate && distance > 0 && distance <= 4;
     this.mode1UpLit.jumpToIndex(index, { smooth });
   }
 

package/src/BookReader/Mode1UpLit.js

@@ -350,7 +350,7 @@ export class Mode1UpLit extends LitElement {
    */
   computeDefaultScale(page) {
     // Default to real size if it fits, otherwise default to full width
-    const containerWidthIn = this.coordSpace.visiblePixelsToWorldUnits(this.htmlDimensionsCacher.clientWidth);
+    const containerWidthIn = this.coordSpace.renderedPixelsToWorldUnits(this.clientWidth);
     return Math.min(1, containerWidthIn / (page.widthInches + 2 * this.SPACING_IN)) || 1;
   }
 

package/src/BookReader/events.js

@@ -16,5 +16,4 @@ export const EVENTS = {
   '2PageViewSelected': '2PageViewSelected',
   /* currently 3 represents thumbnail view */
   '3PageViewSelected': '3PageViewSelected',
-  mobileNavOpen: 'mobileNavOpen',
 };

package/src/BookReader.js

@@ -1355,9 +1355,8 @@ exposeOverrideableMethod(Toolbar, '_components.toolbar', 'getToolBarHeight');
  */
 BookReader.prototype.bindNavigationHandlers = function() {
   const self = this;
+  const jIcons = this.$('.BRicon');
 
-  // Note the mobile plugin attaches itself to body, so we need to select outside
-  const jIcons = this.$('.BRicon').add('.BRmobileMenu .BRicon');
   // Map of jIcon class -> click handler
   const navigationControls = {
     book_left: () => {

package/src/css/BookReader.scss

@@ -7,7 +7,6 @@ $brFontFamily: "Helvetica Neue", Arial, Verdana, sans-serif;
 $brColorThemeblue: #0074D1;
 $brColorThemeBlue2: #4990E2;
 $brColorThemeBlue3: rgb(74,144,226);
-$brColorThemeBlueDarker: rgb(36,94,131);
 $brColorDarkGreyBg: #333;
 $brColorMainBg: black;
 
@@ -44,13 +43,11 @@ $mediumBlue: #428bca;
 $lightBlue: #adaedc;
 $controlsText: $white;
 $controlsBG: $gray20;
-$iconStroke: $white;
 $tooltipBG: $gray20;
 $activeButtonBG: $white;
 $controlsBorder: $gray13;
 $trackColor: $gray40;
 $trackFillColor: $gray80;
-$mobileMenuBG: #151515;
 
 $tooltipBG: $gray20;
 $tooltipText: $white;
@@ -70,7 +67,7 @@ $searchResultBG: $darkBlue;
 }
 
 // These are the main root elements in BookReader
-$brScope: ".BookReader, .BRmobileMenu, .BRfloat";
+$brScope: ".BookReader, .BRfloat";
 
 @import 'colorbox';
 @import 'BRmain';
@@ -80,7 +77,6 @@ $brScope: ".BookReader, .BRmobileMenu, .BRfloat";
 @import 'BRnav';
 @import 'BRtoolbar';
 @import 'BRsearch';
-@import 'MobileNav';
 @import 'BRvendor';
 @import 'icons';
 @import 'controls';

package/src/css/_BRnav.scss

@@ -130,14 +130,6 @@
   // Default
   @include brNavDark;
 
-  /* Full mobile styles */
-  @media (max-width: $brBreakPointMobile) {
-    .BRbodyMobileNavEnabled &,
-    .BRbodyMobileNavEnabledFullscreen.BRfullscreenActive & {
-      @include brNavLight;
-    }
-  }
-
   &--controls {
     display: flex;
   }

package/src/plugins/plugin.autoplay.js

@@ -41,8 +41,7 @@ BookReader.prototype.bindNavigationHandlers = (function(super_) {
 
     if (!this.options.enableAutoPlayPlugin) return;
 
-    // Note the mobile plugin attaches itself to body, so we need to select outside
-    const jIcons = this.$('.BRicon').add('.BRmobileMenu .BRicon');
+    const jIcons = this.$('.BRicon');
 
     jIcons.filter('.play').click(() => {
       this.autoToggle();

package/src/plugins/search/plugin.search.js

@@ -2,9 +2,6 @@
 /* global BookReader */
 /**
  * Plugin for Archive.org book search
- * NOTE: This script must be loaded AFTER `plugin.mobile_nav.js`
- * as it mutates mobile nav drawer
- *
  * Events fired at various points throughout search processing are published
  * on the document DOM element. These can be subscribed to using jQuery's event
  * binding method `$.fn.on`. All of the events are prefixed with a BookReader

package/tests/e2e/base.test.js

@@ -1,7 +1,6 @@
 import { runBaseTests } from './helpers/base';
 import BookReader from './models/BookReader';
-import { runDesktopSearchTests } from './helpers/desktopSearch';
-// import { runMobileSearchTests } from './helpers/mobileSearch';
+import { runSearchTests } from './helpers/search';
 import params from './helpers/params';
 
 const ocaids = params.ocaids || [
@@ -22,14 +21,7 @@ ocaids.forEach(ocaid => {
   runBaseTests(new BookReader());
 
 
-  fixture `Desktop Search Tests for: ${ocaid}`
+  fixture `Search Tests for: ${ocaid}`
     .page `${url}`;
-  runDesktopSearchTests(new BookReader());
-
-  // Todo: deprecated, will remove once mmenu is removed.
-  // fixture `Mobile Search Tests for: ${ocaid}`
-  //   .page `${url}`
-  // runMobileSearchTests(new BookReader());
-
-
+  runSearchTests(new BookReader());
 });

package/tests/e2e/helpers/base.js

@@ -53,14 +53,14 @@ export function runBaseTests (br) {
   test('nav menu displays properly', async t => {
     const { nav } = br;
 
-    await t.expect(nav.desktop.goLeft.visible).ok();
-    await t.expect(nav.desktop.goRight.visible).ok();
-    await t.expect(nav.desktop.mode1Up.visible).ok();
-    await t.expect(nav.desktop.mode2Up.visible).ok();
-    await t.expect(nav.desktop.modeThumb.visible).ok();
-    await t.expect(nav.desktop.zoomIn.visible).ok();
-    await t.expect(nav.desktop.zoomOut.visible).ok();
-    await t.expect(nav.desktop.fullScreen.visible).ok();
+    await t.expect(nav.goLeft.visible).ok();
+    await t.expect(nav.goRight.visible).ok();
+    await t.expect(nav.mode1Up.visible).ok();
+    await t.expect(nav.mode2Up.visible).ok();
+    await t.expect(nav.modeThumb.visible).ok();
+    await t.expect(nav.zoomIn.visible).ok();
+    await t.expect(nav.zoomOut.visible).ok();
+    await t.expect(nav.fullScreen.visible).ok();
   });
 
   test("Canonical URL has no initial parameters", async t => {
@@ -87,7 +87,7 @@ export function runBaseTests (br) {
     const initialUrl = await getUrl();
 
     // Set Cookie by page navigation, wait for cookie
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     // reload canonical URL, wait for URL change
@@ -109,9 +109,9 @@ export function runBaseTests (br) {
     const { nav, BRcontainer} = br;
 
     // Go to next page, so we can go previous if at front cover
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     const onLoadBrState = BRcontainer.child(0);
@@ -119,7 +119,7 @@ export function runBaseTests (br) {
     const origImg1Src = await initialImages.nth(0).getAttribute('src');
     const origImg2Src = await initialImages.nth(-1).getAttribute('src');
 
-    await t.click(nav.desktop.goPrev);
+    await t.click(nav.goPrev);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     const nextBrState = Selector('.BRcontainer').child(0);
@@ -144,7 +144,7 @@ export function runBaseTests (br) {
     // Note: this will fail on a R to L book if at front cover
     const { nav, BRcontainer} = br;
     // Flip away from cover
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     const onLoadBrState = BRcontainer.child(0);
@@ -152,7 +152,7 @@ export function runBaseTests (br) {
     const origImg1Src = await initialImages.nth(0).getAttribute('src');
     const origImg2Src = await initialImages.nth(-1).getAttribute('src');
 
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     const nextBrState = Selector('.BRcontainer').child(0);
@@ -173,28 +173,28 @@ export function runBaseTests (br) {
   test('Clicking `page flip buttons` updates location', async t => {
     const { nav } = br;
     // Page navigation creates params
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.expect(isPageInUrl()).eql(true);
     await t.expect(isModeInUrl('2up')).eql(true);
 
-    await t.click(nav.desktop.goPrev);
+    await t.click(nav.goPrev);
     await t.expect(isPageInUrl()).eql(true);
     await t.expect(isModeInUrl('2up')).eql(true);
   });
 
   test('Clicking `2 page view` brings up cur page + caching', async t => {
     const { nav } = br;
-    await t.click(nav.desktop.mode2Up);
+    await t.click(nav.mode2Up);
     await t.expect(Selector('.BRpagecontainer.BRpage-visible').count).eql(1);
     await t.expect(Selector('.BRpagecontainer').count).eql(3);
   });
 
   test('Clicking `1 page view` brings up 1 at a time', async t => {
     const { nav } = br;
-    await t.click(nav.desktop.mode1Up);
+    await t.click(nav.mode1Up);
 
     // Flip away from cover
-    await t.click(nav.desktop.goNext);
+    await t.click(nav.goNext);
     await t.wait(PAGE_FLIP_WAIT_TIME);
 
     // we usually pre-fetch the page in question & the 2 after it
@@ -203,7 +203,7 @@ export function runBaseTests (br) {
 
   test('Clicking `thumbnail view` brings up all of the page thumbnails', async t => {
     const { nav } = br;
-    await t.click(nav.desktop.modeThumb);
+    await t.click(nav.modeThumb);
     await t.expect(Selector('.BRpagecontainer').count).gte(3);
   });
 
@@ -213,12 +213,12 @@ export function runBaseTests (br) {
 
     await t.expect(br.BRcontainer.visible).ok();
     await t.expect(page.visible).ok();
-    await t.expect(nav.desktop.zoomOut.visible).ok();
+    await t.expect(nav.zoomOut.visible).ok();
 
     const initialBookHeight = await page.getBoundingClientRectProperty('height');
     const initialBookWidth = await page.getBoundingClientRectProperty('width');
 
-    await t.click(nav.desktop.zoomOut);
+    await t.click(nav.zoomOut);
 
     const zoomOutBookHeight = await page.getBoundingClientRectProperty('height');
     const zoomOutBookWidth = await page.getBoundingClientRectProperty('width');
@@ -233,12 +233,12 @@ export function runBaseTests (br) {
 
     await t.expect(br.BRcontainer.visible).ok();
     await t.expect(page.visible).ok();
-    await t.expect(nav.desktop.zoomIn.visible).ok();
+    await t.expect(nav.zoomIn.visible).ok();
 
     const initialBookHeight = await page.getBoundingClientRectProperty('height');
     const initialBookWidth = await page.getBoundingClientRectProperty('width');
 
-    await t.click(nav.desktop.zoomIn);
+    await t.click(nav.zoomIn);
 
     const zoomInBookHeight = await page.getBoundingClientRectProperty('height');
     const zoomIntBookWidth = await page.getBoundingClientRectProperty('width');
@@ -253,10 +253,10 @@ export function runBaseTests (br) {
 
     // initial in-page
     await t.expect(BRcontainer.getBoundingClientRectProperty('width')).lte(windowWidth);
-    await t.click(nav.desktop.fullScreen);
+    await t.click(nav.fullScreen);
     // full screen
     await t.expect(BRcontainer.getBoundingClientRectProperty('width')).eql(windowWidth);
-    await t.click(nav.desktop.fullScreen);
+    await t.click(nav.fullScreen);
     // in-page
     await t.expect(BRcontainer.getBoundingClientRectProperty('width')).lte(windowWidth);
   });

package/tests/e2e/helpers/rightToLeft.js

@@ -4,20 +4,20 @@ const getPageUrl = ClientFunction(() => window.location.href);
 export function runRightToLeftTests (br) {
   test('Right to Left - correct initialization in two-page view', async t => {
     const { nav, BRcontainer} = br;
-    await t.click(nav.desktop.mode2Up);
+    await t.click(nav.mode2Up);
 
     //checking right leaf edge is not in tree
     await t.expect(BRcontainer.find('.br-mode-2up__leafs--left').count).eql(1);
     await t.expect(BRcontainer.find('.br-mode-2up__leafs--right').count).eql(0);
 
     //checks slider is in correct position
-    await t.expect(nav.desktop.sliderRange.getStyleProperty('width')).eql('0px');
+    await t.expect(nav.sliderRange.getStyleProperty('width')).eql('0px');
   });
 
   test('Right to Left - assuring flipping left goes to next page', async t => {
     const { nav } = br;
-    await t.click(nav.desktop.mode2Up);
-    await t.click(nav.desktop.goLeft);
+    await t.click(nav.mode2Up);
+    await t.click(nav.goLeft);
     await t.expect(getPageUrl()).match(/page\/n1/);
   });
 }

package/tests/e2e/helpers/{desktopSearch.js → search.js}

@@ -3,7 +3,7 @@ import { SEARCH_INSIDE_URL_RE , mockResponseFound, mockResponseNotFound,
   TEST_TEXT_FOUND, TEST_TEXT_NOT_FOUND, PAGE_FIRST_RESULT, SEARCH_MATCHES_LENGTH } from './mockSearch';
 
 
-export function runDesktopSearchTests(br) {
+export function runSearchTests(br) {
   //building mock response  for successful and unsuccessful search
   const mockFound = RequestMock()
     .onRequestTo(SEARCH_INSIDE_URL_RE )
@@ -15,32 +15,32 @@ export function runDesktopSearchTests(br) {
 
 
   test
-    .requestHooks(mockFound)('Desktop search - successful search', async t => {
+    .requestHooks(mockFound)('Search - successful search', async t => {
       const nav = br.nav;
 
       //assuring that the search bar is enabled
-      await t.expect(nav.desktop.searchIcon.visible).ok();
-      await t.click(nav.desktop.searchIcon);
+      await t.expect(nav.searchIcon.visible).ok();
+      await t.click(nav.searchIcon);
 
       //testing search for a word found in the book
-      await t.selectText(nav.desktop.searchBox).pressKey('delete');
+      await t.selectText(nav.searchBox).pressKey('delete');
       // FIXME: Why is it only typing every other letter?!?!
-      await t.typeText(nav.desktop.searchBox, TEST_TEXT_FOUND.split('').join('_'));
+      await t.typeText(nav.searchBox, TEST_TEXT_FOUND.split('').join('_'));
       await t.pressKey('enter');
 
-      await t.expect(nav.desktop.searchPin.exists).ok();
-      await t.expect(nav.desktop.searchPin.child('.BRquery').child('main').exists).ok();
-      await t.expect(nav.desktop.searchPin.child('.BRquery').child('main').innerText).contains(TEST_TEXT_FOUND);
-      await t.expect(nav.desktop.searchNavigation.exists).ok();
-      await t.expect(nav.desktop.searchNavigation.find('[data-id="resultsCount"]').exists).ok();
-      await t.expect(nav.desktop.searchNavigation.find('[data-id="resultsCount"]').innerText).contains(SEARCH_MATCHES_LENGTH);
+      await t.expect(nav.searchPin.exists).ok();
+      await t.expect(nav.searchPin.child('.BRquery').child('main').exists).ok();
+      await t.expect(nav.searchPin.child('.BRquery').child('main').innerText).contains(TEST_TEXT_FOUND);
+      await t.expect(nav.searchNavigation.exists).ok();
+      await t.expect(nav.searchNavigation.find('[data-id="resultsCount"]').exists).ok();
+      await t.expect(nav.searchNavigation.find('[data-id="resultsCount"]').innerText).contains(SEARCH_MATCHES_LENGTH);
 
       //checking url
       const getPageUrl = ClientFunction(() => window.location.href.toString());
       await t.expect(getPageUrl()).contains(TEST_TEXT_FOUND);
 
       //checks clicking on first search pin opens correct page
-      await t.click(nav.desktop.searchPin);
+      await t.click(nav.searchPin);
       await t.expect(getPageUrl()).contains(PAGE_FIRST_RESULT);
 
       //checks highlight on result page is visible
@@ -51,19 +51,19 @@ export function runDesktopSearchTests(br) {
 
 
   test
-    .requestHooks(mockNotFound)('Desktop search - unsuccessful search', async t => {
+    .requestHooks(mockNotFound)('Search - unsuccessful search', async t => {
       const nav = br.nav;
 
       //assuring that the search bar is enabled
-      await t.expect(nav.desktop.searchIcon.visible).ok();
-      await t.click(nav.desktop.searchIcon);
+      await t.expect(nav.searchIcon.visible).ok();
+      await t.click(nav.searchIcon);
 
       //testing search for a word not found in the book
-      await t.selectText(nav.desktop.searchBox).pressKey('delete');
+      await t.selectText(nav.searchBox).pressKey('delete');
       // FIXME: Why is it only typing every other letter?!?!
-      await t.typeText(nav.desktop.searchBox, TEST_TEXT_NOT_FOUND.split('').join('_'));
+      await t.typeText(nav.searchBox, TEST_TEXT_NOT_FOUND.split('').join('_'));
       await t.pressKey('enter');
-      await t.expect(nav.desktop.searchPin.child('.BRquery').child('main').withText(TEST_TEXT_NOT_FOUND).exists).notOk();
+      await t.expect(nav.searchPin.child('.BRquery').child('main').withText(TEST_TEXT_NOT_FOUND).exists).notOk();
 
       const getPageUrl = ClientFunction(() => window.location.href.toString());
       await t.expect(getPageUrl()).contains(TEST_TEXT_NOT_FOUND);