feat(ol-mobile): OL mobile search plugin for ?ref=ol embeds

BookReaderDemo/IADemoBr.js

@@ -84,7 +84,7 @@ const initializeBookReader = (brManifest) => {
     enableFSLogoShortcut: true,
     plugins: {
       search: {
-        initialSearchTerm: searchTerm ? searchTerm : '',
+        initialSearchTerm: searchTerm,
       },
     },
   };

BookReaderDemo/demo-internetarchive.html

@@ -22,6 +22,7 @@
 
     <!-- plugins needed for archive.org, in same order as archive.org -->
     <script src="/BookReader/plugins/plugin.search.js"></script>
+    <script src="/BookReader/plugins/plugin.search.ol-mobile.js"></script>
     <script src="/BookReader/plugins/plugin.chapters.js"></script>
     <script src="/BookReader/plugins/plugin.tts.js"></script>
     <script src="/BookReader/plugins/plugin.url.js"></script>

package.json

@@ -66,6 +66,7 @@
     "@iiif/presentation-2": "^1.0.4",
     "@iiif/presentation-3": "^2.1.3",
     "@open-wc/testing-helpers": "3.0.1",
+    "@playwright/test": "1.60.0",
     "@types/jest": "30.0.0",
     "@webcomponents/webcomponentsjs": "^2.6.0",
     "babel-loader": "10.1.1",
@@ -134,6 +135,8 @@
     "DOCS:update:test-deps": "If CI succeeds, these should be good to update",
     "update:test-deps": "npm i @babel/eslint-parser@latest @open-wc/testing-helpers@latest @types/jest@latest eslint@7 eslint-plugin-testcafe@latest jest@latest jest-environment-jsdom@latest sinon@latest testcafe@latest",
     "DOCS:update:build-deps": "These can cause strange changes, so do an npm run build + check file size (git diff --stat), and check the site is as expected",
-    "update:build-deps": "npm i @babel/core@latest @babel/preset-env@latest @babel/plugin-proposal-class-properties@latest @babel/plugin-proposal-decorators@latest babel-loader@latest core-js@latest regenerator-runtime@latest sass@latest svgo@latest webpack@latest webpack-cli@latest"
+    "update:build-deps": "npm i @babel/core@latest @babel/preset-env@latest @babel/plugin-proposal-class-properties@latest @babel/plugin-proposal-decorators@latest babel-loader@latest core-js@latest regenerator-runtime@latest sass@latest svgo@latest webpack@latest webpack-cli@latest",
+    "test:playwright": "npx playwright test",
+    "test:playwright:ci": "npm run build && npx playwright test"
   }
 }

playwright.config.js

@@ -0,0 +1,34 @@
+// @ts-check
+import { defineConfig, devices } from '@playwright/test';
+
+const BASE_URL = process.env.BASE_URL?.replace(/\/+$/, '') ?? 'http://127.0.0.1:8000';
+
+export default defineConfig({
+  testDir: './tests/playwright',
+  timeout: 60_000,
+  retries: process.env.CI ? 1 : 0,
+  workers: 1, // OL mobile tests are sequential (share server state)
+  reporter: [['html', { open: 'never' }], ['line']],
+  use: {
+    baseURL: BASE_URL,
+    screenshot: 'only-on-failure',
+    video: 'retain-on-failure',
+  },
+  projects: [
+    {
+      name: 'mobile-chrome',
+      use: {
+        ...devices['Pixel 5'],  // Chromium-based mobile device
+        browserName: 'chromium',
+      },
+    },
+  ],
+  // Assumes `npm run build && npx http-server -p 8000 -c-1 .` is already running.
+  // Set reuseExistingServer so CI can start it externally.
+  webServer: {
+    command: 'npx http-server -p 8000 -c-1 .',
+    port: 8000,
+    reuseExistingServer: true,
+    timeout: 15_000,
+  },
+});

src/BookReader.js

@@ -541,7 +541,7 @@ BookReader.prototype.initParams = function() {
         // If we have a query string: q=[term]
         const searchParams = new URLSearchParams(this.readQueryString());
         const searchTerm = searchParams.get('q');
-        if (searchTerm) {
+        if (searchTerm != null) {
           sp.options.initialSearchTerm = utils.decodeURIComponentPlus(searchTerm);
         }
       }

src/css/BookReader.scss

@@ -83,3 +83,4 @@ $brScope: ".BookReader, .BRfloat";
 @import 'TextSelection';
 @import 'BRComponent';
 @import 'BRBookmarks';
+@import 'BRolMobile';