@internetarchive/collection-browser 4.8.0 → 4.8.1-alpha-webdev9189.0

package/test/manage/manage-bar.test.ts

@@ -1,347 +0,0 @@
-import { expect, fixture } from '@open-wc/testing';
-import { html } from 'lit';
-import Sinon from 'sinon';
-import '../../src/manage/manage-bar';
-import '../../src/manage/remove-items-modal-content';
-import {
-  ModalManager,
-  ModalManagerInterface,
-} from '@internetarchive/modal-manager';
-import '@internetarchive/modal-manager';
-import { msg } from '@lit/localize';
-import type { ManageBar } from '../../src/manage/manage-bar';
-import type { PageElementName } from '@internetarchive/search-service';
-import type { RemoveItemsModalContent } from '../../src/manage/remove-items-modal-content';
-
-describe('Manage bar', () => {
-  it('renders basic component', async () => {
-    const el = await fixture<ManageBar>(html`<manage-bar></manage-bar>`);
-
-    expect(el.shadowRoot?.querySelector('.manage-label')).to.exist;
-    expect(el.shadowRoot?.querySelector('.manage-buttons')).to.exist;
-    expect(el.shadowRoot?.querySelector('.ia-button.dark')).to.exist;
-    expect(el.shadowRoot?.querySelector('.ia-button.danger')).to.exist;
-  });
-
-  it('can set the label', async () => {
-    const el = await fixture<ManageBar>(
-      html`<manage-bar label="foo bar"></manage-bar>`,
-    );
-    expect(el.shadowRoot?.querySelector('.manage-label')?.textContent).to.equal(
-      'foo bar',
-    );
-  });
-
-  it('does not include Select All/Unselect All buttons by default', async () => {
-    const el = await fixture<ManageBar>(html`<manage-bar></manage-bar>`);
-    expect(el.shadowRoot?.querySelector('.select-all-btn')).not.to.exist;
-    expect(el.shadowRoot?.querySelector('.unselect-all-btn')).not.to.exist;
-  });
-
-  it('does not render item manager button except /search/ page', async () => {
-    const el = await fixture<ManageBar>(html`<manage-bar></manage-bar>`);
-    expect(el.shadowRoot?.querySelector('.ia-button.warning')).not.to.exist;
-  });
-
-  it('render item manager button for /search/ page', async () => {
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showItemManageButton></manage-bar>`,
-    );
-    expect(el.shadowRoot?.querySelector('.ia-button.warning')).to.exist;
-  });
-
-  it('includes Select All button when requested', async () => {
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showSelectAll></manage-bar>`,
-    );
-    expect(el.shadowRoot?.querySelector('.select-all-btn')).to.exist;
-  });
-
-  it('includes Unselect All button when requested', async () => {
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showUnselectAll></manage-bar>`,
-    );
-    expect(el.shadowRoot?.querySelector('.unselect-all-btn')).to.exist;
-  });
-
-  it('default and toggle state of remove button', async () => {
-    const el = await fixture<ManageBar>(html`<manage-bar></manage-bar>`);
-
-    expect(el.shadowRoot?.querySelector('.ia-button.danger:disabled')).to.exist;
-
-    el.removeAllowed = true;
-    await el.updateComplete;
-
-    expect(el.shadowRoot?.querySelector('.ia-button.danger:disabled')).to.not
-      .exist;
-  });
-
-  it('emits event when Cancel button clicked', async () => {
-    const spy = Sinon.spy();
-    const el = await fixture<ManageBar>(
-      html`<manage-bar @cancel=${spy}></manage-bar>`,
-    );
-
-    const cancelBtn = el.shadowRoot?.querySelector(
-      '.ia-button.dark',
-    ) as HTMLButtonElement;
-    expect(cancelBtn).to.exist;
-
-    cancelBtn.click();
-    expect(spy.callCount).to.equal(1);
-  });
-
-  it('emits event when Select All button clicked', async () => {
-    const spy = Sinon.spy();
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showSelectAll @selectAll=${spy}></manage-bar>`,
-    );
-
-    const selectAllBtn = el.shadowRoot?.querySelector(
-      '.select-all-btn',
-    ) as HTMLButtonElement;
-    expect(selectAllBtn).to.exist;
-
-    selectAllBtn.click();
-    expect(spy.callCount).to.equal(1);
-  });
-
-  it('emits event when Unselect All button clicked', async () => {
-    const spy = Sinon.spy();
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showUnselectAll @unselectAll=${spy}></manage-bar>`,
-    );
-
-    const unselectAllBtn = el.shadowRoot?.querySelector(
-      '.unselect-all-btn',
-    ) as HTMLButtonElement;
-    expect(unselectAllBtn).to.exist;
-
-    unselectAllBtn.click();
-    expect(spy.callCount).to.equal(1);
-  });
-
-  it('opens the remove items modal when showRemoveItemsModal is clicked', async () => {
-    const modalManager = await fixture<ModalManager>(
-      html`<modal-manager></modal-manager>`,
-    );
-
-    const el = await fixture<ManageBar>(html`
-      <manage-bar
-        .modalManager=${modalManager}
-        .selectedItems=${[{ identifier: '1', title: 'Item 1' }]}
-        removeAllowed
-      ></manage-bar>
-    `);
-    await el.updateComplete;
-
-    const removeButton = el.shadowRoot?.querySelector(
-      '.ia-button.danger',
-    ) as HTMLButtonElement;
-    expect(removeButton).to.exist;
-
-    const showModalSpy = Sinon.spy(
-      el.modalManager as ModalManagerInterface,
-      'showModal',
-    );
-
-    await el.updateComplete;
-    removeButton?.click();
-
-    expect(showModalSpy.callCount).to.equal(1);
-    expect(el.modalManager?.classList.contains('remove-items')).to.be;
-    expect(showModalSpy.args[0][0].config.title?.values[0]).to.equal(
-      msg('Are you sure you want to remove these items?'),
-    );
-    expect(showModalSpy.args[0][0].customModalContent).to.exist;
-  });
-
-  it('shows selected items count in remove button', async () => {
-    const el = await fixture<ManageBar>(html`
-      <manage-bar
-        .selectedItems=${[
-          { identifier: '1', title: 'Item 1' },
-          { identifier: '2', title: 'Item 2' },
-          { identifier: '3', title: 'Item 3' },
-        ]}
-      ></manage-bar>
-    `);
-    const removeBtn = el.shadowRoot?.querySelector('.ia-button.danger');
-    expect(removeBtn?.textContent?.trim()).to.include('(3)');
-  });
-
-  it('Item Manager button is disabled when removeAllowed is false', async () => {
-    const el = await fixture<ManageBar>(
-      html`<manage-bar showItemManageButton></manage-bar>`,
-    );
-    expect(el.shadowRoot?.querySelector('.ia-button.warning:disabled')).to
-      .exist;
-
-    el.removeAllowed = true;
-    await el.updateComplete;
-
-    expect(el.shadowRoot?.querySelector('.ia-button.warning:disabled')).not.to
-      .exist;
-  });
-
-  it('emits manageItems event when Item Manager button clicked', async () => {
-    const spy = Sinon.spy();
-    const el = await fixture<ManageBar>(html`
-      <manage-bar
-        showItemManageButton
-        removeAllowed
-        @manageItems=${spy}
-      ></manage-bar>
-    `);
-    const manageBtn = el.shadowRoot?.querySelector(
-      '.ia-button.warning',
-    ) as HTMLButtonElement;
-    expect(manageBtn).to.exist;
-    manageBtn.click();
-    expect(spy.callCount).to.equal(1);
-  });
-
-  it('emits removeItems event when modal confirm is clicked', async () => {
-    const modalManager = await fixture<ModalManager>(
-      html`<modal-manager></modal-manager>`,
-    );
-    const removeItemsSpy = Sinon.spy();
-    const el = await fixture<ManageBar>(html`
-      <manage-bar
-        .modalManager=${modalManager}
-        .selectedItems=${[{ identifier: '1', title: 'Item 1' }]}
-        removeAllowed
-        @removeItems=${removeItemsSpy}
-      ></manage-bar>
-    `);
-    await el.updateComplete;
-
-    const showModalSpy = Sinon.spy(
-      el.modalManager as ModalManagerInterface,
-      'showModal',
-    );
-    (
-      el.shadowRoot?.querySelector('.ia-button.danger') as HTMLButtonElement
-    ).click();
-
-    const contentEl = (await fixture(
-      showModalSpy.args[0][0].customModalContent!,
-    )) as RemoveItemsModalContent;
-    (
-      contentEl.shadowRoot?.querySelector(
-        '.remove-items-btn',
-      ) as HTMLButtonElement
-    ).click();
-
-    expect(removeItemsSpy.callCount).to.equal(1);
-  });
-
-  describe('profileElement modal messages', () => {
-    async function openModalContent(
-      profileElement: string,
-      itemCount = 1,
-    ): Promise<RemoveItemsModalContent> {
-      const modalManager = await fixture<ModalManager>(
-        html`<modal-manager></modal-manager>`,
-      );
-      const items = Array.from({ length: itemCount }, (_, i) => ({
-        identifier: String(i + 1),
-        title: `Item ${i + 1}`,
-      }));
-      const el = await fixture<ManageBar>(html`
-        <manage-bar
-          .selectedItems=${items}
-          .profileElement=${profileElement as PageElementName}
-          removeAllowed
-        ></manage-bar>
-      `);
-      el.modalManager = modalManager as ModalManagerInterface;
-      await el.updateComplete;
-
-      const showModalSpy = Sinon.spy(
-        el.modalManager as ModalManagerInterface,
-        'showModal',
-      );
-      (
-        el.shadowRoot?.querySelector('.ia-button.danger') as HTMLButtonElement
-      ).click();
-
-      return (await fixture(
-        showModalSpy.args[0][0].customModalContent!,
-      )) as RemoveItemsModalContent;
-    }
-
-    it('shows uploads-specific message for profileElement=uploads', async () => {
-      const contentEl = await openModalContent('uploads');
-      expect(contentEl.message).to.include('uploads list');
-    });
-
-    it('shows web archives message for profileElement=web_archives', async () => {
-      const contentEl = await openModalContent('web_archives');
-      expect(contentEl.message).to.include('web archives list');
-    });
-
-    it('shows favorites message for profileElement=favorites', async () => {
-      const contentEl = await openModalContent('favorites');
-      expect(contentEl.message).to.include('favorites list');
-    });
-
-    it('shows no message for unmapped profileElement (e.g. reviews)', async () => {
-      const contentEl = await openModalContent('reviews');
-      expect(contentEl.message).to.equal('');
-      expect(contentEl.shadowRoot?.querySelector('.message')).not.to.exist;
-    });
-
-    it('uses "this item" for a single selected item', async () => {
-      const contentEl = await openModalContent('uploads', 1);
-      expect(contentEl.message).to.include('this item');
-    });
-
-    it('uses "these items" for multiple selected items', async () => {
-      const contentEl = await openModalContent('uploads', 2);
-      expect(contentEl.message).to.include('these items');
-    });
-  });
-
-  it('showRemoveItemsProcessingModal shows processing modal', async () => {
-    const modalManager = await fixture<ModalManager>(
-      html`<modal-manager></modal-manager>`,
-    );
-    const el = await fixture<ManageBar>(html`
-      <manage-bar .modalManager=${modalManager}></manage-bar>
-    `);
-    const showModalSpy = Sinon.spy(
-      el.modalManager as ModalManagerInterface,
-      'showModal',
-    );
-
-    el.showRemoveItemsProcessingModal();
-
-    expect(showModalSpy.callCount).to.equal(1);
-    expect(showModalSpy.args[0][0].config.showProcessingIndicator).to.be.true;
-    expect(showModalSpy.args[0][0].config.title?.values[0]).to.equal(
-      msg('Removing selected items...'),
-    );
-  });
-
-  it('showRemoveItemsErrorModal shows error modal', async () => {
-    const modalManager = await fixture<ModalManager>(
-      html`<modal-manager></modal-manager>`,
-    );
-    const el = await fixture<ManageBar>(html`
-      <manage-bar .modalManager=${modalManager}></manage-bar>
-    `);
-    const showModalSpy = Sinon.spy(
-      el.modalManager as ModalManagerInterface,
-      'showModal',
-    );
-
-    el.showRemoveItemsErrorModal();
-
-    expect(showModalSpy.callCount).to.equal(1);
-    expect(showModalSpy.args[0][0].config.showProcessingIndicator).to.be.false;
-    expect(showModalSpy.args[0][0].config.title?.values[0]).to.equal(
-      msg('Error: unable to remove items'),
-    );
-  });
-});

package/test/manage/remove-items-modal-content.test.ts

@@ -1,81 +0,0 @@
-import { expect, fixture } from '@open-wc/testing';
-import { html } from 'lit';
-import Sinon from 'sinon';
-import type { ManageableItem } from '../../src/models';
-import type { RemoveItemsModalContent } from '../../src/manage/remove-items-modal-content';
-import '../../src/manage/remove-items-modal-content';
-
-describe('RemoveItemsModalContent', () => {
-  const items: ManageableItem[] = [
-    { identifier: '1', title: 'Item 1', date: '2022-01-01' },
-    { identifier: '2', title: 'Item 2', date: '2022-01-02' },
-  ];
-
-  it('renders basic component', async () => {
-    const el = await fixture<RemoveItemsModalContent>(html`
-      <remove-items-modal-content
-        .items=${items}
-        .message=${''}
-      ></remove-items-modal-content>
-    `);
-
-    expect(el.shadowRoot?.querySelector('ul')).to.exist;
-    expect(el.shadowRoot?.querySelector('.button-bar')).to.exist;
-    expect(el.shadowRoot?.querySelector('.remove-items-btn')).to.exist;
-  });
-
-  it('renders list of items', async () => {
-    const el = await fixture<RemoveItemsModalContent>(html`
-      <remove-items-modal-content
-        .items=${items}
-        .message=${''}
-      ></remove-items-modal-content>
-    `);
-
-    const listItems = el.shadowRoot?.querySelectorAll('li');
-    expect(listItems).to.have.lengthOf(2);
-
-    listItems?.forEach((item, index) => {
-      expect(item.querySelector('.item-title')?.textContent).to.equal(
-        items[index].title,
-      );
-      expect(item.querySelector('.item-date')?.textContent).to.equal(
-        items[index].date,
-      );
-    });
-  });
-
-  it('renders message', async () => {
-    const message = 'This is a test message';
-    const el = await fixture<RemoveItemsModalContent>(html`
-      <remove-items-modal-content
-        .items=${[]}
-        .message=${message}
-      ></remove-items-modal-content>
-    `);
-
-    expect(el.shadowRoot?.querySelector('.message')?.textContent).to.equal(
-      message,
-    );
-  });
-
-  it('dispatches confirm event when remove items button is clicked', async () => {
-    const el = await fixture<RemoveItemsModalContent>(html`
-      <remove-items-modal-content
-        .items=${items}
-        .message=${''}
-      ></remove-items-modal-content>
-    `);
-
-    const spy = Sinon.spy();
-    el.addEventListener('confirm', spy);
-
-    const button = el.shadowRoot?.querySelector(
-      '.remove-items-btn',
-    ) as HTMLInputElement;
-    button?.click();
-
-    expect(spy.calledOnce).to.be.true;
-    expect(spy.args[0][0].detail.items).to.deep.equal(items);
-  });
-});

package/test/mediatype-config.test.ts

@@ -1,11 +0,0 @@
-import { expect } from '@open-wc/testing';
-import { mediatypeConfig } from '../src/mediatype/mediatype-config';
-
-describe('mediatypeConfig', () => {
-  it('returns audio', () => {
-    expect(mediatypeConfig.audio).to.exist;
-    expect(mediatypeConfig.audio.color).to.exist;
-    expect(mediatypeConfig.audio.icon).to.exist;
-    expect(mediatypeConfig.audio.text).to.exist;
-  });
-});

package/test/mocks/mock-analytics-handler.ts

@@ -1,30 +0,0 @@
-import type {
-  AnalyticsEvent,
-  AnalyticsManagerInterface,
-} from '@internetarchive/analytics-manager';
-
-export class MockAnalyticsHandler implements AnalyticsManagerInterface {
-  callCategory?: string;
-
-  callAction?: string;
-
-  callLabel?: string;
-
-  callEventConfiguration?: object;
-
-  sendPing(): void {}
-
-  sendEvent(options: AnalyticsEvent): void {
-    this.callCategory = options.category;
-    this.callAction = options.action;
-    this.callLabel = options.label;
-    this.callEventConfiguration = options.eventConfiguration;
-  }
-
-  sendEventNoSampling(options: AnalyticsEvent): void {
-    this.callCategory = options.category;
-    this.callAction = options.action;
-    this.callLabel = options.label;
-    this.callEventConfiguration = options.eventConfiguration;
-  }
-}