@internetarchive/bookreader 5.0.0-32-shadydom → 5.0.0-32-1

package/BookReaderDemo/demo-internetarchive.html

@@ -7,6 +7,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <meta name="apple-mobile-web-app-capable" content="yes">
 
+    <!-- WC dependencies -->
+    <script type="text/javascript" src="https://polyfill.io/v3/polyfill.min.js?features=es2015%2Ces5%2CglobalThis"></script>
+    <script type="text/javascript" src="https://unpkg.com/lit@2.1.2/polyfill-support.js"></script>
+    <script type="text/javascript" src="https://unpkg.com/@webcomponents/webcomponentsjs@2.2.10/webcomponents-bundle.js"></script>
+
     <!-- JS dependencies -->
     <script src="../BookReader/webcomponents-bundle.js"></script>
     <script src="../BookReader/jquery-1.10.1.js"></script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/bookreader",
-  "version": "5.0.0-32-shadydom",
+  "version": "5.0.0-32-1",
   "description": "The Internet Archive BookReader.",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
   "private": false,
   "dependencies": {
     "@internetarchive/ia-activity-indicator": "^0.0.1",
-    "@internetarchive/ia-item-navigator": "0.0.5-1",
+    "@internetarchive/ia-item-navigator": "0.0.5",
     "@internetarchive/ia-menu-slider": "^1.1.1",
     "@internetarchive/ia-sharing-options": "^0.1.4",
     "@internetarchive/icon-bookmark": "^1.1.3",

package/src/BookNavigator/bookmarks/bookmarks-provider.js

@@ -16,7 +16,7 @@ export default class BookmarksProvider {
       signedIn,
       bookreader,
       modal,
-      onProviderChange
+      onProviderChange,
     } = options;
 
     const referrerStr = `referer=${encodeURIComponent(location.href)}`;

package/src/BookNavigator/bookmarks/ia-bookmarks.js

@@ -142,8 +142,8 @@ class IABookmarks extends LitElement {
     if (this.displayMode === 'login') {
       return;
     }
+    this.fetchUserBookmarks();
     this.setBREventListeners();
-    this.initializeBookmarks();
   }
 
   updateDisplay() {
@@ -153,6 +153,9 @@ class IABookmarks extends LitElement {
   }
 
   fetchUserBookmarks() {
+    if (!this.api.identifier) {
+      return;
+    }
     this.fetchBookmarks()
       .then(() => {
         this.initializeBookmarks();
@@ -227,7 +230,7 @@ class IABookmarks extends LitElement {
   }
 
   fetchBookmarks() {
-    return this.api.getAll().then((res) => {
+    return this.api.getAll().then(res => res.text()).then((res) => {
       let response;
       try {
         response = JSON.parse(res);

package/src/ia-bookreader/ia-bookreader.js

@@ -105,7 +105,7 @@ export class IaBookReader extends LitElement {
 
   render() {
     return html`
-      <div>
+      <div class="main-component">
         <ia-item-navigator
           ?viewportInFullscreen=${this.fullscreen}
           .basehost=${this.baseHost}
@@ -170,17 +170,21 @@ export class IaBookReader extends LitElement {
         min-height: unset;
       }
 
-      div[slot="main"] {
-        display: flex;
+      .main-component {
+        height: 100%;
         width: 100%;
+        min-height: inherit;
       }
 
-      slot[name="main"] {
-        flex: 1;
+      div[slot="header"],
+      div[slot="main"] {
+        display: flex;
+        width: 100%;
       }
 
       slot {
         display: block;
+        flex: 1;
       }
 
       ia-item-navigator {

package/tests/karma/BookNavigator/bookmarks/ia-bookmarks.test.js

@@ -0,0 +1,57 @@
+import {
+  html,
+  fixtureSync,
+  expect,
+  fixtureCleanup,
+} from '@open-wc/testing';
+import '../../../../src/BookNavigator/bookmarks/ia-bookmarks.js';
+import sinon from 'sinon';
+
+afterEach(() => {
+  sinon.restore();
+  fixtureCleanup();
+});
+
+describe('<ia-bookmarks>', () => {
+  it('uses `setup` to start component', async () => {
+    const el = fixtureSync(html`<ia-bookmarks></ia-bookmarks>`);
+    await el.updateComplete;
+
+    let fetchHappened = false;
+    el.bookreader.bookId = 'foo';
+    el.displayMode = 'bookmarks';
+
+    el.fetchBookmarks = async () => {
+      fetchHappened = true;
+      return await Promise.resolve();
+    };
+
+    const fetchSpy = sinon.spy(el, 'fetchUserBookmarks');
+
+    el.setup();
+    await el.updateComplete;
+
+    expect(fetchSpy.callCount).to.equal(1);
+    expect(fetchHappened).to.equal(true);
+  });
+  it('does not fetch user bookmarks if displayMode = login', async () => {
+    const el = fixtureSync(html`<ia-bookmarks></ia-bookmarks>`);
+    await el.updateComplete;
+
+    let fetchHappened = false;
+    el.displayMode = 'login';
+
+    el.fetchBookmarks = async () => {
+      fetchHappened = true;
+      return await Promise.resolve();
+    };
+
+    const fetchSpy = sinon.spy(el, 'fetchUserBookmarks');
+
+    el.setup();
+    await el.updateComplete;
+
+    expect(fetchSpy.callCount).to.equal(0);
+    expect(fetchHappened).to.equal(false);
+  });
+});