@internetarchive/collection-browser 2.7.13 → 2.7.14

package/test/collection-facets.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import { expect, fixture } from '@open-wc/testing';
 import sinon from 'sinon';
 import { html } from 'lit';
@@ -22,24 +21,24 @@ import type { FacetRow } from '../src/collection-facets/facet-row';
 describe('Collection Facets', () => {
   it('has loader', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets ?facetsLoading=${true}></collection-facets>`
+      html`<collection-facets ?facetsLoading=${true}></collection-facets>`,
     );
 
     expect(
-      el.shadowRoot?.querySelector('#container')?.classList.contains('loading')
+      el.shadowRoot?.querySelector('#container')?.classList.contains('loading'),
     ).to.be.true;
 
     el.facetsLoading = false;
     await el.updateComplete;
 
     expect(
-      el.shadowRoot?.querySelector('#container')?.classList.contains('loading')
+      el.shadowRoot?.querySelector('#container')?.classList.contains('loading'),
     ).to.be.false;
   });
 
   it('renders a date picker loading placeholder when date picker enabled', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = true;
@@ -47,14 +46,14 @@ describe('Collection Facets', () => {
     await el.updateComplete;
 
     const histogramLoader = el.shadowRoot?.querySelector(
-      '.histogram-loading-indicator'
+      '.histogram-loading-indicator',
     );
     expect(histogramLoader).to.exist;
   });
 
   it('does not render a date picker loading placeholder when date picker disabled', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = true;
@@ -62,14 +61,14 @@ describe('Collection Facets', () => {
     await el.updateComplete;
 
     const histogramLoader = el.shadowRoot?.querySelector(
-      '.histogram-loading-indicator'
+      '.histogram-loading-indicator',
     );
     expect(histogramLoader).to.be.null;
   });
 
   it('renders the date picker when enabled with data present', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -87,7 +86,7 @@ describe('Collection Facets', () => {
 
   it('does not render the date picker when disabled', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -105,7 +104,7 @@ describe('Collection Facets', () => {
 
   it('renders button to expand the date picker when allowed', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -124,7 +123,7 @@ describe('Collection Facets', () => {
 
   it('does not render button to expand the date picker when disallowed', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -142,10 +141,14 @@ describe('Collection Facets', () => {
   });
 
   it('opens modal when date picker expand button clicked', async () => {
+    const modalManager = await fixture<ModalManager>(
+      html`<modal-manager></modal-manager>`,
+    );
+
     const el = await fixture<CollectionFacets>(
       html`<collection-facets
-        .modalManager=${new ModalManager()}
-      ></collection-facets>`
+        .modalManager=${modalManager}
+      ></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -159,13 +162,13 @@ describe('Collection Facets', () => {
     await el.updateComplete;
 
     const expandBtn = el.shadowRoot?.querySelector(
-      '.expand-date-picker-btn'
+      '.expand-date-picker-btn',
     ) as HTMLButtonElement;
     expect(expandBtn).to.exist;
 
     const showModalSpy = sinon.spy(
       el.modalManager as ModalManagerInterface,
-      'showModal'
+      'showModal',
     );
 
     // Click the expand button to open the modal
@@ -179,7 +182,7 @@ describe('Collection Facets', () => {
 
   it('renders aggregations as facets', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     const aggs: Record<string, Aggregation> = {
@@ -202,11 +205,11 @@ describe('Collection Facets', () => {
     const facetGroupHeader = titleFacetGroup?.querySelector('h3');
     // Every facet group header has an invisible " filters" suffix for screen-readers
     expect(
-      facetGroupHeader?.querySelector('span.sr-only')?.textContent?.trim()
+      facetGroupHeader?.querySelector('span.sr-only')?.textContent?.trim(),
     ).to.equal('filters');
     // Ignoring the screen-reader suffix, we should be left with only the readable, capitalized title
     expect(
-      facetGroupHeader?.textContent?.trim().replace(/\s*filters$/, '')
+      facetGroupHeader?.textContent?.trim().replace(/\s*filters$/, ''),
     ).to.equal('Subject');
 
     const titleFacetRow = titleFacetGroup
@@ -215,13 +218,13 @@ describe('Collection Facets', () => {
     await titleFacetRow.updateComplete;
 
     expect(titleFacetRow?.shadowRoot?.textContent?.trim()).to.satisfy(
-      (text: string) => /^foo\s*5$/.test(text)
+      (text: string) => /^foo\s*5$/.test(text),
     );
   });
 
   it('renders multiple aggregation types', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     const aggs: Record<string, Aggregation> = {
@@ -252,7 +255,7 @@ describe('Collection Facets', () => {
 
   it('does not render suppressed collection facets', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     const aggs: Record<string, Aggregation> = {
@@ -506,7 +509,7 @@ describe('Collection Facets', () => {
 
   it('always renders the mediatype:collection facet when present', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     const aggs: Record<string, Aggregation> = {
@@ -553,7 +556,7 @@ describe('Collection Facets', () => {
 
     const facetsTemplate = el.shadowRoot?.querySelector('facets-template');
     const facetRows = facetsTemplate?.shadowRoot?.querySelectorAll(
-      'facet-row'
+      'facet-row',
     ) as ArrayLike<FacetRow>;
     expect(facetRows?.length).to.equal(6);
     expect(facetRows?.[5]?.bucket?.key).to.equal('collection');
@@ -561,7 +564,7 @@ describe('Collection Facets', () => {
 
   it('renders the mediatype:collection facet even when >=6 other mediatypes are selected', async () => {
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets></collection-facets>`
+      html`<collection-facets></collection-facets>`,
     );
 
     const aggs: Record<string, Aggregation> = {
@@ -620,7 +623,7 @@ describe('Collection Facets', () => {
 
     const facetsTemplate = el.shadowRoot?.querySelector('facets-template');
     const facetRows = facetsTemplate?.shadowRoot?.querySelectorAll(
-      'facet-row'
+      'facet-row',
     ) as ArrayLike<FacetRow>;
     expect(facetRows?.length).to.equal(8);
     expect(facetRows?.[7]?.bucket?.key).to.equal('collection');
@@ -629,7 +632,7 @@ describe('Collection Facets', () => {
   describe('More Facets', () => {
     it('Does not render < allowedFacetCount', async () => {
       const el = await fixture<CollectionFacets>(
-        html`<collection-facets></collection-facets>`
+        html`<collection-facets></collection-facets>`,
       );
 
       const aggs: Record<string, Aggregation> = {
@@ -651,10 +654,14 @@ describe('Collection Facets', () => {
     });
 
     it('Render More Facets', async () => {
+      const modalManager = await fixture<ModalManager>(
+        html`<modal-manager></modal-manager>`,
+      );
+
       const el = await fixture<CollectionFacets>(
         html`<collection-facets
-          .modalManager=${new ModalManager()}
-        ></collection-facets>`
+          .modalManager=${modalManager}
+        ></collection-facets>`,
       );
 
       const aggs: Record<string, Aggregation> = {
@@ -703,13 +710,13 @@ describe('Collection Facets', () => {
       });
 
       const moreLink = el.shadowRoot?.querySelector(
-        '.more-link'
+        '.more-link',
       ) as HTMLButtonElement;
       expect(moreLink).to.exist; // has link
 
       const showModalSpy = sinon.spy(
         el.modalManager as ModalManagerInterface,
-        'showModal'
+        'showModal',
       );
       // let's pop up modal
       moreLink?.click();
@@ -729,7 +736,7 @@ describe('Collection Facets', () => {
     const el = await fixture<CollectionFacets>(
       html`<collection-facets
         .analyticsHandler=${mockAnalyticsHandler}
-      ></collection-facets>`
+      ></collection-facets>`,
     );
     const aggs: Record<string, Aggregation> = {
       subject: new Aggregation({
@@ -770,7 +777,7 @@ describe('Collection Facets', () => {
     await el.updateComplete;
 
     const moreLink = el.shadowRoot?.querySelector(
-      '.more-link'
+      '.more-link',
     ) as HTMLButtonElement;
 
     expect(moreLink).to.exist; // has link
@@ -794,7 +801,7 @@ describe('Collection Facets', () => {
           ['bar', 'bar-name'],
           ['baz', 'baz-name'],
         ])}
-      ></collection-facets>`
+      ></collection-facets>`,
     );
 
     const partOfSection = el.shadowRoot?.querySelector('.partof-collections');
@@ -812,7 +819,7 @@ describe('Collection Facets', () => {
   it('does not include Part Of section without parent collections', async () => {
     // No parentCollections prop
     const el = await fixture<CollectionFacets>(
-      html`<collection-facets .withinCollection=${'foo'}></collection-facets>`
+      html`<collection-facets .withinCollection=${'foo'}></collection-facets>`,
     );
 
     const partOfSection = el.shadowRoot?.querySelector('.partof-collections');
@@ -825,7 +832,7 @@ describe('Collection Facets', () => {
     const el = await fixture<CollectionFacets>(
       html`<collection-facets
         .analyticsHandler=${mockAnalyticsHandler}
-      ></collection-facets>`
+      ></collection-facets>`,
     );
 
     el.fullYearAggregationLoading = false;
@@ -839,7 +846,7 @@ describe('Collection Facets', () => {
     await el.updateComplete;
 
     const expandBtn = el.shadowRoot?.querySelector(
-      '.expand-date-picker-btn'
+      '.expand-date-picker-btn',
     ) as HTMLButtonElement;
     expect(expandBtn).to.exist;
 
@@ -861,11 +868,11 @@ describe('Collection Facets', () => {
         .withinCollection=${'foo'}
         .parentCollections=${['bar']}
         .analyticsHandler=${mockAnalyticsHandler}
-      ></collection-facets>`
+      ></collection-facets>`,
     );
 
     const partOfLinks = el.shadowRoot?.querySelectorAll(
-      '.partof-collections a[href]'
+      '.partof-collections a[href]',
     );
     expect(partOfLinks?.length).to.equal(1);
 

package/test/data-source/collection-browser-data-source.test.ts

@@ -14,14 +14,14 @@ const dataPage: TileModel[] = [
       fields: {
         identifier: 'foo',
       },
-    })
+    }),
   ),
   new TileModel(
     new ItemHit({
       fields: {
         identifier: 'bar',
       },
-    })
+    }),
   ),
 ];
 

package/test/empty-placeholder.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import { expect, fixture } from '@open-wc/testing';
 import { html } from 'lit';
 import '../src/empty-placeholder';
@@ -8,7 +7,7 @@ import type { EmptyPlaceholder } from '../src/empty-placeholder';
 describe('Empty Placeholder', () => {
   it('should render with empty-query placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = 'empty-query';
@@ -21,7 +20,7 @@ describe('Empty Placeholder', () => {
 
   it('should render with empty-collection placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = 'empty-collection';
@@ -34,7 +33,7 @@ describe('Empty Placeholder', () => {
 
   it('should render with no-results placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = 'no-results';
@@ -47,7 +46,7 @@ describe('Empty Placeholder', () => {
 
   it('should render with query-error placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = 'query-error';
@@ -60,7 +59,7 @@ describe('Empty Placeholder', () => {
 
   it('should render with collection-error placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = 'collection-error';
@@ -73,7 +72,7 @@ describe('Empty Placeholder', () => {
 
   it('should not render any empty placeholder', async () => {
     const el = await fixture<EmptyPlaceholder>(
-      html`<empty-placeholder></empty-placeholder>`
+      html`<empty-placeholder></empty-placeholder>`,
     );
 
     el.placeholderType = null;

package/test/expanded-date-picker.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import type { HistogramDateRange } from '@internetarchive/histogram-date-range';
 import {
   ModalManager,
@@ -20,7 +19,7 @@ import {
 describe('Expanded Date Picker', () => {
   it('should render with a date picker and Apply button', async () => {
     const el = await fixture<ExpandedDatePicker>(
-      html`<expanded-date-picker></expanded-date-picker>`
+      html`<expanded-date-picker></expanded-date-picker>`,
     );
 
     expect(el.shadowRoot?.querySelector('#date-picker')).to.exist;
@@ -35,11 +34,11 @@ describe('Expanded Date Picker', () => {
         .maxDate=${'5'}
         .minSelectedDate=${'1'}
         .maxSelectedDate=${'5'}
-      ></expanded-date-picker>`
+      ></expanded-date-picker>`,
     );
 
     const datePicker = el.shadowRoot?.querySelector(
-      '#date-picker'
+      '#date-picker',
     ) as HistogramDateRange;
     expect(datePicker).to.exist;
 
@@ -51,7 +50,7 @@ describe('Expanded Date Picker', () => {
           minDate: datePicker.minSelectedDate,
           maxDate: datePicker.maxSelectedDate,
         },
-      })
+      }),
     );
     await el.updateComplete;
 
@@ -69,11 +68,11 @@ describe('Expanded Date Picker', () => {
         .minSelectedDate=${'1'}
         .maxSelectedDate=${'5'}
         @histogramDateRangeApplied=${applySpy}
-      ></expanded-date-picker>`
+      ></expanded-date-picker>`,
     );
 
     const applyBtn = el.shadowRoot?.querySelector(
-      '#apply-btn'
+      '#apply-btn',
     ) as HTMLButtonElement;
     expect(applyBtn).to.exist;
 
@@ -82,12 +81,14 @@ describe('Expanded Date Picker', () => {
 
     expect(applySpy.callCount).to.equal(1);
     expect(
-      applySpy.calledWithMatch({ detail: { minDate: '1', maxDate: '5' } })
+      applySpy.calledWithMatch({ detail: { minDate: '1', maxDate: '5' } }),
     );
   });
 
   it('should close its modal and emit close event when date range applied', async () => {
-    const modalManager = new ModalManager();
+    const modalManager = await fixture<ModalManager>(
+      html`<modal-manager></modal-manager>`,
+    );
     modalManager.mode = ModalManagerMode.Open;
 
     const modalClosed = sinon.spy();
@@ -101,11 +102,11 @@ describe('Expanded Date Picker', () => {
         .maxSelectedDate=${'5'}
         .modalManager=${modalManager}
         @modalClosed=${modalClosed}
-      ></expanded-date-picker>`
+      ></expanded-date-picker>`,
     );
 
     const applyBtn = el.shadowRoot?.querySelector(
-      '#apply-btn'
+      '#apply-btn',
     ) as HTMLButtonElement;
     expect(applyBtn).to.exist;
 
@@ -117,6 +118,10 @@ describe('Expanded Date Picker', () => {
   });
 
   it('closes the modal when Esc key is pressed', async () => {
+    const modalManager = await fixture<ModalManager>(
+      html`<modal-manager></modal-manager>`,
+    );
+
     const el = await fixture<ExpandedDatePicker>(
       html`<expanded-date-picker
         .buckets=${[1, 2, 3, 4, 5]}
@@ -124,13 +129,13 @@ describe('Expanded Date Picker', () => {
         .maxDate=${'5'}
         .minSelectedDate=${'1'}
         .maxSelectedDate=${'5'}
-        .modalManager=${new ModalManager()}
-      ></expanded-date-picker>`
+        .modalManager=${modalManager}
+      ></expanded-date-picker>`,
     );
 
     const closeModalSpy = sinon.spy(
       el.modalManager as ModalManagerInterface,
-      'closeModal'
+      'closeModal',
     );
 
     // Dispatch an Esc keydown event
@@ -150,11 +155,11 @@ describe('Expanded Date Picker', () => {
         .minDate=${'1'}
         .maxDate=${'5'}
         .analyticsHandler=${analyticsHandler}
-      ></expanded-date-picker>`
+      ></expanded-date-picker>`,
     );
 
     const applyBtn = el.shadowRoot?.querySelector(
-      '#apply-btn'
+      '#apply-btn',
     ) as HTMLButtonElement;
     expect(applyBtn).to.exist;
 
@@ -163,12 +168,12 @@ describe('Expanded Date Picker', () => {
 
     expect(analyticsHandler.callCategory).to.equal(analyticsCategories.default);
     expect(analyticsHandler.callAction).to.equal(
-      analyticsActions.histogramChangedFromModal
+      analyticsActions.histogramChangedFromModal,
     );
     expect(analyticsHandler.callLabel).to.equal(window.location.href);
 
     const datePicker = el.shadowRoot?.querySelector(
-      '#date-picker'
+      '#date-picker',
     ) as HistogramDateRange;
     expect(datePicker).to.exist;
 
@@ -180,7 +185,7 @@ describe('Expanded Date Picker', () => {
           minDate: datePicker.minSelectedDate,
           maxDate: datePicker.maxSelectedDate,
         },
-      })
+      }),
     );
     await el.updateComplete;
 
@@ -189,7 +194,7 @@ describe('Expanded Date Picker', () => {
 
     expect(analyticsHandler.callCategory).to.equal(analyticsCategories.default);
     expect(analyticsHandler.callAction).to.equal(
-      analyticsActions.histogramChangedFromModal
+      analyticsActions.histogramChangedFromModal,
     );
     expect(analyticsHandler.callLabel).to.equal(window.location.href);
   });

package/test/icon-overlay.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import { expect, fixture } from '@open-wc/testing';
 import { html } from 'lit';
 import type { IconOverlay } from '../src/tiles/overlay/icon-overlay';

package/test/image-block.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import { expect, fixture } from '@open-wc/testing';
 import { html } from 'lit';
 import type { ImageBlock } from '../src/tiles/image-block';
@@ -102,7 +101,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).to.exist;
     expect(textOverlay.type).to.equal('login-required');
@@ -125,7 +124,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).not.to.exist;
   });
@@ -147,7 +146,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).to.exist;
     expect(textOverlay.type).to.equal('content-warning');
@@ -171,7 +170,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).to.exist;
     expect(textOverlay.type).to.equal('login-required');
@@ -195,7 +194,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).to.exist;
     expect(textOverlay.type).to.equal('content-warning');
@@ -217,7 +216,7 @@ describe('Image block component', () => {
     `);
 
     const textOverlay = el.shadowRoot?.querySelector(
-      'text-overlay'
+      'text-overlay',
     ) as TextOverlay;
     expect(textOverlay).not.to.exist;
   });

package/test/item-image.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import { expect, fixture } from '@open-wc/testing';
 import { html } from 'lit';