@internetarchive/collection-browser 3.3.2 → 3.3.4-alpha-webdev7761.0

package/dist/test/collection-browser.test.js

@@ -0,0 +1,1721 @@
+import { aTimeout, expect, fixture } from '@open-wc/testing';
+import { html } from 'lit';
+import sinon from 'sinon';
+import { FilterConstraint, SearchType } from '@internetarchive/search-service';
+import '../src/collection-browser';
+import { getDefaultSelectedFacets, SortField, } from '../src/models';
+import { MockSearchService } from './mocks/mock-search-service';
+import { MockAnalyticsHandler } from './mocks/mock-analytics-handler';
+import { analyticsActions, analyticsCategories, } from '../src/utils/analytics-events';
+/**
+ * Wait for the next tick of the event loop.
+ *
+ * This is necessary in some of the tests because certain collection browser
+ * updates take more than one tick to render (e.g., date picker & query changes).
+ * These delays are non-ideal and should eventually be investigated and fixed,
+ * but they are minor enough that waiting for the next tick is a reasonable
+ * testing solution for now.
+ */
+const nextTick = () => aTimeout(0);
+describe('Collection Browser', () => {
+    beforeEach(async () => {
+        // Apparently query params set by one test can bleed into other tests.
+        // Since collection browser restores its state from certain query params, we need
+        // to clear these before each test to ensure they run in isolation from one another.
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.delete('sin');
+        searchParams.delete('sort');
+        searchParams.delete('query');
+        searchParams.delete('page');
+        searchParams.delete('and[]');
+        searchParams.delete('not[]');
+        window.history.replaceState({}, '', url);
+    });
+    it('clears selected facets when requested', async () => {
+        const selectedFacets = getDefaultSelectedFacets();
+        selectedFacets.creator.foo = { count: 1, key: 'foo', state: 'selected' };
+        const el = await fixture(html `<collection-browser></collection-browser>`);
+        el.selectedFacets = selectedFacets;
+        await el.updateComplete;
+        el.clearFilters(); // By default, sort is not cleared
+        expect(el.selectedFacets).to.deep.equal(getDefaultSelectedFacets());
+    });
+    it('clears existing filters but not sort by default', async () => {
+        const el = await fixture(html `<collection-browser></collection-browser>`);
+        el.selectedSort = 'title';
+        el.sortDirection = 'asc';
+        await el.updateComplete;
+        el.clearFilters(); // By default, sort is not cleared
+        expect(el.selectedFacets).to.deep.equal(getDefaultSelectedFacets());
+        expect(el.selectedSort).to.equal('title');
+        expect(el.sortDirection).to.equal('asc');
+        expect(el.sortParam).to.deep.equal({
+            field: 'titleSorter',
+            direction: 'asc',
+        });
+        expect(el.selectedCreatorFilter).to.be.null;
+        expect(el.selectedTitleFilter).to.be.null;
+    });
+    it('clears existing filters for facets & sort via option', async () => {
+        const el = await fixture(html `<collection-browser></collection-browser>`);
+        el.selectedSort = 'title';
+        await el.updateComplete;
+        el.clearFilters({ sort: true }); // Sort is reset too due to the option
+        expect(el.selectedFacets).to.deep.equal(getDefaultSelectedFacets());
+        expect(el.selectedSort).to.equal(SortField.default);
+        expect(el.sortDirection).to.be.null;
+        expect(el.sortParam).to.be.null;
+        expect(el.selectedCreatorFilter).to.be.null;
+        expect(el.selectedTitleFilter).to.be.null;
+    });
+    it('filterBy creator with analytics', async () => {
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const el = await fixture(html `<collection-browser .analyticsHandler=${mockAnalyticsHandler}>
+      </collection-browser>`);
+        el.searchContext = 'betaSearchService';
+        el.selectedSort = 'creator';
+        el.sortDirection = 'asc';
+        el.selectedCreatorFilter = 'A';
+        await el.updateComplete;
+        expect(mockAnalyticsHandler.callCategory).to.equal('betaSearchService');
+        expect(mockAnalyticsHandler.callAction).to.equal('filterByCreator');
+        expect(mockAnalyticsHandler.callLabel).to.equal('start-A');
+        el.clearFilters();
+        await el.updateComplete;
+        expect(el.selectedTitleFilter).to.be.null;
+        expect(mockAnalyticsHandler.callCategory).to.equal('betaSearchService');
+        expect(mockAnalyticsHandler.callAction).to.equal('filterByCreator');
+        expect(mockAnalyticsHandler.callLabel).to.equal('clear-A');
+    });
+    it('filterBy title with analytics', async () => {
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const el = await fixture(html `<collection-browser .analyticsHandler=${mockAnalyticsHandler}>
+      </collection-browser>`);
+        el.searchContext = 'beta-search-service';
+        el.selectedSort = 'title';
+        el.sortDirection = 'asc';
+        el.selectedTitleFilter = 'A';
+        await el.updateComplete;
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('filterByTitle');
+        expect(mockAnalyticsHandler.callLabel).to.equal('start-A');
+        el.clearFilters();
+        await el.updateComplete;
+        expect(el.selectedTitleFilter).to.be.null;
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('filterByTitle');
+        expect(mockAnalyticsHandler.callLabel).to.equal('clear-A');
+    });
+    it('selected facets with analytics - not negative facets', async () => {
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const mediaTypeBucket = { count: 123, state: 'selected' };
+        const mockedSelectedFacets = {
+            subject: {},
+            lending: {},
+            mediatype: { data: mediaTypeBucket },
+            language: {},
+            creator: {},
+            collection: {},
+            year: {},
+        };
+        const el = await fixture(html `<collection-browser .analyticsHandler=${mockAnalyticsHandler}>
+      </collection-browser>`);
+        el.searchContext = 'search-service';
+        el.selectedFacets = mockedSelectedFacets;
+        await el.updateComplete;
+        el.facetClickHandler(new CustomEvent('facetClick', {
+            detail: {
+                facetType: 'mediatype',
+                bucket: {
+                    key: '',
+                    state: 'selected',
+                    count: 123,
+                },
+                negative: false,
+            },
+        }));
+        expect(mockAnalyticsHandler.callCategory).to.equal('search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('facetSelected');
+        expect(mockAnalyticsHandler.callLabel).to.equal('mediatype');
+        el.facetClickHandler(new CustomEvent('facetClick', {
+            detail: {
+                facetType: 'mediatype',
+                bucket: {
+                    key: '',
+                    state: 'none',
+                    count: 123,
+                },
+                negative: false,
+            },
+        }));
+        expect(el.selectedFacets).to.equal(mockedSelectedFacets);
+        expect(mockAnalyticsHandler.callCategory).to.equal('search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('facetDeselected');
+        expect(mockAnalyticsHandler.callLabel).to.equal('mediatype');
+    });
+    it('selected facets with analytics - negative facets', async () => {
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const mediaTypeBucket = { count: 123, state: 'selected' };
+        const mockedSelectedFacets = {
+            subject: {},
+            lending: {},
+            mediatype: { data: mediaTypeBucket },
+            language: {},
+            creator: {},
+            collection: {},
+            year: {},
+        };
+        const el = await fixture(html `<collection-browser .analyticsHandler=${mockAnalyticsHandler}>
+      </collection-browser>`);
+        el.searchContext = 'beta-search-service';
+        el.selectedFacets = mockedSelectedFacets;
+        await el.updateComplete;
+        el.facetClickHandler(new CustomEvent('facetClick', {
+            detail: {
+                facetType: 'mediatype',
+                bucket: {
+                    key: '',
+                    state: 'hidden',
+                    count: 123,
+                },
+                negative: true,
+            },
+        }));
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('facetNegativeSelected');
+        expect(mockAnalyticsHandler.callLabel).to.equal('mediatype');
+        el.facetClickHandler(new CustomEvent('facetClick', {
+            detail: {
+                facetType: 'mediatype',
+                bucket: {
+                    key: '',
+                    state: 'none',
+                    count: 123,
+                },
+                negative: true,
+            },
+        }));
+        expect(el.selectedFacets).to.equal(mockedSelectedFacets);
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search-service');
+        expect(mockAnalyticsHandler.callAction).to.equal('facetNegativeDeselected');
+        expect(mockAnalyticsHandler.callLabel).to.equal('mediatype');
+    });
+    it('should render with a sort bar, facets, and infinite scroller', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'hello';
+        await el.updateComplete;
+        await nextTick();
+        const facets = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('collection-facets');
+        const sortBar = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('sort-filter-bar');
+        const infiniteScroller = (_c = el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('infinite-scroller');
+        expect(facets, 'facets').to.exist;
+        expect(sortBar, 'sort bar').to.exist;
+        expect(infiniteScroller, 'infinite scroller').to.exist;
+    });
+    it('queries the search service when given a base query', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('queries the search service when given a list of identifiers and no query', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.identifiers = ['foo', 'bar'];
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.identifiers).to.deep.equal([
+            'foo',
+            'bar',
+        ]);
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('queries the search service when given a list of identifiers with a query', async () => {
+        var _a, _b, _c, _d;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        el.identifiers = ['foo', 'bar'];
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect((_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.identifiers).to.deep.equal([
+            'foo',
+            'bar',
+        ]);
+        expect((_d = (_c = el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('#big-results-label')) === null || _d === void 0 ? void 0 : _d.textContent).to.contains('Results');
+    });
+    it('queries the search service with a metadata search', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html ` <collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.searchType = SearchType.METADATA;
+        await el.updateComplete;
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect(searchService.searchType).to.equal(SearchType.METADATA);
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('can change search type', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        el.searchType = SearchType.FULLTEXT;
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(searchService.searchType).to.equal(SearchType.FULLTEXT);
+    });
+    it('queries the search service with a fulltext search', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html ` <collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.searchType = SearchType.FULLTEXT;
+        await el.updateComplete;
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect(searchService.searchType).to.equal(SearchType.FULLTEXT);
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('queries the search service with a radio search', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html ` <collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.searchType = SearchType.RADIO;
+        await el.updateComplete;
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect(searchService.searchType).to.equal(SearchType.RADIO);
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('queries the search service with a TV search', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html ` <collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.searchType = SearchType.TV;
+        await el.updateComplete;
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect(searchService.searchType).to.equal(SearchType.TV);
+        expect((_c = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#big-results-label')) === null || _c === void 0 ? void 0 : _c.textContent).to.contains('Results');
+    });
+    it('queries the search service with facets selected/negated', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const selectedFacets = {
+            subject: {
+                foo: {
+                    key: 'foo',
+                    count: 1,
+                    state: 'selected',
+                },
+                bar: {
+                    key: 'bar',
+                    count: 2,
+                    state: 'hidden',
+                },
+            },
+            lending: {},
+            mediatype: {},
+            language: {
+                en: {
+                    key: 'en',
+                    count: 1,
+                    state: 'selected',
+                },
+            },
+            creator: {},
+            collection: {},
+            year: {},
+        };
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        el.selectedFacets = selectedFacets;
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect((_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.filters).to.deep.equal({
+            subject: {
+                foo: 'inc',
+                bar: 'exc',
+            },
+            language: {
+                en: 'inc',
+            },
+        });
+    });
+    it('fails gracefully if no search service provided', async () => {
+        var _a;
+        const el = await fixture(html `<collection-browser></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        // This shouldn't throw an error
+        expect(el.dataSource.fetchPage(3)).to.exist;
+        // Should continue showing the empty placeholder
+        expect((_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('empty-placeholder')).to.exist;
+    });
+    it('restores search type from URL param', async () => {
+        // Add a sin=TXT param to the URL
+        const url = new URL(window.location.href);
+        url.searchParams.append('sin', 'TXT');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+    });
+    it('does not persist or restore search type from URL param if suppressed', async () => {
+        // Add a sin=TXT param to the URL
+        let url = new URL(window.location.href);
+        url.searchParams.append('sin', 'TXT');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        suppressURLSinParam
+      >
+      </collection-browser>`);
+        url = new URL(window.location.href);
+        expect(el.searchType).to.equal(SearchType.DEFAULT);
+        expect(url.searchParams.has('sin')).to.be.false; // Removes existing sin param
+        el.searchType = SearchType.RADIO;
+        await el.updateComplete;
+        url = new URL(window.location.href);
+        expect(url.searchParams.has('sin')).to.be.false; // Doesn't add sin param
+    });
+    it('can construct tile models with many fields present', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'many-fields';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const cellTemplate = el.cellForIndex(0);
+        expect(cellTemplate).to.exist;
+        const cell = await fixture(cellTemplate);
+        expect(cell).to.exist;
+    });
+    it('emits empty results event when search fetches no results', async () => {
+        const searchService = new MockSearchService();
+        const emptyResultsSpy = sinon.spy();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        @emptyResults=${emptyResultsSpy}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'no-results';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(emptyResultsSpy.callCount).to.equal(1);
+    });
+    it('emits searchError event when search results in an error', async () => {
+        const searchService = new MockSearchService();
+        const searchErrorSpy = sinon.spy();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        @searchError=${searchErrorSpy}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'error';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(searchErrorSpy.callCount).to.equal(1);
+    });
+    it('applies loggedin flag to tile models if needed', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'loggedin';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const cellTemplate = el.cellForIndex(0);
+        expect(cellTemplate).to.exist;
+        const cell = await fixture(cellTemplate);
+        expect(cell).to.exist;
+        expect((_a = cell.model) === null || _a === void 0 ? void 0 : _a.loginRequired).to.be.true;
+    });
+    it('applies no-preview flag to tile models if needed', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'no-preview';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const cellTemplate = el.cellForIndex(0);
+        expect(cellTemplate).to.exist;
+        const cell = await fixture(cellTemplate);
+        expect(cell).to.exist;
+        expect((_a = cell.model) === null || _a === void 0 ? void 0 : _a.contentWarning).to.be.true;
+    });
+    it('both loggedin and no-preview flags can be set simultaneously', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'loggedin-no-preview';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const cellTemplate = el.cellForIndex(0);
+        expect(cellTemplate).to.exist;
+        const cell = await fixture(cellTemplate);
+        expect(cell).to.exist;
+        expect((_a = cell.model) === null || _a === void 0 ? void 0 : _a.loginRequired).to.be.true;
+        expect((_b = cell.model) === null || _b === void 0 ? void 0 : _b.contentWarning).to.be.true;
+    });
+    it('joins full description array into a single string with line breaks', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        // This query receives an array description like ['line1', 'line2']
+        el.baseQuery = 'multi-line-description';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const cellTemplate = el.cellForIndex(0);
+        expect(cellTemplate).to.exist;
+        const cell = await fixture(cellTemplate);
+        expect(cell).to.exist;
+        // Actual model description should be joined
+        expect((_a = cell.model) === null || _a === void 0 ? void 0 : _a.description).to.equal('line1\nline2');
+    });
+    it('can change search type', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .searchType=${SearchType.METADATA}
+      ></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        el.searchType = SearchType.FULLTEXT;
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+        expect(searchService.searchType).to.equal(SearchType.FULLTEXT);
+    });
+    it('trims queries of leading/trailing whitespace', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+      ></collection-browser>`);
+        el.baseQuery = '   collection:foo   ';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('collection:foo');
+    });
+    it('shows error message when error response received', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+      ></collection-browser>`);
+        el.baseQuery = 'error';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const errorPlaceholder = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('empty-placeholder');
+        const errorDetails = (_b = errorPlaceholder === null || errorPlaceholder === void 0 ? void 0 : errorPlaceholder.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.error-details');
+        expect(errorDetails).to.exist;
+        expect(errorDetails.textContent).to.contain('foo');
+    });
+    it('shows error message when error response received for a collection', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+      ></collection-browser>`);
+        el.withinCollection = 'error';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const errorPlaceholder = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('empty-placeholder');
+        const errorDetails = (_b = errorPlaceholder === null || errorPlaceholder === void 0 ? void 0 : errorPlaceholder.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.error-details');
+        expect(errorDetails).to.exist;
+        expect(errorDetails.textContent).to.contain('foo');
+    });
+    it('reports malformed response errors to Sentry', async () => {
+        const sentrySpy = sinon.spy();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        window.Sentry = { captureMessage: sentrySpy };
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+      ></collection-browser>`);
+        el.baseQuery = 'malformed';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(sentrySpy.callCount).to.be.greaterThanOrEqual(1);
+    });
+    it('adds collection names to cache when present on response', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'collection-titles';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(el.dataSource.collectionTitles.get('foo')).to.equal('Foo Collection');
+        expect(el.dataSource.collectionTitles.get('bar')).to.equal('Bar Collection');
+        expect(el.dataSource.collectionTitles.get('baz')).to.equal('Baz Collection');
+        expect(el.dataSource.collectionTitles.get('boop')).to.equal('Boop Collection');
+    });
+    it('adds tv channel aliases to cache when present on response', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'channel-aliases';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect(el.dataSource.tvChannelAliases.get('foo')).to.equal('Foo Network');
+        expect(el.dataSource.tvChannelAliases.get('bar')).to.equal('Bar Network');
+    });
+    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(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'with-sort';
+        el.selectedSort = SortField.date;
+        el.sortDirection = 'asc';
+        await el.updateComplete;
+        await el.dataSource.fetchPage(3);
+        // 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(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'with-sort';
+        el.selectedSort = SortField.date;
+        el.sortDirection = 'asc';
+        await el.updateComplete;
+        // We want to spy exclusively on the first set of results, not the second
+        searchService.asyncResponse = false;
+        searchService.resultsSpy = () => { };
+        el.sortDirection = 'desc';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        // If the different sort param causes the results to be discarded,
+        // the first 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(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'single-result';
+        await el.updateComplete;
+        // We want to spy exclusively on the first set of results, not the second
+        searchService.asyncResponse = false;
+        searchService.resultsSpy = () => { };
+        el.selectedSort = SortField.date;
+        el.sortDirection = 'asc';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        // If the different sort param causes the results to be discarded,
+        // the first 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(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'with-sort';
+        el.selectedSort = SortField.date;
+        el.sortDirection = 'asc';
+        await el.updateComplete;
+        // We want to spy exclusively on the first set of results, not the second
+        searchService.asyncResponse = false;
+        searchService.resultsSpy = () => { };
+        el.selectedSort = SortField.default;
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        // If the different sort param causes the results to be discarded,
+        // the first results array should never be read.
+        expect(resultsSpy.callCount).to.equal(0);
+    });
+    it('sets sort properties when user changes sort', async () => {
+        var _a, _b, _c, _d, _e, _f;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        expect(el.selectedSort).to.equal(SortField.default);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await nextTick();
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#content-container sort-filter-bar');
+        const sortSelector = (_b = sortBar === null || sortBar === void 0 ? void 0 : sortBar.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#desktop-sort-selector');
+        expect(sortSelector, 'sort bar').to.exist;
+        // Click the title sorter
+        (_d = (_c = Array.from(sortSelector.children)
+            .find(child => { var _a; return ((_a = child.textContent) === null || _a === void 0 ? void 0 : _a.trim()) === 'Title'; })) === null || _c === void 0 ? void 0 : _c.querySelector('button')) === null || _d === void 0 ? void 0 : _d.click();
+        await el.updateComplete;
+        expect(el.selectedSort).to.equal(SortField.title);
+        // Click the creator sorter
+        (_f = (_e = Array.from(sortSelector.children)
+            .find(child => { var _a; return ((_a = child.textContent) === null || _a === void 0 ? void 0 : _a.trim()) === 'Creator'; })) === null || _e === void 0 ? void 0 : _e.querySelector('button')) === null || _f === void 0 ? void 0 : _f.click();
+        await el.updateComplete;
+        expect(el.selectedSort).to.equal(SortField.creator);
+    });
+    it('sets sort filter properties when user selects title filter', async () => {
+        var _a, _b, _c, _d;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'first-title';
+        el.selectedSort = 'title';
+        el.sortDirection = 'asc';
+        el.selectedTitleFilter = 'X';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('first-title');
+        expect((_d = (_c = (_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.filters) === null || _c === void 0 ? void 0 : _c.firstTitle) === null || _d === void 0 ? void 0 : _d.X).to.equal(FilterConstraint.INCLUDE);
+    });
+    it('sets sort filter properties when user selects creator filter', async () => {
+        var _a, _b, _c, _d;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'first-creator';
+        el.selectedSort = 'creator';
+        el.sortDirection = 'asc';
+        el.selectedCreatorFilter = 'X';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('first-creator');
+        expect((_d = (_c = (_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.filters) === null || _c === void 0 ? void 0 : _c.firstCreator) === null || _d === void 0 ? void 0 : _d.X).to.equal(FilterConstraint.INCLUDE);
+    });
+    it('sets sort filter properties simultaneous with facets and date range', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const selectedFacets = {
+            collection: { foo: { key: 'foo', state: 'selected', count: 1 } },
+            creator: {},
+            language: {},
+            lending: {},
+            mediatype: {},
+            subject: {},
+            year: {},
+        };
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'first-creator';
+        el.selectedSort = 'creator';
+        el.selectedFacets = selectedFacets;
+        el.minSelectedDate = '1950';
+        el.maxSelectedDate = '1970';
+        el.sortDirection = 'asc';
+        el.selectedCreatorFilter = 'X';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('first-creator');
+        expect((_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.filters).to.deep.equal({
+            collection: {
+                foo: 'inc',
+            },
+            year: {
+                '1950': 'gte',
+                '1970': 'lte',
+            },
+            firstCreator: {
+                X: 'inc',
+            },
+        });
+    });
+    it('applies correct TV search filter for commercials', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'tv-fields';
+        el.searchType = SearchType.TV;
+        el.selectedFacets = {
+            clip_type: {
+                commercial: { key: 'commercial', count: 1, state: 'selected' },
+            },
+        };
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_c = (_b = (_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.filters) === null || _b === void 0 ? void 0 : _b.clip_type) === null || _c === void 0 ? void 0 : _c.commercial).to.equal(FilterConstraint.INCLUDE);
+    });
+    it('applies correct TV search filter for fact checks', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'tv-fields';
+        el.searchType = SearchType.TV;
+        el.selectedFacets = {
+            clip_type: {
+                'fact check': { key: 'fact check', count: 1, state: 'selected' },
+            },
+        };
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_c = (_b = (_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.filters) === null || _b === void 0 ? void 0 : _b.clip_type) === null || _c === void 0 ? void 0 : _c['fact check']).to.equal(FilterConstraint.INCLUDE);
+    });
+    it('applies correct TV search filter for quotes', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'tv-fields';
+        el.searchType = SearchType.TV;
+        el.selectedFacets = {
+            clip_type: { quote: { key: 'quote', count: 1, state: 'selected' } },
+        };
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_c = (_b = (_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.filters) === null || _b === void 0 ? void 0 : _b.clip_type) === null || _c === void 0 ? void 0 : _c.quote).to.equal(FilterConstraint.INCLUDE);
+    });
+    it('resets letter filters when query changes', async () => {
+        var _a, _b, _c, _d, _e, _f, _g;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'first-creator';
+        el.selectedSort = 'creator';
+        el.sortDirection = 'asc';
+        el.selectedCreatorFilter = 'X';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await nextTick();
+        expect((_a = searchService.searchParams) === null || _a === void 0 ? void 0 : _a.query).to.equal('first-creator');
+        expect((_d = (_c = (_b = searchService.searchParams) === null || _b === void 0 ? void 0 : _b.filters) === null || _c === void 0 ? void 0 : _c.firstCreator) === null || _d === void 0 ? void 0 : _d.X).to.equal(FilterConstraint.INCLUDE);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await nextTick();
+        expect((_e = searchService.searchParams) === null || _e === void 0 ? void 0 : _e.query).to.equal('collection:foo');
+        expect((_g = (_f = searchService.searchParams) === null || _f === void 0 ? void 0 : _f.filters) === null || _g === void 0 ? void 0 : _g.firstCreator).not.to.exist;
+    });
+    it('sets date range query when date picker selection changed', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .analyticsHandler=${mockAnalyticsHandler}
+        .suppressPlaceholders=${true}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'years'; // Includes year_histogram aggregation in response
+        el.showHistogramDatePicker = true;
+        await el.updateComplete;
+        const facets = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('collection-facets');
+        await (facets === null || facets === void 0 ? void 0 : facets.updateComplete);
+        // Wait for the date picker to be rendered (which may take until the next tick)
+        await nextTick();
+        const histogram = (_b = facets === null || facets === void 0 ? void 0 : facets.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('histogram-date-range');
+        expect(histogram, 'histogram exists').to.exist;
+        // Enter a new min date into the date picker
+        const minDateInput = (_c = histogram.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('#date-min');
+        const pressEnterEvent = new KeyboardEvent('keyup', {
+            key: 'Enter',
+        });
+        minDateInput.value = '1960';
+        minDateInput.dispatchEvent(pressEnterEvent);
+        // Wait for the histogram's update delay
+        await aTimeout(histogram.updateDelay + 50);
+        // Ensure that the histogram change propagated to the collection browser's
+        // date query correctly.
+        await el.updateComplete;
+        expect(el.minSelectedDate).to.equal('1960');
+        expect(el.maxSelectedDate).to.equal('2009');
+    });
+    it('sets date range query when monthly date picker selection changed', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .suppressPlaceholders=${true}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'months'; // Includes date_histogram aggregation in response
+        el.searchType = SearchType.TV;
+        el.showHistogramDatePicker = true;
+        await el.updateComplete;
+        const facets = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('collection-facets');
+        await (facets === null || facets === void 0 ? void 0 : facets.updateComplete);
+        // Wait for the date picker to be rendered (which may take until the next tick)
+        await nextTick();
+        const histogram = (_b = facets === null || facets === void 0 ? void 0 : facets.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('histogram-date-range');
+        expect(histogram, 'histogram exists').to.exist;
+        // Enter a new min date into the date picker
+        const minDateInput = (_c = histogram.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('#date-min');
+        const pressEnterEvent = new KeyboardEvent('keyup', {
+            key: 'Enter',
+        });
+        minDateInput.value = '2001-02';
+        minDateInput.dispatchEvent(pressEnterEvent);
+        // Wait for the histogram's update delay
+        await aTimeout(histogram.updateDelay + 50);
+        // Ensure that the histogram change propagated to the collection browser's
+        // date query correctly.
+        await el.updateComplete;
+        expect(el.minSelectedDate).to.equal('2001-02');
+        expect(el.maxSelectedDate).to.equal('2002-12');
+    });
+    it('emits event when results start and end loading', async () => {
+        var _a, _b, _c, _d;
+        const spy = sinon.spy();
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        @searchResultsLoadingChanged=${spy}
+      ></collection-browser>`);
+        spy.resetHistory();
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        // Should initially emit loading=true, then later emit loading=false
+        expect(spy.callCount).to.equal(2);
+        expect((_b = (_a = spy.firstCall.firstArg) === null || _a === void 0 ? void 0 : _a.detail) === null || _b === void 0 ? void 0 : _b.loading).to.equal(true);
+        expect((_d = (_c = spy.secondCall.firstArg) === null || _c === void 0 ? void 0 : _c.detail) === null || _d === void 0 ? void 0 : _d.loading).to.equal(false);
+    });
+    it('collapses extra set of quotes around href field', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      ></collection-browser>`);
+        el.baseQuery = 'extra-quoted-href';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        await aTimeout(50);
+        // Original href q param starts/ends with %22%22, but should be collapsed to %22 before render
+        expect((_a = el.dataSource.getTileModelAt(0)) === null || _a === void 0 ? void 0 : _a.href).to.equal('/details/foo?q=%22quoted+query%22');
+    });
+    it('sets default sort from collection metadata', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      ></collection-browser>`);
+        el.withinCollection = 'default-sort';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        await aTimeout(50);
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('sort-filter-bar');
+        expect(sortBar).to.exist;
+        expect(sortBar.defaultSortField).to.equal(SortField.title);
+        expect(sortBar.defaultSortDirection).to.equal('asc');
+        expect(sortBar.selectedSort).to.equal(SortField.default);
+        expect(sortBar.sortDirection).to.be.null;
+    });
+    it('sets default sort from collection metadata in "-field" format', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      ></collection-browser>`);
+        el.withinCollection = 'default-sort-concise';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        await aTimeout(50);
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('sort-filter-bar');
+        expect(sortBar).to.exist;
+        expect(sortBar.defaultSortField).to.equal(SortField.dateadded);
+        expect(sortBar.defaultSortDirection).to.equal('desc');
+        expect(sortBar.selectedSort).to.equal(SortField.default);
+        expect(sortBar.sortDirection).to.be.null;
+    });
+    it('falls back to weekly views default sorting on profiles when tab not set', async () => {
+        const el = await fixture(html `<collection-browser
+        .withinProfile=${'@foobar'}
+      ></collection-browser>`);
+        el.applyDefaultProfileSort();
+        expect(el.defaultSortParam).to.deep.equal({
+            field: 'week',
+            direction: 'desc',
+        });
+    });
+    it('uses relevance sort as default when a query is set', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      ></collection-browser>`);
+        el.withinCollection = 'default-sort';
+        el.baseQuery = 'default-sort';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        await aTimeout(50);
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('sort-filter-bar');
+        expect(sortBar).to.exist;
+        expect(sortBar.defaultSortField).to.equal(SortField.relevance);
+        expect(sortBar.defaultSortDirection).to.be.null;
+        expect(sortBar.selectedSort).to.equal(SortField.default);
+        expect(sortBar.sortDirection).to.be.null;
+    });
+    it('uses date favorited sort as default when targeting fav- collection', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      ></collection-browser>`);
+        el.withinCollection = 'fav-sort';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        await aTimeout(50);
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('sort-filter-bar');
+        expect(sortBar).to.exist;
+        expect(sortBar.defaultSortField).to.equal(SortField.datefavorited);
+        expect(sortBar.defaultSortDirection).to.equal('desc');
+        expect(sortBar.selectedSort).to.equal(SortField.default);
+        expect(sortBar.sortDirection).to.be.null;
+    });
+    it('scrolls to page', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        // Infinite scroller won't exist unless there's a base query.
+        // First ensure that we don't throw errors when it doesn't exist.
+        await el.goToPage(1);
+        // And make sure it correctly calls scrollToCell when the
+        // infinite scroller does exist.
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await nextTick();
+        const infiniteScroller = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('infinite-scroller');
+        expect(infiniteScroller).to.exist;
+        const oldScrollToCell = infiniteScroller.scrollToCell;
+        const spy = sinon.spy();
+        infiniteScroller.scrollToCell = spy;
+        await el.goToPage(1);
+        expect(spy.callCount, 'scroll to page fires once').to.equal(1);
+        infiniteScroller.scrollToCell = oldScrollToCell;
+    });
+    it('shows mobile facets in mobile view', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .mobileBreakpoint=${9999}
+      ></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        const contentContainer = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#content-container');
+        el.handleResize({
+            target: contentContainer,
+            contentRect: contentContainer.getBoundingClientRect(),
+            borderBoxSize: [],
+            contentBoxSize: [],
+            devicePixelContentBoxSize: [],
+        });
+        await el.updateComplete;
+        const mobileFacets = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#mobile-filter-collapse');
+        expect(mobileFacets).to.exist;
+    });
+    it('fires analytics when mobile facets toggled', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const analyticsHandler = new MockAnalyticsHandler();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .analyticsHandler=${analyticsHandler}
+        .searchContext=${'foobar-context'}
+        .mobileBreakpoint=${9999}
+      ></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        const contentContainer = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#content-container');
+        el.handleResize({
+            target: contentContainer,
+            contentRect: contentContainer.getBoundingClientRect(),
+            borderBoxSize: [],
+            contentBoxSize: [],
+            devicePixelContentBoxSize: [],
+        });
+        await el.updateComplete;
+        const mobileFacets = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#mobile-filter-collapse');
+        expect(mobileFacets).to.exist;
+        // We set up a Promise to wait for the 'toggle' event on the collapser,
+        // which is what triggers the analytics.
+        let facetsToggled = new Promise(resolve => {
+            mobileFacets.addEventListener('toggle', resolve);
+        });
+        // Open the mobile facets accordion & check analytics
+        const mobileFacetsHeader = mobileFacets.querySelector('summary');
+        expect(mobileFacetsHeader).to.exist;
+        mobileFacetsHeader.click();
+        await facetsToggled;
+        expect(analyticsHandler.callCategory).to.equal('foobar-context');
+        expect(analyticsHandler.callAction).to.equal(analyticsActions.mobileFacetsToggled);
+        expect(analyticsHandler.callLabel).to.equal('open');
+        // Close the mobile facets accordion & check analytics
+        facetsToggled = new Promise(resolve => {
+            mobileFacets.addEventListener('toggle', resolve);
+        });
+        mobileFacetsHeader.click();
+        await facetsToggled;
+        expect(analyticsHandler.callCategory).to.equal('foobar-context');
+        expect(analyticsHandler.callAction).to.equal(analyticsActions.mobileFacetsToggled);
+        expect(analyticsHandler.callLabel).to.equal('closed');
+    });
+    it('sets parent collections to prop when searching a collection', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinCollection=${'fake'}
+      ></collection-browser>`);
+        el.baseQuery = 'parent-collections';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await aTimeout(0);
+        expect(el.dataSource.parentCollections).to.deep.equal(['foo', 'bar']);
+    });
+    it('recognizes TV collections', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinCollection=${'TV-FOO'}
+      ></collection-browser>`);
+        el.baseQuery = 'tv-collection';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await aTimeout(0);
+        expect(el.isTVCollection).to.be.true;
+    });
+    it('refreshes when certain properties change - with some analytics event sampling', async () => {
+        var _a;
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .analyticsHandler=${mockAnalyticsHandler}
+        .searchService=${searchService}
+      ></collection-browser>`);
+        const infiniteScrollerRefreshSpy = sinon.spy();
+        // Infinite scroller won't exist unless there's a base query
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await nextTick();
+        const infiniteScroller = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('infinite-scroller');
+        infiniteScroller.reload = infiniteScrollerRefreshSpy;
+        expect(infiniteScrollerRefreshSpy.called).to.be.false;
+        expect(infiniteScrollerRefreshSpy.callCount).to.equal(0);
+        // testing: `loggedIn`
+        el.loggedIn = true;
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.called, 'Infinite Scroller Refresh').to.be
+            .true;
+        expect(infiniteScrollerRefreshSpy.callCount, 'Infinite Scroller Refresh call count').to.equal(1);
+        el.loggedIn = false;
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.callCount, '2nd Infinite Scroller Refresh').to.equal(2);
+        // testing: `displayMode`
+        el.displayMode = 'list-compact';
+        el.searchContext = 'beta-search';
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.callCount, '3rd Infinite Scroller Refresh').to.equal(3);
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search');
+        expect(mockAnalyticsHandler.callAction).to.equal('displayMode');
+        expect(mockAnalyticsHandler.callLabel).to.equal('list-compact');
+        el.displayMode = 'list-detail';
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.callCount, '4th Infinite Scroller Refresh').to.equal(4);
+        expect(mockAnalyticsHandler.callCategory).to.equal('beta-search');
+        expect(mockAnalyticsHandler.callAction).to.equal('displayMode');
+        expect(mockAnalyticsHandler.callLabel).to.equal('list-detail');
+        // testing: `baseNavigationUrl`
+        el.baseNavigationUrl = 'https://funtestsite.com';
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.callCount, '5th Infinite Scroller Refresh').to.equal(5);
+        // testing: `baseImageUrl`
+        el.baseImageUrl = 'https://funtestsiteforimages.com';
+        await el.updateComplete;
+        expect(infiniteScrollerRefreshSpy.callCount, '6th Infinite Scroller Refresh').to.equal(6);
+    });
+    it('query the search service for single result', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'single-result';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        expect((_b = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#big-results-label')) === null || _b === void 0 ? void 0 : _b.textContent).to.contains('Result');
+    });
+    it('`searchContext` prop helps describe where component is being used', async () => {
+        const el = await fixture(html `<collection-browser></collection-browser>`);
+        expect(el.searchContext).to.equal(analyticsCategories.default);
+        el.searchContext = 'unicorn-search';
+        await el.updateComplete;
+        expect(el.searchContext).to.equal('unicorn-search');
+        // property is reflected as attribute
+        expect(el.getAttribute('searchcontext')).to.equal('unicorn-search');
+    });
+    it('respects the initial set of URL parameters for a general search', async () => {
+        var _a, _b, _c, _d, _e, _f;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.set('sin', 'TXT');
+        searchParams.set('sort', 'title');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        expect(el.baseQuery).to.equal('foo');
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+        expect(el.selectedSort).to.equal(SortField.title);
+        expect((_c = (_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.state).to.equal('hidden');
+        expect((_f = (_e = (_d = el.selectedFacets) === null || _d === void 0 ? void 0 : _d.subject) === null || _e === void 0 ? void 0 : _e.baz) === null || _f === void 0 ? void 0 : _f.state).to.equal('selected');
+        expect(el.selectedTitleFilter).to.equal('X');
+        expect(el.minSelectedDate).to.equal('2000');
+        expect(el.maxSelectedDate).to.equal('2010');
+    });
+    it('respects the initial set of URL parameters within a collection', async () => {
+        var _a, _b, _c, _d, _e, _f;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.set('sin', 'TXT');
+        searchParams.set('sort', 'title');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinCollection=${'foobar'}
+      >
+      </collection-browser>`);
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        expect(el.withinCollection).to.equal('foobar');
+        expect(el.baseQuery).to.equal('foo');
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+        expect(el.selectedSort).to.equal(SortField.title);
+        expect((_c = (_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.state).to.equal('hidden');
+        expect((_f = (_e = (_d = el.selectedFacets) === null || _d === void 0 ? void 0 : _d.subject) === null || _e === void 0 ? void 0 : _e.baz) === null || _f === void 0 ? void 0 : _f.state).to.equal('selected');
+        expect(el.selectedTitleFilter).to.equal('X');
+        expect(el.minSelectedDate).to.equal('2000');
+        expect(el.maxSelectedDate).to.equal('2010');
+    });
+    it('respects the initial set of URL parameters within a profile page', async () => {
+        var _a, _b, _c, _d, _e, _f;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinProfile=${'@foobar'}
+        .profileElement=${'uploads'}
+      >
+      </collection-browser>`);
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        expect(el.withinProfile).to.equal('@foobar');
+        expect(el.profileElement).to.equal('uploads');
+        expect(el.baseQuery).to.equal('foo');
+        expect(el.searchType).to.equal(SearchType.DEFAULT);
+        expect((_c = (_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.state).to.equal('hidden');
+        expect((_f = (_e = (_d = el.selectedFacets) === null || _d === void 0 ? void 0 : _d.subject) === null || _e === void 0 ? void 0 : _e.baz) === null || _f === void 0 ? void 0 : _f.state).to.equal('selected');
+        expect(el.selectedTitleFilter).to.equal('X');
+        expect(el.minSelectedDate).to.equal('2000');
+        expect(el.maxSelectedDate).to.equal('2010');
+    });
+    it('clears filters except sort when query changes for a general search', async () => {
+        var _a, _b, _c, _d;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.set('sin', 'TXT');
+        searchParams.set('sort', 'title');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        await el.initialSearchComplete;
+        await el.updateComplete;
+        el.baseQuery = 'bar';
+        await el.updateComplete;
+        expect(el.baseQuery).to.equal('bar');
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+        expect(el.selectedSort).to.equal(SortField.title);
+        expect((_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data).not.to.exist;
+        expect((_d = (_c = el.selectedFacets) === null || _c === void 0 ? void 0 : _c.subject) === null || _d === void 0 ? void 0 : _d.baz).not.to.exist;
+        expect(el.selectedTitleFilter).not.to.exist;
+        expect(el.minSelectedDate).not.to.exist;
+        expect(el.maxSelectedDate).not.to.exist;
+    });
+    it('clears filters except sort when query changes within a collection', async () => {
+        var _a, _b, _c, _d;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.set('sin', 'TXT');
+        searchParams.set('sort', 'title');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinCollection=${'foobar'}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'bar';
+        await el.updateComplete;
+        expect(el.withinCollection).to.equal('foobar');
+        expect(el.baseQuery).to.equal('bar');
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+        expect(el.selectedSort).to.equal(SortField.title);
+        expect((_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data).not.to.exist;
+        expect((_d = (_c = el.selectedFacets) === null || _c === void 0 ? void 0 : _c.subject) === null || _d === void 0 ? void 0 : _d.baz).not.to.exist;
+        expect(el.selectedTitleFilter).not.to.exist;
+        expect(el.minSelectedDate).not.to.exist;
+        expect(el.maxSelectedDate).not.to.exist;
+    });
+    it('clears filters *including* sort when target collection changes', async () => {
+        var _a, _b, _c, _d;
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.set('query', 'foo');
+        searchParams.set('sin', 'TXT');
+        searchParams.set('sort', 'title');
+        searchParams.append('not[]', 'mediatype:"data"');
+        searchParams.append('and[]', 'subject:"baz"');
+        searchParams.append('and[]', 'firstTitle:X');
+        searchParams.append('and[]', 'year:[2000 TO 2010]');
+        window.history.replaceState({}, '', url);
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinCollection=${'foobar'}
+      >
+      </collection-browser>`);
+        el.withinCollection = 'bar';
+        await el.updateComplete;
+        expect(el.withinCollection).to.equal('bar');
+        expect(el.baseQuery).to.equal('foo');
+        expect(el.searchType).to.equal(SearchType.FULLTEXT);
+        expect(el.selectedSort).to.equal(SortField.default);
+        expect((_b = (_a = el.selectedFacets) === null || _a === void 0 ? void 0 : _a.mediatype) === null || _b === void 0 ? void 0 : _b.data).not.to.exist;
+        expect((_d = (_c = el.selectedFacets) === null || _c === void 0 ? void 0 : _c.subject) === null || _d === void 0 ? void 0 : _d.baz).not.to.exist;
+        expect(el.selectedTitleFilter).not.to.exist;
+        expect(el.minSelectedDate).not.to.exist;
+        expect(el.maxSelectedDate).not.to.exist;
+    });
+    it('correctly retrieves web archive hits', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .withinProfile=${'@foo'}
+        .profileElement=${'web_archives'}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'web-archive';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        await nextTick();
+        console.log('\n\n*****\n\n*****\n\n', el.dataSource.getAllPages(), '\n\n*****\n\n*****\n\n');
+        expect(el.dataSource.totalResults, 'total results').to.equal(1);
+        expect((_a = el.dataSource.getTileModelAt(0)) === null || _a === void 0 ? void 0 : _a.title).to.equal('https://example.com');
+        expect((_c = (_b = el.dataSource.getTileModelAt(0)) === null || _b === void 0 ? void 0 : _b.captureDates) === null || _c === void 0 ? void 0 : _c.length, 'capture dates').to.equal(1);
+    });
+    it('shows dropdown accordion in facet sidebar when opt-in strategy is specified', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        facetLoadStrategy=${'opt-in'}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const facetsDropdown = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.desktop-facets-dropdown');
+        expect(facetsDropdown).to.exist;
+    });
+    it('shows temporarily unavailable message when facets suppressed', async () => {
+        var _a, _b;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        facetLoadStrategy=${'off'}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const facetsMsg = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.facets-message');
+        expect(facetsMsg).to.exist;
+        expect((_b = facetsMsg === null || facetsMsg === void 0 ? void 0 : facetsMsg.textContent) === null || _b === void 0 ? void 0 : _b.trim()).to.equal('Facets are temporarily unavailable.');
+    });
+    it('shows manage bar interface instead of sort bar when in manage view', async () => {
+        var _a, _b, _c, _d;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        expect((_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('manage-bar')).to.exist;
+        expect((_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('sort-filter-bar')).not.to.exist;
+        el.isManageView = false;
+        await el.updateComplete;
+        expect((_c = el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('manage-bar')).not.to.exist;
+        expect((_d = el.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector('sort-filter-bar')).to.exist;
+    });
+    it('switches to grid display mode when manage view activated', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseQuery=${'foo'}
+        .displayMode=${'list-detail'}
+      >
+      </collection-browser>`);
+        el.isManageView = true;
+        await el.updateComplete;
+        expect(el.displayMode).to.equal('grid');
+    });
+    it('can remove all checked tiles', async () => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        el.pageSize = 1; // To hit the edge case of a page break while offsetting tiles
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        const infiniteScroller = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('infinite-scroller');
+        expect(infiniteScroller).to.exist;
+        let tiles = (_b = infiniteScroller.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('tile-dispatcher');
+        expect(tiles).to.exist;
+        expect(tiles === null || tiles === void 0 ? void 0 : tiles.length).to.equal(2);
+        const firstTile = tiles[0];
+        const firstTileLink = (_c = firstTile.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('a[href]');
+        expect((_d = firstTile.model) === null || _d === void 0 ? void 0 : _d.identifier).to.equal('foo');
+        expect(firstTileLink).to.exist;
+        // No effect if no tiles checked
+        el.removeCheckedTiles();
+        await el.updateComplete;
+        tiles = (_e = infiniteScroller.shadowRoot) === null || _e === void 0 ? void 0 : _e.querySelectorAll('tile-dispatcher');
+        expect(tiles).to.exist;
+        expect(tiles === null || tiles === void 0 ? void 0 : tiles.length).to.equal(2);
+        // Check the first tile
+        firstTileLink.click();
+        expect((_f = firstTile.model) === null || _f === void 0 ? void 0 : _f.checked).to.be.true;
+        // Remove checked tiles and verify that we only kept the second tile
+        el.removeCheckedTiles();
+        await el.updateComplete;
+        expect((_g = el === null || el === void 0 ? void 0 : el.dataSource) === null || _g === void 0 ? void 0 : _g.size, 'data source count').to.equal(1);
+        tiles = (_j = (_h = el.shadowRoot) === null || _h === void 0 ? void 0 : _h.querySelector('infinite-scroller').shadowRoot) === null || _j === void 0 ? void 0 : _j.querySelectorAll('tile-dispatcher');
+        expect(tiles).to.exist;
+        expect(tiles.length, 'tile count after `el.removeCheckedTiles()`').to.equal(1);
+    });
+    it('can check/uncheck all tiles', async () => {
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        expect(el.dataSource.checkedTileModels.length).to.equal(0);
+        expect(el.dataSource.uncheckedTileModels.length).to.equal(2);
+        el.dataSource.checkAllTiles();
+        expect(el.dataSource.checkedTileModels.length).to.equal(2);
+        expect(el.dataSource.uncheckedTileModels.length).to.equal(0);
+        el.dataSource.uncheckAllTiles();
+        expect(el.dataSource.checkedTileModels.length).to.equal(0);
+        expect(el.dataSource.uncheckedTileModels.length).to.equal(2);
+    });
+    it('emits event when manage view state changes', async () => {
+        var _a, _b;
+        const spy = sinon.spy();
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+        @manageModeChanged=${spy}
+      ></collection-browser>`);
+        el.isManageView = true;
+        await el.updateComplete;
+        expect(spy.callCount).to.equal(1);
+        expect((_a = spy.args[0][0]) === null || _a === void 0 ? void 0 : _a.detail).to.be.true;
+        el.isManageView = false;
+        await el.updateComplete;
+        expect(spy.callCount).to.equal(2);
+        expect((_b = spy.args[1][0]) === null || _b === void 0 ? void 0 : _b.detail).to.be.false;
+    });
+    it('emits event when item removal requested', async () => {
+        var _a, _b, _c, _d, _e;
+        const spy = sinon.spy();
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+        @itemRemovalRequested=${spy}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        const infiniteScroller = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('infinite-scroller');
+        expect(infiniteScroller).to.exist;
+        const tiles = (_b = infiniteScroller.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('tile-dispatcher');
+        expect(tiles).to.exist.and.have.length(2);
+        const firstTile = tiles[0];
+        const firstTileLink = (_c = firstTile.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('a[href]');
+        expect((_d = firstTile.model) === null || _d === void 0 ? void 0 : _d.identifier).to.equal('foo');
+        expect(firstTileLink).to.exist;
+        // Check the first tile
+        firstTileLink.click();
+        await el.updateComplete;
+        const manageBar = (_e = el.shadowRoot) === null || _e === void 0 ? void 0 : _e.querySelector('manage-bar');
+        expect(manageBar).to.exist;
+        // Emit remove event from manage bar
+        manageBar.dispatchEvent(new CustomEvent('removeItems'));
+        await el.updateComplete;
+        expect(spy.callCount).to.equal(1);
+        expect(spy.args[0].length).to.equal(1);
+        expect(spy.args[0][0].detail.items[0]).to.equal('foo');
+    });
+    it('disables manage view when manage bar cancelled', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        .baseNavigationUrl=${''}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        const manageBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('manage-bar');
+        expect(manageBar).to.exist;
+        // Emit remove event from manage bar
+        manageBar.dispatchEvent(new CustomEvent('cancel'));
+        await el.updateComplete;
+        expect(el.isManageView).to.be.false;
+    });
+    it('enable/disable manage view delete button when you selectAll/unselectAll', async () => {
+        var _a, _b, _c, _d;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        el.baseQuery = 'foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        el.isManageView = true;
+        await el.updateComplete;
+        const manageBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('manage-bar');
+        expect(manageBar).to.exist;
+        // disable button exists
+        expect((_b = manageBar === null || manageBar === void 0 ? void 0 : manageBar.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.danger:disabled')).to.be
+            .exist;
+        // Emit remove event from manage bar
+        manageBar.dispatchEvent(new CustomEvent('selectAll'));
+        await el.updateComplete;
+        // disable button does not exists
+        expect((_c = manageBar === null || manageBar === void 0 ? void 0 : manageBar.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.danger:disabled')).to.be.not
+            .exist;
+        // Emit remove event from manage bar
+        manageBar.dispatchEvent(new CustomEvent('unselectAll'));
+        await el.updateComplete;
+        // disable button exists again
+        expect((_d = manageBar === null || manageBar === void 0 ? void 0 : manageBar.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector('.danger:disabled')).to.be
+            .exist;
+    });
+    it('shows Blurring checkbox for admin users', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .baseNavigationUrl=${''}
+        .searchService=${searchService}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'archive-org-user-loggedin';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const blurringCheck = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#tile-blur-check');
+        expect(blurringCheck).to.exist;
+        expect(blurringCheck.checked).to.be.true;
+    });
+    it('unchecks Blurring checkbox for admin users with blurring preference off', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .baseNavigationUrl=${''}
+        .searchService=${searchService}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'archive-org-user-loggedin-noblur';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const blurringCheck = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#tile-blur-check');
+        expect(blurringCheck).to.exist;
+        expect(blurringCheck.checked).to.be.false;
+    });
+    it('toggles blur state when Blurring checkbox is toggled', async () => {
+        var _a, _b, _c;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .baseNavigationUrl=${''}
+        .searchService=${searchService}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'archive-org-user-loggedin';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const blurringCheck = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#tile-blur-check');
+        expect(blurringCheck).to.exist;
+        blurringCheck.dispatchEvent(new PointerEvent('click'));
+        await el.updateComplete;
+        const infiniteScroller = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('infinite-scroller');
+        const firstTile = (_c = infiniteScroller === null || infiniteScroller === void 0 ? void 0 : infiniteScroller.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('tile-dispatcher');
+        expect(firstTile.suppressBlurring).to.be.true;
+    });
+    it('applies loans tab properties to sort bar', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .baseNavigationUrl=${''}
+        .searchService=${searchService}
+        .enableSortOptionsSlot=${true}
+      >
+      </collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await aTimeout(10);
+        const sortBar = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('sort-filter-bar');
+        expect(sortBar === null || sortBar === void 0 ? void 0 : sortBar.enableSortOptionsSlot, 'show loans in sort bar').to.be.true;
+        expect(el.enableSortOptionsSlot, 'collection browser is loans tab').to.be
+            .true;
+        const loansTabSlot = sortBar.querySelector('slot[name="sort-options"]');
+        expect(loansTabSlot).to.exist;
+    });
+    it('can suppress presence of result count', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        suppressResultCount
+      ></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        await el.initialSearchComplete;
+        const resultCount = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#results-total');
+        expect(resultCount).not.to.exist;
+    });
+    it('can suppress presence of result tiles', async () => {
+        var _a;
+        const searchService = new MockSearchService();
+        const el = await fixture(html `<collection-browser
+        .searchService=${searchService}
+        suppressResultTiles
+      ></collection-browser>`);
+        el.baseQuery = 'collection:foo';
+        await el.updateComplete;
+        const infiniteScroller = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('infinite-scroller');
+        expect(infiniteScroller).not.to.exist;
+    });
+    it('fetch larger result on search page for admin user to manage items', async () => {
+        const resultsSpy = sinon.spy();
+        const searchService = new MockSearchService({
+            asyncResponse: true,
+            resultsSpy,
+        });
+        const el = await fixture(html `<collection-browser .searchService=${searchService}>
+      </collection-browser>`);
+        const numberOfPages = 15;
+        el.baseQuery = 'jack';
+        el.isManageView = true;
+        await el.dataSource.fetchPage(1, numberOfPages);
+        await el.updateComplete;
+        const initialResults = el.dataSource.getAllPages();
+        expect(Object.keys(initialResults).length).to.deep.equal(numberOfPages);
+    });
+});
+//# sourceMappingURL=collection-browser.test.js.map