npm - @internetarchive/ia-book-actions - Versions diffs - 1.4.3 → 1.4.4-alpha10 - Mend

@internetarchive/ia-book-actions 1.4.3 → 1.4.4-alpha10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (13) hide show

package/index.html +416 -118
package/package.json +2 -2
package/src/assets/data/info.js +12 -0
package/src/core/services/actions-handler/actions-handler-service.js +5 -1
package/src/core/services/actions-handler/actions-handler.js +25 -19
package/src/core/services/loan-analytics.js +1 -1
package/src/core/services/loan-renew-helper.js +2 -3
package/src/core/services/loan-token-poller.js +63 -16
package/src/ia-book-actions.js +337 -247
package/test/core/services/actions-handler.test.js +110 -1
package/test/core/services/loan-renew-helper.test.js +1 -1
package/test/core/services/loan-token-poller.test.js +76 -0
package/test/ia-book-actions.test.js +716 -7

package/index.html CHANGED Viewed

@@ -38,11 +38,13 @@
     fieldset {
       width: fit-content;
+      max-width: 100%;
+      box-sizing: border-box;
       margin-top: 50px;
     }
     fieldset legend {
       text-align: left;
-      font-size: 12px;
+      font-size: 14px;
     }
     td {
       color: white;
@@ -52,7 +54,7 @@
       text-align: initial;
       margin: 5px 0;
       width: max-content;
-      display: block;
+      display: inline;
     }
     label {
       padding: 10px;
@@ -83,9 +85,107 @@
       border-radius: 10px;
     }
+    .timer-presets {
+      display: flex;
+      gap: 6px;
+      flex-wrap: wrap;
+      max-width: 100%;
+    }
+    .timer-presets button {
+      padding: 6px 10px;
+      cursor: pointer;
+      border: 2px solid #194880;
+      border-radius: 10px;
+      background: white;
+      height: 50px;
+    }
+    .timer-presets button.active-preset {
+      background: #194880;
+      color: white;
+    }
+    #live-status-wrapper {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      flex-wrap: wrap;
+      /* width: min(400px, 100%); */
+      /* display: flex; gap: 3rem; margin: 0 3rem; flex-wrap: wrap; */
+    }
+    #loan-status-row,
+    #lending-bar-controls {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 3rem;
+      margin: 0 3rem;
+    }
+    @media (max-width: 700px) {
+      #loan-status-row,
+      #lending-bar-controls {
+        grid-template-columns: 1fr;
+      }
+    }
+    .loan-status-badge {
+      display: inline-block;
+      padding: 8px 14px;
+      border-radius: 6px;
+      font-size: 14px;
+      font-weight: bold;
+      letter-spacing: 0.5px;
+      color: white;
+    }
+    .loan-status-badge.status-active {
+      background: #2e7d32; /* green: loan is currently checked out */
+    }
+    .loan-status-badge.status-renewing {
+      background: #b8860b; /* amber: a renew_loan attempt is in flight */
+    }
+    .loan-status-badge.status-returned {
+      background: #d9534f; /* red: auto-returned / not on loan */
+    }
+    .loan-status-badge.status-none {
+      background: #666; /* gray: nothing borrowed yet */
+    }
+    #live-status-detail {
+      color: white;
+      background: #333;
+      padding: 8px 12px;
+      border-radius: 6px;
+      font-size: 12px;
+      text-align: left;
+      flex: 1;
+    }
+    #exec-log {
+      text-align: left;
+      background: #111;
+      color: #9fef9f;
+      font-family: monospace;
+      font-size: 11px;
+      max-height: 160px;
+      overflow-y: auto;
+      padding: 8px;
+      border-radius: 6px;
+      margin-top: 8px;
+      white-space: pre-wrap;
+      word-break: break-word;
+    }
+    #exec-log div + div {
+      border-top: 1px solid #333;
+      padding-top: 2px;
+      margin-top: 2px;
+    }
+    #auto-renew-controls {
+      display: none1;
+    }
     body.modal-manager-open {
       overflow: hidden;
     }
