@internetarchive/bookreader 5.0.0-18

package/tests/karma/BookNavigator/bookmarks/bookmark-edit.test.js

@@ -0,0 +1,133 @@
+import {
+  html,
+  fixture,
+  expect,
+  oneEvent,
+} from '@open-wc/testing';
+import '../../../../src/BookNavigator/bookmarks/bookmark-edit.js';
+
+const bookmarkColors = [{
+  id: 0,
+  className: '',
+}, {
+  id: 1,
+  className: 'blue',
+}, {
+  id: 2,
+  className: 'red',
+}, {
+  id: 3,
+  className: 'green',
+}, {
+  id: 4,
+  className: 'yellow',
+}];
+
+const container = (bookmark = {}) => (
+  html`<ia-bookmark-edit .bookmark=${bookmark} .bookmarkColors=${bookmarkColors}></ia-bookmark-edit>`
+);
+
+const bookmark = {
+  id: 2,
+  thumbnail: '//placehold.it/37x46/06c/fff',
+  page: 9,
+  note: 'This is a long comment I left about this bookmark in order to test out the display in the panel on the side of the bookreader.',
+  color: 0,
+};
+
+describe('<ia-bookmark-edit>', () => {
+  it('sets default properties', async () => {
+    const el = await fixture(container(bookmark));
+
+    expect(el.bookmark).to.equal(bookmark);
+    expect(el.renderHeader).to.be.false;
+  });
+
+  it('renders bookmark thumb and page number', async () => {
+    const el = await fixture(container(bookmark));
+
+    expect(el.shadowRoot.querySelector('img').getAttribute('src')).to.equal(bookmark.thumbnail);
+    expect(el.shadowRoot.querySelector('h4').innerText).to.equal(`Page ${bookmark.page}`);
+  });
+
+  it('renders an optional header section', async () => {
+    const el = await fixture(container(bookmark));
+    el.renderHeader = true;
+
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('header')).to.exist;
+  });
+
+  it('toggles rendering of the bookmark thumbnail and page number', async () => {
+    const el = await fixture(container(bookmark));
+    expect(el.shadowRoot.querySelector('img')).to.exist;
+    expect(el.shadowRoot.querySelector('h4')).to.exist;
+
+    el.showBookmark = false;
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('img')).to.not.exist;
+    expect(el.shadowRoot.querySelector('h4')).to.not.exist;
+  });
+
+  it('emits a custom event when the bookmark color is changed', async () => {
+    const el = await fixture(container(bookmark));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('li input').dispatchEvent(new Event('change'))
+    ));
+    const response = await oneEvent(el, 'bookmarkColorChanged');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a custom event when the edit form is submitted', async () => {
+    const el = await fixture(container(bookmark));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('form').dispatchEvent(new Event('submit'))
+    ));
+    const response = await oneEvent(el, 'saveBookmark');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a custom event when the delete button is clicked', async () => {
+    const el = await fixture(container(bookmark));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('button').click()
+    ));
+    const response = await oneEvent(el, 'deleteBookmark');
+
+    expect(response).to.exist;
+  });
+
+  it('updates bookmark color when a color input changed', async () => {
+    const el = await fixture(container(bookmark));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('input#color_2').dispatchEvent(new Event('change'))
+    ));
+    await oneEvent(el, 'bookmarkColorChanged');
+
+    expect(el.bookmark.color).to.equal(2);
+  });
+
+  it('updates bookmark note when the note textarea changed', async () => {
+    const el = await fixture(container(bookmark));
+    const textarea = el.shadowRoot.querySelector('textarea');
+    const updatedNote = 'New note';
+
+    textarea.value = updatedNote;
+
+    setTimeout(() => (
+      textarea.dispatchEvent(new Event('change'))
+    ));
+
+    await oneEvent(textarea, 'change');
+
+    expect(el.bookmark.note).to.contain(updatedNote);
+  });
+});

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

