@internetarchive/collection-browser 0.2.22 → 0.3.0-alpha.1

package/test/collection-browser.test.ts

@@ -3,6 +3,7 @@ import { expect, fixture } from '@open-wc/testing';
 import { html } from 'lit';
 import sinon from 'sinon';
 import type { InfiniteScroller } from '@internetarchive/infinite-scroller';
+import { SearchType } from '@internetarchive/search-service';
 import type { CollectionBrowser } from '../src/collection-browser';
 import '../src/collection-browser';
 import {
@@ -182,6 +183,48 @@ describe('Collection Browser', () => {
     ).to.contains('Results');
   });
 
+  it('queries the search service with a metadata search', async () => {
+    const searchService = new MockSearchService();
+
+    const el = await fixture<CollectionBrowser>(
+      html` <collection-browser
+        .searchService=${searchService}
+        searchTarget="metadata"
+      >
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'collection:foo';
+    await el.updateComplete;
+
+    expect(searchService.searchParams?.query).to.equal('collection:foo');
+    expect(searchService.searchType).to.equal(SearchType.METADATA);
+    expect(
+      el.shadowRoot?.querySelector('#big-results-label')?.textContent
+    ).to.contains('Results');
+  });
+
+  it('queries the search service with a fulltext search', async () => {
+    const searchService = new MockSearchService();
+
+    const el = await fixture<CollectionBrowser>(
+      html` <collection-browser
+        .searchService=${searchService}
+        searchTarget="fulltext"
+      >
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'collection:foo';
+    await el.updateComplete;
+
+    expect(searchService.searchParams?.query).to.equal('collection:foo');
+    expect(searchService.searchType).to.equal(SearchType.FULLTEXT);
+    expect(
+      el.shadowRoot?.querySelector('#big-results-label')?.textContent
+    ).to.contains('Results');
+  });
+
   it('queries for collection names after a fetch', async () => {
     const searchService = new MockSearchService();
     const collectionNameCache = new MockCollectionNameCache();
@@ -205,6 +248,155 @@ describe('Collection Browser', () => {
     ]);
   });
 
+  it('keeps search results from fetch if no change to query or sort param', async () => {
+    const resultsSpy = sinon.spy();
+    const searchService = new MockSearchService({
+      asyncResponse: true,
+      resultsSpy,
+    });
+
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser .searchService=${searchService}>
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'with-sort';
+    el.sortParam = { field: 'foo', direction: 'asc' };
+    await el.updateComplete;
+
+    await el.fetchPage(2);
+
+    // If there is no change to the query or sort param during the fetch, the results
+    // should be read.
+    expect(resultsSpy.callCount).to.be.greaterThanOrEqual(1);
+  });
+
+  it('discards obsolete search results if sort params changed before arrival', async () => {
+    const resultsSpy = sinon.spy();
+    const searchService = new MockSearchService({
+      asyncResponse: true,
+      resultsSpy,
+    });
+
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser .searchService=${searchService}>
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'with-sort';
+    el.sortParam = { field: 'foo', direction: 'asc' };
+    await el.updateComplete;
+
+    const fetchPromise = el.fetchPage(2);
+    el.sortParam = { field: 'foo', direction: 'desc' };
+    await fetchPromise;
+
+    // If the different sort param causes the results to be discarded,
+    // the results array should never be read.
+    expect(resultsSpy.callCount).to.equal(0);
+  });
+
+  it('discards obsolete search results if sort param added before arrival', async () => {
+    const resultsSpy = sinon.spy();
+    const searchService = new MockSearchService({
+      asyncResponse: true,
+      resultsSpy,
+    });
+
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser .searchService=${searchService}>
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'single-result';
+    await el.updateComplete;
+
+    const fetchPromise = el.fetchPage(2);
+    el.sortParam = { field: 'foo', direction: 'asc' };
+    await fetchPromise;
+
+    // If the different sort param causes the results to be discarded,
+    // the results array should never be read.
+    expect(resultsSpy.callCount).to.equal(0);
+  });
+
+  it('discards obsolete search results if sort param cleared before arrival', async () => {
+    const resultsSpy = sinon.spy();
+    const searchService = new MockSearchService({
+      asyncResponse: true,
+      resultsSpy,
+    });
+
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser .searchService=${searchService}>
+      </collection-browser>`
+    );
+
+    el.baseQuery = 'with-sort';
+    await el.updateComplete;
+
+    const fetchPromise = el.fetchPage(2);
+    el.sortParam = null;
+    await fetchPromise;
+
+    // If the different sort param causes the results to be discarded,
+    // the results array should never be read.
+    expect(resultsSpy.callCount).to.equal(0);
+  });
+
+  it('sets sort properties when user changes sort', async () => {
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser></collection-browser>`
+    );
+
+    expect(el.selectedSort).to.equal(SortField.relevance);
+
+    el.baseQuery = 'foo';
+    await el.updateComplete;
+
+    const sortBar = el.shadowRoot?.querySelector('sort-filter-bar');
+    const sortSelector = sortBar?.shadowRoot?.querySelector(
+      '#desktop-sort-selector'
+    );
+    expect(sortSelector).to.exist;
+
+    // Click the title sorter
+    [...(sortSelector?.children as HTMLCollection & Iterable<any>)] // tsc doesn't know children is iterable
+      .find(child => child.textContent?.trim() === 'Title')
+      ?.querySelector('a[href]')
+      ?.click();
+
+    await el.updateComplete;
+
+    expect(el.selectedSort).to.equal(SortField.title);
+  });
+
+  it('scrolls to page', async () => {
+    const el = await fixture<CollectionBrowser>(
+      html`<collection-browser></collection-browser>`
+    );
+
+    const infiniteScroller = el.shadowRoot?.querySelector(
+      'infinite-scroller'
+    ) as InfiniteScroller;
+    expect(infiniteScroller).to.exist;
+
+    const oldScrollToCell = infiniteScroller.scrollToCell;
+    const spy = sinon.spy();
+    infiniteScroller.scrollToCell = spy;
+
+    el.goToPage(1);
+
+    // Give it a second to scroll
+    await new Promise(res => {
+      setTimeout(res, 1000);
+    });
+
+    expect(spy.callCount).to.equal(1);
+
+    infiniteScroller.scrollToCell = oldScrollToCell;
+  });
+
   it('refreshes when certain properties change - with some analytics event sampling', async () => {
     const mockAnalyticsHandler = new MockAnalyticsHandler();
     const searchService = new MockSearchService();

package/test/collection-facets/more-facets-content.test.ts

@@ -1,7 +1,7 @@
 /* eslint-disable import/no-duplicates */
 import { expect, fixture, oneEvent } from '@open-wc/testing';
 import { html } from 'lit';
-import type { Aggregation } from '@internetarchive/search-service';
+import { Aggregation } from '@internetarchive/search-service';
 import type { MoreFacetsContent } from '../../src/collection-facets/more-facets-content';
 import '../../src/collection-facets/more-facets-content';
 import { MockSearchService } from '../mocks/mock-search-service';
@@ -18,15 +18,15 @@ const selectedFacetsGroup = {
   ],
 };
 
-const aggregation: Record<string, Aggregation> = {
-  'user_aggs__terms__field:collectionSorter__size:1': {
+const aggregations: Record<string, Aggregation> = {
+  collection: new Aggregation({
     buckets: [
       {
         key: 'foo',
         doc_count: 5,
       },
     ],
-  },
+  }),
 };
 
 describe('More facets content', () => {
@@ -109,7 +109,7 @@ describe('More facets content', () => {
       html`<more-facets-content
         .searchService=${searchService}
         .selectedFacets=${selectedFacetsGroup}
-        .aggregations=${aggregation}
+        .aggregations=${aggregations}
       ></more-facets-content>`
     );
 

package/test/collection-facets.test.ts

@@ -2,7 +2,7 @@
 import { expect, fixture } from '@open-wc/testing';
 import sinon from 'sinon';
 import { html } from 'lit';
-import type { Aggregation } from '@internetarchive/search-service';
+import { Aggregation } from '@internetarchive/search-service';
 import {
   ModalManager,
   ModalManagerInterface,
@@ -35,14 +35,14 @@ describe('Collection Facets', () => {
     );
 
     const aggs: Record<string, Aggregation> = {
-      'user_aggs__terms__field:subjectSorter__size:1': {
+      subject: new Aggregation({
         buckets: [
           {
             key: 'foo',
             doc_count: 5,
           },
         ],
-      },
+      }),
     };
 
     el.aggregations = aggs;
@@ -68,22 +68,22 @@ describe('Collection Facets', () => {
     );
 
     const aggs: Record<string, Aggregation> = {
-      'user_aggs__terms__field:subjectSorter__size:1': {
+      subject: new Aggregation({
         buckets: [
           {
             key: 'foo',
             doc_count: 5,
           },
         ],
-      },
-      'user_aggs__terms__field:mediatypeSorter__size:1': {
+      }),
+      mediatype: new Aggregation({
         buckets: [
           {
             key: 'bar',
             doc_count: 10,
           },
         ],
-      },
+      }),
     };
 
     el.aggregations = aggs;
@@ -99,14 +99,14 @@ describe('Collection Facets', () => {
     );
 
     const aggs: Record<string, Aggregation> = {
-      'user_aggs__terms__field:collection__size:1': {
+      collection: new Aggregation({
         buckets: [
           {
             key: 'foo',
             doc_count: 5,
           },
         ],
-      },
+      }),
     };
 
     el.aggregations = aggs;
@@ -127,14 +127,14 @@ describe('Collection Facets', () => {
     );
 
     const aggs: Record<string, Aggregation> = {
-      'user_aggs__terms__field:subjectSorter__size:1': {
+      subject: new Aggregation({
         buckets: [
           {
             key: 'foo',
             doc_count: 5,
           },
         ],
-      },
+      }),
     };
 
     el.aggregations = aggs;
@@ -155,14 +155,14 @@ describe('Collection Facets', () => {
       );
 
       const aggs: Record<string, Aggregation> = {
-        'user_aggs__terms__field:subjectSorter__size:1': {
+        subject: new Aggregation({
           buckets: [
             {
               key: 'foo',
               doc_count: 5,
             },
           ],
-        },
+        }),
       };
 
       el.aggregations = aggs;
@@ -171,6 +171,7 @@ describe('Collection Facets', () => {
       const moreLink = el.shadowRoot?.querySelector('.more-link');
       expect(moreLink).to.be.null;
     });
+
     it('Render More Facets', async () => {
       const el = await fixture<CollectionFacets>(
         html`<collection-facets
@@ -179,7 +180,7 @@ describe('Collection Facets', () => {
       );
 
       const aggs: Record<string, Aggregation> = {
-        'user_aggs__terms__field:subjectSorter__size:1': {
+        subject: new Aggregation({
           buckets: [
             {
               key: 'foo',
@@ -210,7 +211,7 @@ describe('Collection Facets', () => {
               doc_count: 5,
             },
           ],
-        },
+        }),
       };
 
       el.aggregations = aggs;

package/test/mocks/mock-search-responses.ts

@@ -1,6 +1,6 @@
 import type { Result } from '@internetarchive/result-type';
 import {
-  Metadata,
+  ItemHit,
   SearchResponse,
   SearchServiceError,
 } from '@internetarchive/search-service';
@@ -10,61 +10,110 @@ export const mockSuccessSingleResult: Result<
   SearchServiceError
 > = {
   success: {
+    request: {
+      clientParameters: {
+        user_query: 'collection:foo',
+        sort: [],
+      },
+      finalizedParameters: {
+        user_query: 'collection:foo',
+        sort: [],
+      },
+    },
     rawResponse: {},
     response: {
-      numFound: 1,
-      docs: [
-        new Metadata({
-          identifier: 'foo',
-          collections_raw: ['foo', 'bar'],
+      totalResults: 1,
+      returnedCount: 1,
+      results: [
+        new ItemHit({
+          fields: {
+            identifier: 'foo',
+            collection: ['foo', 'bar'],
+          },
         }),
       ],
-      start: 0,
     },
     responseHeader: {
-      status: 0,
-      QTime: 0,
-      params: {
-        query: 'collection:foo',
-        qin: 'collection:foo',
-        fields: 'identifier, collections_raw',
-        wt: 'foo',
-        start: 0,
-      },
+      succeeded: true,
+      query_time: 0,
     },
   },
 };
 
+export const getMockSuccessSingleResultWithSort: (
+  resultsSpy: Function
+) => Result<SearchResponse, SearchServiceError> = (resultsSpy: Function) => ({
+  success: {
+    request: {
+      clientParameters: {
+        user_query: 'with-sort',
+        sort: ['foo:asc'],
+      },
+      finalizedParameters: {
+        user_query: 'with-sort',
+        sort: ['foo:asc'],
+      },
+    },
+    rawResponse: {},
+    response: {
+      totalResults: 1,
+      returnedCount: 1,
+      get results() {
+        resultsSpy();
+        return [
+          new ItemHit({
+            fields: {
+              identifier: 'foo',
+              collection: ['foo', 'bar'],
+            },
+          }),
+        ];
+      },
+    },
+    responseHeader: {
+      succeeded: true,
+      query_time: 0,
+    },
+  },
+});
+
 export const mockSuccessMultipleResults: Result<
   SearchResponse,
   SearchServiceError
 > = {
   success: {
+    request: {
+      clientParameters: {
+        user_query: 'collection:foo',
+        sort: [],
+      },
+      finalizedParameters: {
+        user_query: 'collection:foo',
+        sort: [],
+      },
+    },
     rawResponse: {},
     response: {
-      numFound: 2,
-      docs: [
-        new Metadata({
-          identifier: 'foo',
-          collections_raw: ['foo', 'bar'],
+      totalResults: 2,
+      returnedCount: 2,
+      results: [
+        new ItemHit({
+          fields: {
+            identifier: 'foo',
+            collection: ['foo', 'bar'],
+          },
         }),
-        new Metadata({
-          identifier: 'bar',
-          collections_raw: ['baz', 'boop'],
+        new ItemHit({
+          fields: {
+            identifier: 'bar',
+            collection: ['baz', 'boop'],
+          },
         }),
       ],
-      start: 0,
     },
     responseHeader: {
-      status: 0,
-      QTime: 0,
-      params: {
-        query: 'collection:foo',
-        qin: 'collection:foo',
-        fields: 'identifier, collections_raw',
-        wt: 'foo',
-        start: 0,
-      },
+      succeeded: true,
+      query_time: 0,
     },
   },
 };

package/test/mocks/mock-search-service.ts

@@ -1,43 +1,53 @@
 import type { Result } from '@internetarchive/result-type';
 import type {
-  MetadataResponse,
   SearchParams,
   SearchResponse,
   SearchServiceInterface,
   SearchServiceError,
+  SearchType,
 } from '@internetarchive/search-service';
 import {
   mockSuccessSingleResult,
   mockSuccessMultipleResults,
+  getMockSuccessSingleResultWithSort,
 } from './mock-search-responses';
 
 export class MockSearchService implements SearchServiceInterface {
   searchParams?: SearchParams;
 
+  searchType?: SearchType;
+
+  asyncResponse: boolean;
+
+  resultsSpy: Function;
+
+  constructor({ asyncResponse = false, resultsSpy = () => {} } = {}) {
+    this.asyncResponse = asyncResponse;
+    this.resultsSpy = resultsSpy;
+  }
+
   async search(
-    params: SearchParams
+    params: SearchParams,
+    searchType: SearchType
   ): Promise<Result<SearchResponse, SearchServiceError>> {
     this.searchParams = params;
+    this.searchType = searchType;
+
+    if (this.asyncResponse) {
+      // Add an artificial 1-tick delay
+      await new Promise(res => {
+        setTimeout(res, 0);
+      });
+    }
 
     if (this.searchParams?.query === 'single-result') {
       return mockSuccessSingleResult;
     }
 
-    return mockSuccessMultipleResults;
-  }
-
-  async fetchMetadata(
-    identifier: string
-  ): Promise<Result<MetadataResponse, SearchServiceError>> {
-    console.debug('fetchMetadata', identifier);
-    throw new Error('Method not implemented.');
-  }
+    if (this.searchParams?.query === 'with-sort') {
+      return getMockSuccessSingleResultWithSort(this.resultsSpy);
+    }
 
-  async fetchMetadataValue<T>(
-    identifier: string,
-    keypath: string
-  ): Promise<Result<T, SearchServiceError>> {
-    console.debug('fetchMetadataValue', identifier, keypath);
-    throw new Error('Method not implemented.');
+    return mockSuccessMultipleResults;
   }
 }

package/test/text-snippet-block.test.ts

@@ -37,6 +37,23 @@ describe('TextSnippetBlock component', () => {
     expect(container?.querySelectorAll('mark').length).to.equal(3);
   });
 
+  it('should render marked snippets containing newlines', async () => {
+    const snippets = [
+      'some {{{snippet}}} text',
+      'some {{{other}}} {{{snippet\n text}}}',
+    ];
+
+    const el = await fixture<TextSnippetBlock>(
+      html`<text-snippet-block .snippets=${snippets}></text-snippet-block>`
+    );
+
+    const container = el.shadowRoot?.querySelector('.container');
+
+    // Has the correct number of snippets and highlights
+    expect(container?.children.length).to.equal(snippets.length);
+    expect(container?.querySelectorAll('mark').length).to.equal(3);
+  });
+
   it('should render correctly in grid mode', async () => {
     const el = await fixture<TextSnippetBlock>(
       html`<text-snippet-block

package/tsconfig.json

@@ -1,21 +1,21 @@
-{
-  "compilerOptions": {
-    "target": "es2018",
-    "module": "esnext",
-    "moduleResolution": "node",
-    "noEmitOnError": true,
-    "lib": ["es2017", "dom"],
-    "strict": true,
-    "esModuleInterop": false,
-    "allowSyntheticDefaultImports": true,
-    "experimentalDecorators": true,
-    "importHelpers": true,
-    "outDir": "dist",
-    "sourceMap": true,
-    "inlineSources": true,
-    "rootDir": "./",
-    "declaration": true,
-    "importsNotUsedAsValues": "error"
-  },
-  "include": ["src", "test", "index.ts", "types"],
-}
+{
+  "compilerOptions": {
+    "target": "es2018",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "noEmitOnError": true,
+    "lib": ["es2017", "dom"],
+    "strict": true,
+    "esModuleInterop": false,
+    "allowSyntheticDefaultImports": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "outDir": "dist",
+    "sourceMap": true,
+    "inlineSources": true,
+    "rootDir": "./",
+    "declaration": true,
+    "importsNotUsedAsValues": "error"
+  },
+  "include": ["src", "test", "index.ts", "types"],
+}