+    #action-bar-modal {
+      --modalWidth: 35rem;
+    }
     modal-manager[mode='closed'] {
       display: none;
@@ -96,6 +196,44 @@
 <body>
   <ia-book-actions></ia-book-actions>
+  <script>
+    /* eslint-disable */
+    // WEBDEV-8322: capture the library's `log()` lines — API calls
+    // (create_token/browse_book/borrow_book/renew_loan/return_loan and their
+    // success/error from ActionsHandlerService), lifecycle events
+    // ([IABookActions]: page-turn/BookReader:userAction received,
+    // visibilitychange backgrounded/foregrounded, browseHasExpired,
+    // showWarningModal, handleLoanAutoRenewed, etc), and anything the demo
+    // itself triggers ([Demo]: user_has_browsed set, error-mode toggled,
+    // etc) — into the live status panel below, so QA can see everything
+    // that happened without opening devtools. GA event-mirroring noise
+    // (`eventCategory:- ...`) is the one thing still filtered out.
+    //
+    // This MUST run as a plain (non-module) script BEFORE the `type="module"`
+    // script's imports execute: `log.js` binds its own reference to
+    // `console.log` the moment it's imported, so overriding console.log any
+    // later (even earlier in the module script's own source) would miss it —
+    // ES module imports always run before the importing module's own
+    // top-level code, regardless of source order.
+    window.__execLog = [];
+    const __nativeConsoleLog = console.log.bind(console);
+    console.log = (...consoleArgs) => {
+      __nativeConsoleLog(...consoleArgs);
+      const loggedPrefixes = ['[IABookActions]', '[IABookActions]', '[Demo]'];
+      if (typeof consoleArgs[0] !== 'string' || !loggedPrefixes.some((prefix) => consoleArgs[0].startsWith(prefix))) {
+        return;
+      }
+      const time = new Date().toISOString().split('T')[1].replace('Z', '');
+      const text = `[${time}] ` + consoleArgs
+        .map((arg) => (typeof arg === 'object' ? JSON.stringify(arg) : String(arg)))
+        .join(' ');
+      window.__execLog.push(text);
+      if (window.__renderExecLogEntry) window.__renderExecLogEntry(text);
+    };
+  </script>
   <script type="module">
     /* eslint-disable */
@@ -139,31 +277,32 @@
     iaBookActions.returnUrl = '';
     iaBookActions.localCache = localCache;
-    let loanTotalTime2Min = { loanTotalTime: 120, loanRenewAtLast: 110, pageChangedInLast: 30 };
-    let loanTotalTime5Min = { loanTotalTime: 300, loanRenewAtLast: 240, pageChangedInLast: 60 };
-    let loanTotalTime10Min = { loanTotalTime: 600, loanRenewAtLast: 480, pageChangedInLast: 120 };
-    let loanTotalTime30Min = { loanTotalTime: 1800, loanRenewAtLast: 1500, pageChangedInLast: 600 };
-    let loanTotalTime1Hour = { loanTotalTime: 3600, loanRenewAtLast: 660, pageChangedInLast: 900 };
+    // Loan-duration presets for QA — pick a short one (15s/30s) to run through
+    // the full warn -> auto-return -> silent-reborrow lifecycle quickly, or a
+    // longer one (60min matches the real 1-hour production default) to check
+    // the timing math. `?timer=` accepts any key below (e.g. ?timer=15s).
+    const timerPresets = {
+      '15s': { loanTotalTime: 15, loanRenewAtLast: 13, pageChangedInLast: 5 },
+      '30s': { loanTotalTime: 30, loanRenewAtLast: 27, pageChangedInLast: 10 },
+      '2': { loanTotalTime: 120, loanRenewAtLast: 95, pageChangedInLast: 15 },
+      '5': { loanTotalTime: 300, loanRenewAtLast: 240, pageChangedInLast: 60 },
+      '10': { loanTotalTime: 600, loanRenewAtLast: 480, pageChangedInLast: 120 },
+      '30': { loanTotalTime: 1800, loanRenewAtLast: 1500, pageChangedInLast: 600 },
+      '60': { loanTotalTime: 3600, loanRenewAtLast: 660, pageChangedInLast: 900 }, // production default
+    };
-    iaBookActions.loanRenewTimeConfig = loanTotalTime2Min;
     let params = new URLSearchParams(document.location.search);
-    switch (params.get("timer")) {
-      case '5':
-        iaBookActions.loanRenewTimeConfig = loanTotalTime5Min;
-        break;
-      case '10':
-        iaBookActions.loanRenewTimeConfig = loanTotalTime10Min;
-        break;
-      case '30':
-        iaBookActions.loanRenewTimeConfig = loanTotalTime30Min;
-        break;
-      case '60':
-        iaBookActions.loanRenewTimeConfig = loanTotalTime1Hour;
-        break;
-      default:
-        iaBookActions.loanRenewTimeConfig = loanTotalTime2Min;
-        break;
-    }
+    const activeTimerKey = timerPresets[params.get('timer')] ? params.get('timer') : '2';
+    iaBookActions.loanRenewTimeConfig = timerPresets[activeTimerKey];
+    document.querySelectorAll('.timer-presets button').forEach((button) => {
+      if (button.dataset.timer === activeTimerKey) button.classList.add('active-preset');
+      button.addEventListener('click', () => {
+        const searchParams = new URLSearchParams(window.location.search);
+        searchParams.set('timer', button.dataset.timer);
+        window.location.search = searchParams.toString();
+      });
+    });
     let lendingStatus1 = iaBookActions.lendingStatus;
     let secondsLeftOnLoan = iaBookActions.loanRenewTimeConfig.loanTotalTime;
@@ -202,6 +341,8 @@
         item.checked = true;
       }
       item.addEventListener('click', (e) => {
+        console.log(`[Demo] error-response mode ${e.target.checked ? 'enabled' : 'disabled'}`);
         var searchParams = new URLSearchParams(window.location.search);
         var separate = '';
         if (e.target.checked) {
@@ -251,6 +392,8 @@
     document.querySelectorAll('.availableToBrowse input[type=radio]').forEach((item) => {
       item.addEventListener('click', async (e) => {
+        console.log(`[Demo] "${e.target.value}" selected under availableToBrowse`);
         if (e.target.value === 'user_has_browsed') {
           lendingStatus1.user_has_browsed = true;
           lendingStatus1.available_to_browse = false;
@@ -289,32 +432,48 @@
       });
     });
+    // WEBDEV-8322 scenario 1: informational-only warning modal.
+    // "Okay" (or closing it) must NOT renew the loan — only interacting
+    // with the book (scenario 3 below) does that.
     document.querySelector('#show_warning_modal').addEventListener('click', async () => {
+      console.log('[Demo] scenario 1 button clicked: show warning modal');
       if (!iaBookActions.lendingStatus.user_has_browsed) {
         const newLendingStatus = { ...iaBookActions.lendingStatus, user_has_browsed: true };
         iaBookActions.lendingStatus = newLendingStatus;
         await iaBookActions.updateComplete;
       }
+      // showWarningModal() reads its message text from
+      // loanRenewHelper.getMessageTexts(loanRenewResult.texts, ...) — that
+      // helper only exists, and loanRenewResult.texts only gets populated,
+      // once autoLoanRenewChecker() has run at least once (this is what the
+      // real periodic timer calls before ever showing the modal). Run it
+      // here too so the button shows the same populated message a real
+      // warning would.
+      await iaBookActions.autoLoanRenewChecker(false);
       iaBookActions.showWarningModal();
-      if (iaBookActions.lendingStatus.user_has_browsed) {
-        iaBookActions.showWarningModal();
-      }
     });
+    // WEBDEV-8322 scenario 2: loan auto-returned due to inactivity.
+    // No modal should appear and the page should NOT refresh — the reader
+    // just silently sits on whatever page it was on.
     document.querySelector('#show_expired_modal').addEventListener('click', async () => {
+      console.log('[Demo] scenario 2 button clicked: force auto-return');
       if (!iaBookActions.lendingStatus.user_has_browsed) {
         const newLendingStatus = { ...iaBookActions.lendingStatus, user_has_browsed: true };
         iaBookActions.lendingStatus = newLendingStatus;
         await iaBookActions.updateComplete;
       }
-      await new Promise(resolve => setTimeout(resolve, 5000));
+      await new Promise(resolve => setTimeout(resolve, 100));
       iaBookActions.browseHasExpired();
     });
+    // WEBDEV-8322 scenario 4: patron returns to the tab after time away.
+    // If the loan already expired while hidden, this silently attempts to
+    // re-borrow (same success/failure paths as scenario 3).
     document.querySelector('#resync_timer').addEventListener('click', async (e) => {
+      console.log('[Demo] scenario 4 button clicked: simulate visibilitychange (tab return)');
       if (iaBookActions.lendingStatus.user_has_browsed) {
         document.querySelector('ia-book-actions').dispatchEvent(
           new Event('visibilitychange', {
@@ -324,7 +483,7 @@
           })
         );
       }
-      await new Promise(resolve => setTimeout(resolve, 5000));
+      await new Promise(resolve => setTimeout(resolve, 1000));
     });
     document.querySelectorAll('.availableToBorrow input[type=radio]').forEach((item) => {
@@ -373,101 +532,240 @@
       })
     });
-    document.querySelector('.pageChangedEvent').addEventListener('click', () => {
-      // dispatch event to say book page has flipped
-      document.querySelector('ia-book-actions').dispatchEvent(
-        new CustomEvent('BookReader:userAction', {
-          detail: {},
-          bubbles: true,
-          composed: true,
-        })
-      );
-    })
+    // WEBDEV-8322 scenario 3: patron interacts with the book (turns a page,
+    // etc). If the loan already expired (run scenario 2 first), this
+    // silently retries the loan — enable the error checkbox above beforehand
+    // to simulate someone else having already borrowed the book, which
+    // should surface the "Due to inactivity..." modal instead.
+    document.querySelectorAll('.pageChangedEvent').forEach((button) => {
+      button.addEventListener('click', () => {
+        console.log('[Demo] page-change / BookReader:userAction dispatched');
+        document.querySelector('ia-book-actions').dispatchEvent(
+          new CustomEvent('BookReader:userAction', {
+            detail: {},
+            bubbles: true,
+            composed: true,
+          })
+        );
+      });
+    });
     // listen for IABookReader:BrowsingHasExpired
     window.addEventListener('IABookReader:BrowsingHasExpired', () => {
       console.log('IABookReader:BrowsingHasExpired EVENT FIRED');
     });
+    // WEBDEV-8322 live status panel — the action bar alone doesn't always
+    // visibly change (e.g. right after auto-return), so mirror what the
+    // library's own log() calls already say is happening (create_token,
+    // renew_loan, browse_book, return_loan, and their success/error — see
+    // ActionsHandlerService) into an on-page log QA can read without
+    // opening devtools. The console.log interception itself lives in the
+    // plain <script> above this module script — see the comment there for
+    // why it can't live here.
+    const execLogEl = document.querySelector('#exec-log');
+    const loanStatusBadgeEl = document.querySelector('#loan-status-badge');
+    const liveStatusDetailEl = document.querySelector('#live-status-detail');
+    function renderExecLogEntry(text) {
+      const line = document.createElement('div');
+      line.textContent = text;
+      execLogEl.appendChild(line);
+      execLogEl.scrollTop = execLogEl.scrollHeight;
+    }
+    window.__renderExecLogEntry = renderExecLogEntry;
+    // flush anything logged before this module script finished loading
+    window.__execLog.forEach(renderExecLogEntry);
+    document.querySelector('#clear-exec-log').addEventListener('click', () => {
+      execLogEl.textContent = '';
+      window.__execLog = [];
+    });
+    // The loan-status badge answers one question only: is the loan ACTIVE
+    // or has it been RETURNED? `browsingExpired` is the exact flag the
+    // library flips the instant auto-return executes (browseHasExpired()),
+    // so the badge changes in the same tick — even though the action bar
+    // itself doesn't show a modal or refresh at that moment.
+    function computeLoanStatus() {
+      const lendingStatus = iaBookActions.lendingStatus || {};
+      // Checked first: autoRenewExpiredLoan() optimistically flips
+      // browsingExpired back to false the moment a retry starts (before the
+      // renew_loan call has actually landed), so without this check the
+      // badge would misleadingly jump straight to ACTIVE during the retry.
+      if (iaBookActions.loanRenewInProgress) {
+        return { badge: 'RENEWING', className: 'status-renewing' };
+      }
+      if (lendingStatus.browsingExpired) {
+        return { badge: 'RETURNED', className: 'status-returned' };
+      }
+      if (lendingStatus.user_has_browsed) {
+        return { badge: 'ACTIVE', className: 'status-active' };
+      }
+      return { badge: 'NO LOAN', className: 'status-none' };
+    }
+    function computeLiveStatusDetail() {
+      const lendingStatus = iaBookActions.lendingStatus || {};
+      if (iaBookActions.loanRenewInProgress) {
+        return '🔄 Attempting silent re-borrow (create_token → renew_loan)…';
+      }
+      if (iaBookActions.warningModalOpen) {
+        return '⚠️ Warning modal open — closing it will NOT renew the loan';
+      }
+      if (lendingStatus.browsingExpired) {
+        return 'Auto-returned due to inactivity. By design: no modal, no refresh — only this badge and the action bar (Borrow) reflect it, until the patron interacts again.';
+      }
+      if (lendingStatus.user_has_browsed) {
+        const secondsLeft = Math.round(Number(lendingStatus.secondsLeftOnLoan || 0));
+        return `~${secondsLeft}s left on this loan`;
+      }
+      return 'Not currently browsing this book';
+    }
+    setInterval(() => {
+      const { badge, className } = computeLoanStatus();
+      loanStatusBadgeEl.textContent = badge;
+      loanStatusBadgeEl.className = `loan-status-badge ${className}`;
+      liveStatusDetailEl.textContent = computeLiveStatusDetail();
+    }, 250);
   </script>
   <div>
-    <fieldset>
-      <legend>Dev testing for book title bar</legend>
-        <table class="initial">
-          <tr>
-            <td class="titleBar">
-              <label><input type="checkbox" name="title" value="title" />Title Bar</label>
-            </td>
-            <td class="searchParam">
-              <label><input type="checkbox" name="search" value="Search Param" />Search Param</label>
-            </td>
-            <td>
-              <label class="ia-button"><button class="pageChangedEvent">Page Change Event</button></label>
-            </td>
-          </tr>
-        </table>
-    </fieldset>
-    <fieldset>
-      <legend>Dev testing for book action bar</legend>
-        <table class="initial">
-          <tr colspan='5'>
-            <td class="errorEnable"><label><input type="checkbox" name="errorEnable" value="errorEnable" />Do you want to see error response?</label></td>
-          </tr>
-          <tr>
-            <td class="userState">
-              <label><input type="checkbox" name="user" value="isAdmin" />isAdmin</label>
-              <label><input type="checkbox" name="user" value="isLoggedIn" />isLoggedIn</label>
-            </td>
-            <td class="printDisabled">
-              <label><input type="checkbox" name="is_printdisabled" value="is_printdisabled" />is_printdisabled</label>
-              <label><input type="checkbox" name="user_is_printdisabled" value="user_is_printdisabled" />user_is_printdisabled</label>
-            </td>
-            <td class="availableToBrowse">
-              <label><input type="radio" name="browse" value="available_to_browse" />available_to_browse</label>
-              <label><input type="radio" name="browse" value="user_has_browsed" />user_has_browsed</label>
-              <label><input type="radio" name="browse" value="browsingExpired" />browsingExpired</label>
-            </td>
-            <td class="availableToBorrow">
-              <label><input type="radio" name="borrow" value="available_to_borrow" />available_to_borrow</label>
-              <label><input type="radio" name="borrow" value="user_on_waitlist" />user_on_waitlist</label>
-              <label><input type="radio" name="borrow" value="user_can_claim_waitlist" />user_can_claim_waitlist</label>
-              <label><input type="radio" name="borrow" value="available_to_waitlist" />available_to_waitlist</label>
-              <label><input type="radio" name="borrow" value="user_has_borrowed" />user_has_borrowed</label>
-            </td>
-            <td class="purchase">
-              <label><input type="checkbox" name="purchase" value="purchase" />purchase</label>
-            </td>
-            <td class="reflect">
-              <input type="button" style="padding: 10px;
-              background: #194880;
-              color: white;
-              font-weight: bold; display: none" name="purchase" value="Reflect" />
-            </td>
-          </tr>
-          <tr>
-            <td>
-              <fieldset style="margin-top: 10px;">
-                <legend style="color: black;">controls for browsed book</legend>
-                  <table aria-hidden="true">
-                    <tbody><tr>
-                      <td class="action-button">
-                        <button id="show_warning_modal">When Browsing (`user_has_browsed`),<br> show Warning Modal</button>
-                      </td>
-                      <td class="action-button">
-                        <button id="show_expired_modal">While Browsing (`user_has_browsed`),<br> Expire book & show its modal</button>
-                      </td>
-                      <td class="action-button">
-                        <button id="resync_timer">While Browsing (`user_has_browsed`),<br> resync timer</button>
-                      </td>
-                    </tr>
-                  </tbody></table>
-              </fieldset>
-            </td>
-          </tr>
-        </table>
-    </fieldset>
+    <div id="loan-status-row">
+      <fieldset>
+        <legend>WEBDEV-8322: loan duration for testing (reloads page)</legend>
+        <div class="timer-presets">
+          <button data-timer="15s">15 sec</button>
+          <button data-timer="30s">30 sec</button>
+          <button data-timer="2">2 min (default)</button>
+          <button data-timer="5">5 min</button>
+          <button data-timer="10">10 min</button>
+          <button data-timer="30">30 min</button>
+          <button data-timer="60">60 min (production default)</button>
+        </div>
+        <p style="color: #666; font-size: 11px; margin: 4px 0 0;">
+          Pick 15s/30s to watch the whole warn &rarr; auto-return &rarr; silent-reborrow
+          lifecycle play out on its own in under a minute, without clicking the scenario
+          buttons below.
+        </p>
+      </fieldset>
+      <fieldset>
+        <legend>WEBDEV-8322: live loan status (the action bar alone won't always make this obvious)</legend>
+        <div id="live-status-wrapper">
+          <span id="loan-status-badge" class="loan-status-badge status-none">NO LOAN</span>
+          <div id="live-status-detail">Not currently browsing this book</div>
+        </div>
+        <div id="exec-log"></div>
+        <p style="color: #666; font-size: 11px; margin: 4px 0 0; text-align: left;">
+          The badge flips to RETURNED the instant auto-return fires (scenario 2) — even though
+          no modal appears and the page doesn't refresh, per the ticket. The log below mirrors
+          every create_token / browse_book / renew_loan / return_loan call and its success/error
+          result as it happens.
+        </p>
+        <button id="clear-exec-log" style="margin-top: 6px; padding: 4px 8px; cursor: pointer;">Clear log</button>
+      </fieldset>
+    </div>
+    <div id="auto-renew-controls">
+      <fieldset style="margin-top: 10px;">
+        <legend style="color: black;">WEBDEV-8322: loan auto-renew QA scenarios (requires `user_has_browsed`)</legend>
+          <table aria-hidden="true">
+            <tbody><tr>
+              <td class="action-button">
+                <button id="show_warning_modal">1. Show "Are you still there?" modal<br>(Okay does NOT renew the loan)</button>
+              </td>
+              <td class="action-button">
+                <button id="show_expired_modal">2. Auto-return due to inactivity<br>(no modal, page stays put)</button>
+              </td>
+              <td class="action-button">
+                <button class="pageChangedEvent">
+                  3. Interact with book (turn page)<br>
+                  silently renew while active or after auto-return
+                </button>
+              </td>
+              <td class="action-button">
+                <button id="resync_timer">4. Return to tab after time away<br>(visibilitychange — silent retry if expired)</button>
+              </td>
+            </tr>
+          </tbody></table>
+          <p style="color: #666; font-size: 11px; margin: 8px 0 0;">
+            Try 2 → 3 (or 2 → 4) in sequence to walk through the full "auto-returned, then patron
+            keeps reading" flow the ticket describes.
+          </p>
+      </fieldset>
+    </div>
+    <div id="lending-bar-controls">
+      <fieldset>
+        <legend>Dev testing for book title bar</legend>
+          <table class="initial">
+            <tr>
+              <td class="titleBar">
+                <label><input type="checkbox" name="title" value="title" />Title Bar</label>
+              </td>
+              <td class="searchParam">
+                <label><input type="checkbox" name="search" value="Search Param" />Search Param</label>
+              </td>
+            </tr>
+          </table>
+      </fieldset>
+      <fieldset>
+        <legend>Dev testing for book action bar</legend>
+          <table class="initial">
+            <tr colspan='5'>
+              <td class="errorEnable">
+                <label><input type="checkbox" name="errorEnable" value="errorEnable" />Do you want to see error response?</label>
+                <span style="color: #666; font-size: 11px; display: block; padding: 0 10px 10px;">
+                  Tip: turn this on before scenarios 3/4 below to simulate someone else having
+                  already borrowed the book (shows the "Due to inactivity..." modal).
+                </span>
+              </td>
+            </tr>
+            <tr>
+              <td class="userState">
+                <label><input type="checkbox" name="user" value="isAdmin" />isAdmin</label>
+                <label><input type="checkbox" name="user" value="isLoggedIn" />isLoggedIn</label>
+              </td>
+              <td class="printDisabled">
+                <label><input type="checkbox" name="is_printdisabled" value="is_printdisabled" />is_printdisabled</label>
+                <label><input type="checkbox" name="user_is_printdisabled" value="user_is_printdisabled" />user_is_printdisabled</label>
+              </td>
+              <td class="availableToBrowse">
+                <label><input type="radio" name="browse" value="available_to_browse" />available_to_browse</label>
+                <label><input type="radio" name="browse" value="user_has_browsed" />user_has_browsed</label>
+                <label><input type="radio" name="browse" value="browsingExpired" />browsingExpired</label>
+              </td>
+              <td class="availableToBorrow">
+                <label><input type="radio" name="borrow" value="available_to_borrow" />available_to_borrow</label>
+                <label><input type="radio" name="borrow" value="user_on_waitlist" />user_on_waitlist</label>
+                <label><input type="radio" name="borrow" value="user_can_claim_waitlist" />user_can_claim_waitlist</label>
+                <label><input type="radio" name="borrow" value="available_to_waitlist" />available_to_waitlist</label>
+                <label><input type="radio" name="borrow" value="user_has_borrowed" />user_has_borrowed</label>
+              </td>
+              <td class="purchase">
+                <label><input type="checkbox" name="purchase" value="purchase" />purchase</label>
+              </td>
+              <td class="reflect">
+                <input type="button" style="padding: 10px;
+                background: #194880;
+                color: white;
+                font-weight: bold; display: none" name="purchase" value="Reflect" />
+              </td>
+            </tr>
+            <tr>
+              <td>
+              </td>
+            </tr>
+          </table>
+      </fieldset>
+    </div>
   </div>
   <modal-manager></modal-manager>
 </body>

package/package.json CHANGED Viewed

@@ -3,11 +3,11 @@
   "description": "Bookreader actions for borrowable book",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/internetarchive/iaux-account-settings.git"
+    "url": "git+https://github.com/internetarchive/iaux-book-actions.git"
   },
   "author": "Internet Archive",
   "license": "AGPL-3.0-only",
-  "version": "1.4.3",
+  "version": "1.4.4-alpha10",
   "main": "index.js",
   "module": "index.js",
   "publishConfig": {