extract logger and wait on result to new class

tests/acceptance/blocks/pagination.js

@@ -17,7 +17,6 @@ class Pagination {
     await Page.scrollToBottom(); // We must scroll to the bottom of the page to be able to click the next results page button
     await VerticalResults.scrollToBottom();
     await t.click(this._nextResultsButton);
-    await VerticalResults.waitOnSearchComplete();
   }
 }
 

tests/acceptance/blocks/verticalresults.js

@@ -1,20 +1,17 @@
 import { Selector, RequestLogger, t } from 'testcafe';
-import { registerIE11NoCacheHook } from '../../test-utils/testcafe';
 
 /**
  * Models the user interaction with a {import('@yext/answers-search-ui').VerticalResultsComponent}.
  */
 class VerticalResults {
   constructor () {
     this._selector = Selector('.yxt-Results');
-    this._searchComplete = Selector('.yxt-Results--searchComplete');
     this._resultsWrapper = Selector('.Answers-resultsWrapper');
     this._focusedCard = Selector('.yxt-Card--pinFocused');
     this._getNthCard = index => Selector(`.yxt-Card[data-opts*="${index}"]`);
     this._noResults = Selector('.yxt-AlternativeVerticals-noResultsInfo');
     this._resultsCount = Selector('.yxt-VerticalResultsCount-total');
     this._resultsCountStart = Selector('.yxt-VerticalResultsCount-start');
-    this._searchQueryUrl = /v2\/accounts\/me\/answers\/vertical\/query/;
   }
 
   /**
@@ -69,44 +66,6 @@ class VerticalResults {
     return this._selector.exists;
   }
 
-  /**
-   * Wait for results to load on page by checking query response status and searchComplete state
-   * (timeout is set to 10 seconds)
-   */
-  async waitOnSearchComplete() {
-    const responseWaitTimeout = 10000;
-    const waitTimeInterval = 200;
-    let totalWaitTime = 0;
-    while (totalWaitTime < responseWaitTimeout && !this.isLoggerResultsPresent()) {
-      await t.wait(waitTimeInterval);
-      totalWaitTime += waitTimeInterval;
-    }
-    await t.expect(this._searchComplete.exists).ok();
-    this._queryRequestLogger.clear();
-  }
-
-  /**
-   * Returns true if there exists a query response from logger with status code 200
-   * @returns {boolean}
-   */
-  async isLoggerResultsPresent() {
-    return await this._queryRequestLogger.contains(r => r.response.statusCode === 200);
-  }
-
-  /**
-   * Register a RequestLogger that tracks vertical query requests to given test.
-   * If browser is IE11, register an Ie11NoCacheHook.
-   * 
-   * @param {import('testcafe').TestController} testInstance
-   */
-  async registerLogger(testInstance) {
-    this._queryRequestLogger = RequestLogger({
-      url: this._searchQueryUrl
-    });
-    await testInstance.addRequestHooks(this._queryRequestLogger);
-    await registerIE11NoCacheHook(testInstance, this._searchQueryUrl);
-  }
-
   /**
    * Gets the number of pixels that the element's content is scrolled upward
    * @returns {Promise<number>}

tests/acceptance/constants.js

@@ -1 +1,3 @@
-module.exports.PORT=9999;
+module.exports.PORT=9999;
+module.exports.VERTICAL_SEARCH_QUERY_URL=/v2\/accounts\/me\/answers\/vertical\/query/;
+module.exports.UNIVERSAL_SEARCH_QUERY_URL=/v2\/accounts\/me\/answers\/query/;

tests/acceptance/searchrequestlogger.js

@@ -0,0 +1,66 @@
+import { VERTICAL_SEARCH_QUERY_URL, UNIVERSAL_SEARCH_QUERY_URL } from './constants';
+import { Selector, RequestLogger, t } from 'testcafe';
+import { registerIE11NoCacheHook } from '../test-utils/testcafe';
+
+/**
+ * Handles request logger registration and request/response data received during test execution.
+ */
+class SearchRequestLogger {
+  constructor () {
+    this._searchComplete = Selector('.yxt-Results--searchComplete');
+  }
+
+  /**
+   * Register a RequestLogger that tracks vertical query requests to given test.
+   * If browser is IE11, register an Ie11NoCacheHook.
+   * 
+   * @param {import('testcafe').TestController} testInstance
+   */
+  async registerVerticalSearchLogger(testInstance) {
+    this._queryRequestLogger = RequestLogger({
+      url: VERTICAL_SEARCH_QUERY_URL
+    });
+    await testInstance.addRequestHooks(this._queryRequestLogger);
+    await registerIE11NoCacheHook(testInstance, VERTICAL_SEARCH_QUERY_URL);
+  }
+
+  /**
+   * Register a RequestLogger that tracks universal query requests to given test.
+   * If browser is IE11, register an Ie11NoCacheHook.
+   * 
+   * @param {import('testcafe').TestController} testInstance
+   */
+  async registerUniversalSearchLogger() {
+    this._queryRequestLogger = RequestLogger({
+      url: UNIVERSAL_SEARCH_QUERY_URL
+    });
+    await testInstance.addRequestHooks(this._queryRequestLogger);
+    await registerIE11NoCacheHook(testInstance, UNIVERSAL_SEARCH_QUERY_URL);
+  }
+
+  /**
+   * Wait for results to load on page by checking query response status and searchComplete state
+   * (timeout is set to 10 seconds)
+   */
+  async waitOnSearchComplete() {
+    const responseWaitTimeout = 10000;
+    const waitTimeInterval = 200;
+    let totalWaitTime = 0;
+    while (totalWaitTime < responseWaitTimeout && !this.isLoggerResultsPresent()) {
+      await t.wait(waitTimeInterval);
+      totalWaitTime += waitTimeInterval;
+    }
+    await t.expect(this._searchComplete.exists).ok();
+    this._queryRequestLogger.clear();
+  }
+
+  /**
+   * Returns true if there exists a query response from logger with status code 200
+   * @returns {boolean}
+   */
+  async isLoggerResultsPresent() {
+    return await this._queryRequestLogger.contains(r => r.response.statusCode === 200);
+  }
+}
+
+export default new SearchRequestLogger();

tests/acceptance/suites/vertical-full-page-map-with-filters.js

@@ -3,16 +3,17 @@ import SearchBar from '../blocks/searchbar';
 import VerticalResults from '../blocks/verticalresults';
 import ThemeMap from '../blocks/thememap';
 import CollapsibleFilters from '../blocks/collapsiblefilters';
+import SearchRequestLogger from '../searchrequestlogger';
 
 fixture`Vertical Full Page Map with Filters and Clusters`
   .page(`http://localhost:${PORT}/locations_full_page_map_with_filters`)
   .beforeEach(async t => {
-    await VerticalResults.registerLogger(t);
+    await SearchRequestLogger.registerVerticalSearchLogger(t);
   });
 
 test('Clicking on a pin closes the filter view', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   await CollapsibleFilters.viewFilters();
   await ThemeMap.selectPin();
   const isFilterViewOpen = await CollapsibleFilters.isFilterViewOpen();
@@ -21,7 +22,7 @@ test('Clicking on a pin closes the filter view', async t => {
 
 test('Clicking on a cluster causes the map to zoom in', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const zoom = await ThemeMap.getZoom();
   await ThemeMap.selectPinCluster();
   const zoomAfterSelectingCluster = await ThemeMap.getZoom();
@@ -30,7 +31,7 @@ test('Clicking on a cluster causes the map to zoom in', async t => {
 
 test('Clicking on a cluster causes a new search to be ran', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const numResults = await VerticalResults.getNumResults();
   await ThemeMap.selectPinCluster();
   const numResultsAfterSelectingCluster = await VerticalResults.getNumResults();

tests/acceptance/suites/vertical-full-page-map.js

@@ -3,23 +3,24 @@ import SearchBar from '../blocks/searchbar';
 import VerticalResults from '../blocks/verticalresults';
 import ThemeMap from '../blocks/thememap';
 import Pagination from '../blocks/pagination';
+import SearchRequestLogger from '../searchrequestlogger';
 
 fixture`Vertical Full Page Map`
   .page(`http://localhost:${PORT}/locations_full_page_map`)
   .beforeEach(async t => {
-    await VerticalResults.registerLogger(t);
+    await SearchRequestLogger.registerVerticalSearchLogger(t);
   });
 
 test('Can search and get results', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const isResultsPresent = await VerticalResults.isResultsPresent();
   await t.expect(isResultsPresent).ok();
 });
 
 test('Clicking on a pin focuses on a results card', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   let isCardFocused = await VerticalResults.isCardFocused();
   await t.expect(isCardFocused).notOk();
   await ThemeMap.selectPin();
@@ -29,46 +30,48 @@ test('Clicking on a pin focuses on a results card', async t => {
 
 test('Search when map moves works', async t => {
   await SearchBar.submitQuery('virginia');
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const resultsCountBeforeDrag = await VerticalResults.getNumResults();
   await ThemeMap.dragLeft();
   await ThemeMap.dragLeft();
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const resultsCountAfterDrag = await VerticalResults.getNumResults();
   await t.expect(resultsCountBeforeDrag !== resultsCountAfterDrag).ok();
 });
 
 test('Search this area button works', async t => {
   await SearchBar.submitQuery('virginia');
   await ThemeMap.toggleSearchThisArea();
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const resultsCountBeforeDrag = await VerticalResults.getNumResults();
   await ThemeMap.dragLeft();
   await ThemeMap.clickSearchThisAreaButton();
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const resultsCountAfterDrag = await VerticalResults.getNumResults();
   await t.expect(resultsCountBeforeDrag !== resultsCountAfterDrag).ok();
 });
 
 test('Default initial search works and is enabled by default', async t => {
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   const resultsCount = await VerticalResults.getNumResults();
   await t.expect(resultsCount).ok();
 });
 
 test('Pagination works', async t => {
   const initialResultsOffset = await VerticalResults.getResultsOffset();
   await Pagination.nextResults();
+  await SearchRequestLogger.waitOnSearchComplete();
   const updatedResultsOffset = await VerticalResults.getResultsOffset();
   await t.expect(initialResultsOffset).notEql(updatedResultsOffset);
 });
 
 test('Pagination scrolls the results to the top', async t => {
-  await VerticalResults.waitOnSearchComplete();
+  await SearchRequestLogger.waitOnSearchComplete();
   await VerticalResults.scrollToBottom();
   const scrollTop = await VerticalResults.getScrollTop();
   await t.expect(scrollTop).notEql(0);
   await Pagination.nextResults();
+  await SearchRequestLogger.waitOnSearchComplete();
   const scrollTopAfterPagination = await VerticalResults.getScrollTop();
   await t.expect(scrollTopAfterPagination).eql(0);
 });