@@ -0,0 +1,222 @@
+import {
+  html,
+  fixture,
+  expect,
+  oneEvent,
+} from '@open-wc/testing';
+import '../../../../src/BookNavigator/bookmarks/bookmarks-list.js';
+
+const bookmarks = [{
+  id: 1,
+  thumbnail: '//placehold.it/37x46',
+  page: 'xii',
+}, {
+  id: 2,
+  thumbnail: '//placehold.it/37x46/06c/fff',
+  page: 9,
+  note: 'This is a long comment I left about this bookmark in order to test out the display in the panel on the side of the bookreader.',
+}, {
+  id: 3,
+  thumbnail: '//placehold.it/37x46/e5e5e5/06c',
+  page: 9,
+  note: 'Interesting quote here regarding the division of labor',
+}];
+
+const bookmarkColors = [{
+  id: 0,
+  className: 'blue',
+}, {
+  id: 1,
+  className: 'red',
+}, {
+  id: 2,
+  className: 'green',
+}];
+
+const container = (bookmarksSet = []) => (
+  html`<ia-bookmarks-list .bookmarks=${bookmarksSet} .bookmarkColors=${bookmarkColors}></ia-bookmarks-list>`
+);
+
+describe('<ia-bookmarks-list>', () => {
+  it('sets default properties', async () => {
+    const el = await fixture(container(bookmarks));
+
+    expect(el.bookmarks).to.equal(bookmarks);
+    expect(el.activeBookmarkID).to.be.undefined;
+    expect(el.renderHeader).to.be.false;
+  });
+
+  it('renders bookmarks that contain page numbers', async () => {
+    const el = await fixture(container(bookmarks));
+
+    expect(el.shadowRoot.innerHTML).to.include(`Page ${bookmarks[0].page}`);
+  });
+
+  it('renders bookmarks that contain an optional note', async () => {
+    const el = await fixture(container(bookmarks));
+
+    expect(el.shadowRoot.innerHTML).to.include(bookmarks[1].note);
+  });
+
+  it('emits a custom event when a bookmark is clicked', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('li').click()
+    ));
+    const response = await oneEvent(el, 'bookmarkSelected');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a custom event when an edit button is clicked', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('li button').click()
+    ));
+    const response = await oneEvent(el, 'bookmarkEdited');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a saveBookmark event', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.emitSaveBookmark(bookmarks[0])
+    ));
+    const response = await oneEvent(el, 'saveBookmark');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a deleteBookmark event', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.emitDeleteBookmark(bookmarks[0].id)
+    ));
+    const response = await oneEvent(el, 'deleteBookmark');
+
+    expect(response).to.exist;
+  });
+
+  it('emits a bookmarkColorChanged event', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.emitBookmarkColorChanged({ detail: { bookmarkId: 0, colorId: 0 } })
+    ));
+    const response = await oneEvent(el, 'bookmarkColorChanged');
+
+    expect(response).to.exist;
+  });
+
+  it('sets editedBookmark when an edit button is clicked', async () => {
+    const el = await fixture(container(bookmarks));
+    let prevState = el.editedBookmark;
+
+    el.shadowRoot.querySelector('li button').click();
+    await el.updateComplete;
+
+    expect(el.editedBookmark).not.to.equal(prevState);
+    expect(el.editedBookmark.page).to.equal(bookmarks[0].page);
+
+    // When clicking the same edit button while in edit mode, should toggle
+    // edit mode off and remove editedBookmark pointer
+    prevState = el.editedBookmark;
+    el.shadowRoot.querySelector('li button').click();
+    await el.updateComplete;
+
+    expect(el.editedBookmark).not.to.equal(prevState);
+    expect(el.editedBookmark.page).not.to.equal(bookmarks[0].page);
+  });
+
+  it('resets editedBookmark when saveBookmark callback called', async () => {
+    const el = await fixture(container(bookmarks));
+
+    [el.editedBookmark] = bookmarks;
+    await el.updateComplete;
+    el.saveBookmark({ detail: { bookmark: bookmarks[0] } });
+    await el.updateComplete;
+
+    expect(el.editedBookmark).not.to.equal(bookmarks[0]);
+    expect(el.editedBookmark).not.to.have.keys(['page', 'thumbnail', 'id']);
+  });
+
+  it('resets editedBookmark when deleteBookmark callback called', async () => {
+    const el = await fixture(container(bookmarks));
+
+    [el.editedBookmark] = bookmarks;
+    await el.updateComplete;
+    el.deleteBookmark({ detail: { id: bookmarks[0].id } });
+    await el.updateComplete;
+
+    expect(el.editedBookmark).not.to.equal(bookmarks[0]);
+    expect(el.editedBookmark).not.to.have.keys(['page', 'thumbnail', 'id']);
+  });
+
+  it('renders the bookmarks count', async () => {
+    const el = await fixture(container([bookmarks[0]]));
+    const bookmarksCount = await fixture(el.bookmarksCount);
+
+    expect(bookmarksCount.innerHTML).to.include('(1)');
+  });
+
+  it('does not render the bookmarks count when no bookmarks present', async () => {
+    const el = await fixture(container());
+    el.renderHeader = true;
+
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('header small')).not.to.exist;
+  });
+
+  it('renders an optional header section', async () => {
+    const el = await fixture(container(bookmarks));
+    el.renderHeader = true;
+
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('header')).to.exist;
+  });
+
+  // skipped:
+  // Uncaught TypeError: Cannot read property 'click' of null
+  xit('emits a custom event when the add bookmark button is clicked', async () => {
+    const el = await fixture(container(bookmarks));
+
+    setTimeout(() => (
+      el.shadowRoot.querySelector('.add-bookmark').click()
+    ));
+    const response = await oneEvent(el, 'addBookmark');
+
+    expect(response).to.exist;
+  });
+
+  // skipped:
+  // AssertionError: expected null to exist
+  xit('renders an optional add bookmark button', async () => {
+    const el = await fixture(container(bookmarks));
+
+    expect(el.shadowRoot.querySelector('.add-bookmark')).to.exist;
+
+    el.renderAddBookmarkButton = false;
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('.add-bookmark')).not.to.exist;
+  });
+
+  // skipped:
+  // TypeError: Cannot read property 'getAttribute' of null
+  xit('can toggle disable behavior of add bookmark button', async () => {
+    const el = await fixture(container(bookmarks));
+    expect(el.shadowRoot.querySelector('.add-bookmark').getAttribute('disabled')).to.be.null;
+
+    el.disableAddBookmarkButton = true;
+    await el.updateComplete;
+
+    expect(el.shadowRoot.querySelector('.add-bookmark').getAttribute('disabled')).to.equal('disabled');
+  });
+});

