@internetarchive/ia-book-actions 0.0.29-alpha37 → 0.0.29-alpha38

package/demo/index.html

@@ -133,8 +133,8 @@
 
     let isDevBox = true;
     iaBookActions.loanRenewConfig = {
-      totalTime: isDevBox ? 13 : 3600, // 60 second = 1 min
-      autoCheckAt: isDevBox ? 10 : 3540, // at last 10th minute
+      totalTime: isDevBox ? 10 : 3600, // 60 second = 1 min
+      autoCheckAt: isDevBox ? 5 : 3540, // at last 10th minute
       pageChangedInLast: isDevBox ? 5 : 900, // within last 15 second/minute
       isDevBox: isDevBox,
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/ia-book-actions",
-  "version": "0.0.29-alpha37",
+  "version": "0.0.29-alpha38",
   "description": "Bookreader actions for borrowable book",
   "author": "Internet Archive",
   "license": "AGPL-3.0-only",

package/src/ia-book-actions.js

@@ -72,15 +72,22 @@ export default class IABookActions extends LitElement {
     this.borrowType = ''; // (browsed|borrowed)
     this.consecutiveLoanCounts = 1; // consecutive loan count
 
-    // loan auto renew
-    this.browserTimer = undefined;
+    /**
+     * contains loan renew time config
+     * - totalTime:- number of seconds a loan should last
+     * - autoCheckAt:- check for loan renew at last
+     * - pageChangedInLast: consider loan renew eligible in last
+     * - isDevBox:- it just for testing purpose
+     */
     this.loanRenewConfig = {};
     this.suppressToast = false;
+    this.browseTimer = undefined;
 
     /**
      * contains loan auto-renew response
      * - texts:- texts messages need to show in toast message
      * - renewNow:- key to determine if need to renew now
+     * - timeLeft:- number of seconds left in active loan
      */
     this.loanRenewResult = {
       texts: null,
@@ -92,7 +99,7 @@ export default class IABookActions extends LitElement {
   }
 
   disconnectedCallback() {
-    this.tokenPoller.disconnectedInterval();
+    this.tokenPoller?.disconnectedInterval();
     window?.Sentry?.captureMessage(sentryLogs.disconnectedCallback);
     this.disconnectResizeObserver();
   }
@@ -252,17 +259,17 @@ export default class IABookActions extends LitElement {
     /**
      * Detech click-event on document to close toast-template
      */
-    document.addEventListener('click', () => {
+    document.addEventListener('click', e => {
       if (this.loanRenewHelper && this.loanRenewResult.timeLeft > 0) {
         console.log('clicked-outside');
         this.suppressToast = true;
       }
 
-      // reload when user click on page after it EXPIRED
+      // reload when user click on book-page and book is EXPIRED
       const hasExpired =
         'browsingExpired' in this.lendingStatus &&
         this.lendingStatus?.browsingExpired;
-      if (hasExpired) {
+      if (hasExpired && e.target.nodeName !== 'IA-BOOK-ACTIONS') {
         window.location?.reload();
       }
     });
@@ -283,6 +290,11 @@ export default class IABookActions extends LitElement {
     });
   }
 
+  /**
+   * To determine if need to be renewed browsed book
+   *
+   * @param {Boolean} hasPageChanged
+   */
   async autoLoanRenewChecker(hasPageChanged = false) {
     this.loanRenewHelper = new LoanRenewHelper(
       hasPageChanged,
@@ -304,7 +316,9 @@ export default class IABookActions extends LitElement {
   async showToastMessage() {
     if (this.suppressToast) return;
 
-    const iaBookActions = document.querySelector('ia-book-actions').shadowRoot;
+    const iaBookActions = document.querySelector('ia-book-actions')?.shadowRoot;
+    if (!iaBookActions) return;
+
     let toastTemplate = iaBookActions.querySelector('toast-template');
     if (!toastTemplate) {
       toastTemplate = document.createElement('toast-template');
@@ -338,8 +352,7 @@ export default class IABookActions extends LitElement {
   }
 
   startBrowseTimer() {
-    clearTimeout(this.browserTimer);
-
+    clearTimeout(this.browseTimer);
     const {
       browsingExpired,
       user_has_browsed,
@@ -349,7 +362,7 @@ export default class IABookActions extends LitElement {
       return;
     }
 
-    this.browserTimer = setTimeout(() => {
+    this.browseTimer = setTimeout(() => {
       this.browseHasExpired();
     }, secondsLeftOnLoan * 1000);
   }
@@ -358,11 +371,11 @@ export default class IABookActions extends LitElement {
    * Execute when loan is expired
    */
   async browseHasExpired() {
-    clearTimeout(this.browserTimer);
-
     const currStatus = { ...this.lendingStatus, browsingExpired: true };
     this.lendingStatus = currStatus;
 
+    this.tokenPoller?.disconnectedInterval();
+
     // remove respected key:value for loan-renew
     await this.localCache.delete(`${this.identifier}-loanTime`);
     await this.localCache.delete(`${this.identifier}-pageChangedTime`);
@@ -468,7 +481,7 @@ export default class IABookActions extends LitElement {
    */
   async handleLoanAutoRenewed() {
     if (this.loanRenewResult.renewNow) {
-      this.tokenPoller.disconnectedInterval();
+      this.tokenPoller?.disconnectedInterval();
 
       this.suppressToast = false;
       await this.showToastMessage();
@@ -491,7 +504,7 @@ export default class IABookActions extends LitElement {
   startLoanTokenPoller() {
     if (this.tokenPoller) {
       window?.Sentry?.captureMessage(sentryLogs.clearTokenPoller);
-      this.tokenPoller.disconnectedInterval();
+      this.tokenPoller?.disconnectedInterval();
     }
     const successCallback = () => {
       this.lendingBarPostInit();
@@ -551,7 +564,7 @@ export default class IABookActions extends LitElement {
     // - clear tokenPoller interval
     // - set user_has_browsed to `false`
     if (action === 'create_token') {
-      this.tokenPoller.disconnectedInterval();
+      this.tokenPoller?.disconnectedInterval();
 
       const currStatus = {
         ...this.lendingStatus,

package/test/ia-book-actions.test.js

@@ -230,9 +230,14 @@ describe('Browsing expired status', () => {
         },
       })
     );
-    expect(el.primaryTitle).contains('Borrow ends at ');
+    expect(el.primaryTitle).contains('');
     expect(el.primaryActions[0].text).to.equal('Return now');
     expect(el.primaryActions[1].text).to.equal('Print Disability Access');
+
+    // default params of one-hour loan renew
+    expect(el.loanRenewResult.texts).to.equal(null);
+    expect(el.loanRenewResult.renewNow).to.equal(false);
+    expect(el.loanRenewResult.timeLeft).to.equal(0);
   });
 
   it('Book is browsing and going to expire after 1 second', async () => {
@@ -248,10 +253,63 @@ describe('Browsing expired status', () => {
       })
     );
 
+    // timer-countdown is still active
+    expect(el.shadowRoot.querySelector('timer-countdown')).to.not.be.null;
+
     await aTimeout(1500); // wait for 1.5 second
     await el.updateComplete;
 
     expect(el.primaryActions[0].text).to.equal('Borrow');
+
+    // timer-countdown is gone now
+    expect(el.shadowRoot.querySelector('timer-countdown')).to.be.null;
+
+    // book has been expired
+    expect(el.loanRenewResult.timeLeft).to.equal(0);
+    expect(el.loanRenewResult.texts).to.equal(
+      'This book has been automatically returned due to inactivity.'
+    );
+  });
+
+  it('Book is browsing and eligible to renew it', async () => {
+    const el = await fixture(
+      container({
+        userid: '@userid',
+        lendingStatus: {
+          is_lendable: true,
+          user_has_browsed: true,
+          browseHasExpired: false,
+          secondsLeftOnLoan: 1,
+        },
+      })
+    );
+
+    // timer-countdown is still active
+    // expect(el.shadowRoot.querySelector('timer-countdown')).to.not.be.null
+
+    // let eventReceived = false;
+    // const listener = () => {
+    //   eventReceived = true;
+    // };
+    // el.addEventListener('IABookReader:userAction', listener);
+
+    el.loanRenewResult = {
+      texts: 'book has been renewed',
+      renewNow: true,
+      timeLeft: 10,
+    };
+
+    await aTimeout(1500); // wait for 1.5 second
+    await el.updateComplete;
+
+    // // timer-countdown is gone now
+    // expect(el.shadowRoot.querySelector('timer-countdown')).to.not.be.null
+    // expect(el.shadowRoot.querySelector('toast-template')).to.not.be.null
+
+    expect(el.loanRenewResult.timeLeft).to.equal(10);
+    // // book has been expired
+    // expect(el.loanRenewResult.timeLeft).to.equal(0);
+    // expect(el.loanRenewResult.texts).to.equal('This book has been automatically returned due to inactivity.');
   });
 
   it('Expiring book cancels interval & emits event', async () => {
@@ -276,9 +334,8 @@ describe('Browsing expired status', () => {
     el.lendingStatus = browsingStatus;
     await el.updateComplete;
 
-    expect(el.primaryTitle).contains('Borrow ends at ');
+    expect(el.primaryTitle).contains('');
     expect(el.primaryActions[0].text).to.equal('Return now');
-    expect(el.tokenPoller.loanTokenInterval).to.not.equal(undefined);
 
     const expiredStatus = { ...browsingStatus, browsingExpired: true };
     el.lendingStatus = expiredStatus;
@@ -327,3 +384,40 @@ describe('Shared Resize Observer', () => {
     expect(component.sharedObserver).to.not.be.undefined;
   });
 });
+
+describe('Shared Resize Observer', () => {
+  it('can receive a Shared Resize Observer', async () => {
+    const sharedObserverStub = new SharedResizeObserver();
+    const addObserverSpy = Sinon.spy(sharedObserverStub, 'addObserver');
+    const component = await fixture(html` <ia-book-actions
+      .userid=${'@userid'}
+      .identifier=${'foo'}
+      .lendingStatus=${{
+        is_lendable: true,
+        user_has_browsed: true,
+        available_to_browse: true,
+        available_to_borrow: true,
+      }}
+      .sharedObserver=${sharedObserverStub}
+    ></ia-book-actions>`);
+    await component.updateComplete;
+
+    expect(addObserverSpy.callCount).to.equal(1);
+  });
+
+  it('loads its own resize observer if it is not received', async () => {
+    const component = await fixture(html` <ia-book-actions
+      .userid=${'@userid'}
+      .identifier=${'foo'}
+      .lendingStatus=${{
+        is_lendable: true,
+        user_has_browsed: true,
+        available_to_browse: true,
+        available_to_borrow: true,
+      }}
+    ></ia-book-actions>`);
+
+    await component.updateComplete;
+    expect(component.sharedObserver).to.not.be.undefined;
+  });
+});