package/tests/karma/BookNavigator/downloads/downloads-provider.test.js

@@ -0,0 +1,64 @@
+import { expect } from '@open-wc/testing';
+import sinon from 'sinon';
+import DownloadsProvider from '../../../../src/BookNavigator/downloads/downloads-provider';
+
+const downloadableTypes = [
+  ["PDF", "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.pdf"],
+  ["ePub", "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.epub"],
+  ["Plain Text", "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala_djvu.txt"],
+  ["DAISY", "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala_daisy.zip"],
+  ["Kindle", "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.mobi"]
+];
+
+const downloads = [
+  {
+    type: "PDF",
+    url: "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.pdf",
+    note: "PDF files contain high quality images of pages."
+  },
+  {
+    type: "ePub",
+    url: "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.epub",
+    note: "ePub files are smaller in size, but may contain errors."
+  }
+];
+
+afterEach(() => {
+  sinon.restore();
+});
+
+describe('Downloads Provider', () => {
+  it('constructor - initial setup', () => {
+    const isBookProtected = false;
+    const provider = new DownloadsProvider(isBookProtected);
+
+    expect(provider.id).to.equal('downloads');
+    expect(provider.icon).to.exist;
+    expect(provider.label).to.equal('Downloadable files');
+    expect(provider.menuDetails).to.exist;
+    expect(provider.component).to.exist;
+
+    provider.update(downloadableTypes);
+
+    expect(provider.isBookProtected).to.equal(false);
+
+    expect(provider.downloads[0].type).to.equals("PDF");
+    expect(provider.downloads[1].type).to.equals("ePub");
+
+    expect(provider.menuDetails).to.equal(`(${downloads.length} formats)`);
+  });
+
+  it('render view if book is protected', () => {
+    const isBookProtected = true;
+    const provider = new DownloadsProvider(isBookProtected);
+
+    expect(provider.isBookProtected).to.equal(true);
+
+    provider.update(downloadableTypes);
+
+    expect(provider.downloads[0].type).to.equals("Encrypted Adobe PDF");
+    expect(provider.downloads[1].type).to.equals("Encrypted Adobe ePub");
+
+    expect(provider.downloads.length).to.equals(downloads.length);
+  });
+});

package/tests/karma/BookNavigator/downloads/downloads.test.js

@@ -0,0 +1,54 @@
+import {
+  html,
+  fixture,
+  expect,
+  fixtureCleanup,
+} from '@open-wc/testing';
+import sinon from 'sinon';
+import '../../../../src/BookNavigator/downloads/downloads';
+
+
+const downloads = [
+  {
+    type: "PDF",
+    url: "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.pdf",
+    note: "PDF files contain high quality images of pages."
+  },
+  {
+    type: "ePub",
+    url: "//archive.org/download/theworksofplato01platiala/theworksofplato01platiala.epub",
+    note: "ePub files are smaller in size, but may contain errors."
+  }
+];
+
+
+const container = (downloads) => (
+  html`
+    <ia-book-downloads .downloads=${downloads}></ia-book-downloads>
+  `
+);
+
+beforeEach(() => {
+  const body = document.querySelector('body');
+  const brHook = document.createElement('div');
+  brHook.setAttribute('id', 'BookReader');
+  body.appendChild(brHook);
+});
+
+afterEach(() => {
+  sinon.restore();
+  fixtureCleanup();
+});
+
+describe('<ia-book-downloads>', () => {
+  it('sets default properties', async () => {
+    const el = await fixture(container(downloads));
+    await el.updateComplete;
+
+    expect(el.downloads.length).to.equal(2);
+    expect(el.shadowRoot.querySelector("ul").childElementCount).to.equal(2);
+    expect(el.isBookProtected).to.equal(false);
+
+    expect(el.shadowRoot.querySelector("ul li a").innerHTML).to.include("Get PDF");
+  });
+});

package/tests/karma/BookNavigator/search/search-provider.test.js

@@ -0,0 +1,23 @@
+import { expect } from '@open-wc/testing';
+import sinon from 'sinon';
+import searchProvider from '../../../../src/BookNavigator/search/search-provider';
+
+afterEach(() => {
+  sinon.restore();
+});
+
+describe('Search Provider', () => {
+  describe('constructor', () => {
+    const onSearchChangeCB = sinon.fake();
+    const br = sinon.fake();
+    const provider = new searchProvider(onSearchChangeCB, br);
+
+    expect(provider.bookreader).to.equal(br);
+    expect(provider.onSearchChange).to.equal(onSearchChangeCB);
+    expect(provider.id).to.equal('search');
+    expect(provider.icon).to.exist;
+    expect(provider.label).to.equal('Search inside');
+    expect(provider.menuDetails).to.exist;
+    expect(provider.component).to.exist;
+  });
+});