Skip to content

Commit

Permalink
update docs and snapshots
Browse files Browse the repository at this point in the history
  • Loading branch information
Yen Truong committed Jun 11, 2021
1 parent f1bd2d9 commit 9a9a1d0
Show file tree
Hide file tree
Showing 4 changed files with 96 additions and 40 deletions.
24 changes: 19 additions & 5 deletions tests/percy/iframepagenavigator.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,28 +17,42 @@ class IframePageNavigator extends PageNavigator {
this._siteUrl = siteUrl;
this._iframePage = iframePage;
this._defaultLocale = defaultLocale;
this._localeUrlPath = '&verticalUrl=';

/**
* Locale param for the site's url on universal page
*
* @type {string}
*/
this._localeUniversalUrlPath = '';

/**
* Locale param for the site's url on vertical page
*
* @type {string}
*/
this._localeVerticalUrlPath = '&verticalUrl=';
}

/**
* Set locale param for the site's url
* Sets locale param for the site's url based on given locale
*
* @param {string} locale
*/
setCurrentLocale(locale) {
this._localeUrlPath = locale === this._defaultLocale? '&verticalUrl=' : '&verticalUrl=' + locale + "/";
this._localeUniversalUrlPath = locale === this._defaultLocale? '' : '&verticalUrl=' + locale;
this._localeVerticalUrlPath = locale === this._defaultLocale? '&verticalUrl=' : '&verticalUrl=' + locale + "/";
}

async gotoUniversalPage(queryParams = {}) {
const queryParamsString = getQueryParamsString(queryParams);
const url = `${this._siteUrl}/${this._iframePage}.html?${queryParamsString}${this._localeUrlPath}`;
const url = `${this._siteUrl}/${this._iframePage}.html?${queryParamsString}${this._localeUniversalUrlPath}`;
await this._page.goto(url);
await waitTillHTMLRendered(this._page);
}

async gotoVerticalPage(vertical, queryParams = {}) {
const queryParamsString = getQueryParamsString(queryParams);
const url = `${this._siteUrl}/${this._iframePage}.html?${this._localeUrlPath}${vertical}.html&${queryParamsString}`;
const url = `${this._siteUrl}/${this._iframePage}.html?${this._localeVerticalUrlPath}${vertical}.html&${queryParamsString}`;
await this._page.goto(url);
await waitTillHTMLRendered(this._page);
}
Expand Down
98 changes: 67 additions & 31 deletions tests/percy/multilangphotographer.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,125 +10,161 @@ class MultilangPhotographer {
/**
* @param {PageNavigator} pageNavigator
* @param {Camera} camera
* @param {locale} locate locate set for the site when taking snapshot
*/
constructor(pageNavigator, camera, locale) {
this._pageNavigator = pageNavigator;
this._camera = camera;
this._locale = locale;

/**
* Custom queries for specific locale
*
* @type {Object<string, string>}
*/
this._queries = {};

/**
* Locale tag to add to snapshot name
*
* @type {string}
*/
this.localeSnapshotTag = '';

this.setLocale(locale);
}

async captureSnapshots() {
/**
* Sets locale for the page navigation and snapshot tag
*
* @param {string} locale locale of the site
*/
setLocale(locale) {
this._locale = locale;
this.localeSnapshotTag = this._locale === 'en'? '' : this._locale + '--';
this._setLocaleQueries();
}

/**
* Sets custom queries based on locale
*/
_setLocaleQueries() {
switch (this._locale) {
case 'es':
this._queries = {
this._queries = {
faq: '¿Qué pasa si olvidé mi contraseña?',
job: 'trabajo',
menu_item: 'rollo'
}
break;
default:
this._queries = {
faq: 'what if i forgot my password?',
job: 'job',
menu_item: 'roll'
}
}
}

async captureSnapshots() {
await this._captureUniversalSearch();
await this._captureVerticalSearch();
await this._captureVerticalGridSearch();
await this._captureVerticalMapSearch();
await this._captureVerticalFullPageMapSearch();
await this._captureDirectAnswers();
}

async _captureUniversalSearch () {
await this._pageNavigator.gotoUniversalPage();
await this._camera.snapshot(this._locale + '--universal-search');
await this._camera.snapshot(this.localeSnapshotTag + 'universal-search');

await this._pageNavigator.gotoUniversalPage({ query: 'a' });
await this._camera.snapshot(this._locale + '--universal-search--no-results');
await this._camera.snapshot(this.localeSnapshotTag + 'universal-search--no-results');

await this._pageNavigator.gotoUniversalPage({ query: this._queries.faq });
await this._pageNavigator.click('.HitchhikerFaqAccordion-toggle')
await this._camera.snapshot(this.localeSnapshotTag + 'universal-search--faq-accordion');

await this._pageNavigator.gotoUniversalPage({ query: 'yext answers'});
await this._camera.snapshot(this._locale + '--universal-search--product-prominentimage');
await this._camera.snapshot(this.localeSnapshotTag + 'universal-search--product-prominentimage');
}

async _captureVerticalSearch () {
await this._pageNavigator.gotoVerticalPage('events');
await this._camera.snapshot(this._locale + '--vertical-search');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search');

await this._pageNavigator.gotoVerticalPage('events', { query: 'a' });
await this._camera.snapshot(this._locale + '--vertical-search--no-results');

await this._pageNavigator.gotoUniversalPage('faqs', { query: this._queries.faq});
await this._camera.snapshot(this._locale + '--universal-search--faq-accordion');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search--no-results');

await this._pageNavigator.gotoVerticalPage('financial_professionals', { query: 'connor' });
await this._camera.snapshot(this._locale + '--vertical-search--financial-professional-location');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search--financial-professional-location');

await this._pageNavigator.gotoVerticalPage('jobs', { query: this._queries.job });
await this._camera.snapshot(this._locale + '--vertical-search--job-standard');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search--job-standard');

await this._pageNavigator.gotoVerticalPage('help_articles', { query: 'slap chop' });
await this._camera.snapshot(this._locale + '--vertical-search--document-standard');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search--document-standard');

await this._pageNavigator.gotoVerticalPage('menu_items', { query: this._queries.menu_item });
await this._camera.snapshot(this._locale + '--vertical-search--menuitem-standard');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-search--menuitem-standard');
}

async _captureVerticalGridSearch () {
await this._pageNavigator.gotoVerticalPage('people', { query: 'a' });
await this._camera.snapshot(this._locale + '--vertical-grid-search');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-grid-search');

await this._pageNavigator.gotoVerticalPage('people', { query: 'vrginia' });
await this._camera.snapshot(this._locale + '--vertical-grid-search--spellcheck');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-grid-search--spellcheck');

await this._pageNavigator.gotoVerticalPage('products', { query: 'yext answers' });
await this._camera.snapshot('vertical-grid-search--product-prominentvideo');
// await this._pageNavigator.gotoVerticalPage('products', { query: 'yext answers' });
// await this._camera.snapshot('vertical-grid-search--product-prominentvideo');

await this._pageNavigator.gotoVerticalPage('products_clickable_image', { query: 'yext answers' });
await this._camera.snapshot(this._locale + '--vertical-grid-search--product-prominentimage-clickable');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-grid-search--product-prominentimage-clickable');
}

async _captureVerticalMapSearch () {
await this._pageNavigator.gotoVerticalPage('locations', { query: 'a' });
await this._camera.snapshot(this._locale + '--vertical-map-search');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-map-search');

await this._pageNavigator.gotoVerticalPage('locations_google', { query: 'virginia' });
await this._camera.snapshot(this._locale + '--vertical-map-search--google');
await this._camera.snapshot(this.localeSnapshotTag + 'vertical-map-search--google');
}

async _captureVerticalFullPageMapSearch () {
await this._pageNavigator
.gotoVerticalPage('locations_full_page_map', { query: '' });
await this._camera.snapshotDesktopOnly(this._locale + '--vertical-full-page-map__desktop-view');
await this._camera.snapshotMobileOnly(this._locale + '--vertical-full-page-map__mobile-list-view');
await this._camera.snapshotDesktopOnly(this.localeSnapshotTag + 'vertical-full-page-map__desktop-view');
await this._camera.snapshotMobileOnly(this.localeSnapshotTag + 'vertical-full-page-map__mobile-list-view');

await this._pageNavigator.click('.Answers-mobileToggle');
await this._camera.snapshotMobileOnly(this._locale + '--vertical-full-page-map__mobile-map-view');
await this._camera.snapshotMobileOnly(this.localeSnapshotTag + 'vertical-full-page-map__mobile-map-view');

const mapboxPinSelector = '.js-answersMap button';
await this._pageNavigator.click(mapboxPinSelector);
await this._camera.snapshotMobileOnly(this._locale + '--vertical-full-page-map__mobile-detail-view');
await this._camera.snapshotMobileOnly(this.localeSnapshotTag + 'vertical-full-page-map__mobile-detail-view');

await this._pageNavigator
.gotoVerticalPage('locations_full_page_map', { query: 'office sparce'});
await this._camera.snapshotDesktopOnly(this._locale + '--vertical-full-page-map--spellcheck__desktop-view');
await this._camera.snapshotMobileOnly(this._locale + '--vertical-full-page-map--spellcheck__mobile-list-view');
await this._camera.snapshotDesktopOnly(this.localeSnapshotTag + 'vertical-full-page-map--spellcheck__desktop-view');
await this._camera.snapshotMobileOnly(this.localeSnapshotTag + 'vertical-full-page-map--spellcheck__mobile-list-view');

await this._pageNavigator
.gotoVerticalPage('locations_full_page_map', { query: 'virginia' });
await this._camera.snapshotDesktopOnly(this._locale + '--vertical-full-page-map--nlp-filters__desktop-view');
await this._camera.snapshotDesktopOnly(this.localeSnapshotTag + 'vertical-full-page-map--nlp-filters__desktop-view');

await this._pageNavigator
.gotoVerticalPage('locations_full_page_map_with_filters', { query: 'virginia' });
await this._camera.snapshotDesktopOnly(this._locale + '--vertical-full-page-map-with-filters--nlp-filters__desktop-view');
await this._camera.snapshotDesktopOnly(this.localeSnapshotTag + 'vertical-full-page-map-with-filters--nlp-filters__desktop-view');
}

async _captureDirectAnswers () {
await this._pageNavigator.gotoUniversalPage({ query: 'bryan reed phone number' });
await this._camera.snapshot(this._locale + '--field-direct-answer');
await this._camera.snapshot(this.localeSnapshotTag + 'field-direct-answer');

await this._pageNavigator.gotoUniversalPage({ query: 'where was joe exotic born?' });
await this._camera.snapshot(this._locale + '--documentsearch-direct-answer')
await this._camera.snapshot(this.localeSnapshotTag + 'documentsearch-direct-answer')
}
}

Expand Down
6 changes: 3 additions & 3 deletions tests/percy/photographer.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ class Photographer {
await this._pageNavigator.gotoUniversalPage({ query: 'what if i forget my password?'});
await this._pageNavigator.click('.HitchhikerFaqAccordion-toggle')
await this._camera.snapshot('universal-search--faq-accordion');

await this._pageNavigator.gotoUniversalPage({ query: 'yext answers'});
await this._camera.snapshot('universal-search--product-prominentimage');
}
Expand Down Expand Up @@ -73,8 +73,8 @@ class Photographer {
await this._pageNavigator.gotoVerticalPage('people', { query: 'vrginia' });
await this._camera.snapshot('vertical-grid-search--spellcheck');

await this._pageNavigator.gotoVerticalPage('products', { query: 'yext answers' });
await this._camera.snapshot('vertical-grid-search--product-prominentvideo');
// await this._pageNavigator.gotoVerticalPage('products', { query: 'yext answers' });
// await this._camera.snapshot('vertical-grid-search--product-prominentvideo');

await this._pageNavigator.gotoVerticalPage('products_clickable_image', { query: 'yext answers' });
await this._camera.snapshot('vertical-grid-search--product-prominentimage-clickable');
Expand Down
8 changes: 7 additions & 1 deletion tests/percy/standardpagenavigator.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,17 @@ class StandardPageNavigator extends PageNavigator {
this._page = page;
this._siteUrl = siteUrl;
this._defaultLocale = defaultLocale;

/**
* Locale param for the site's url during page navigation
*
* @type {string}
*/
this._localeUrlPath = '';
}

/**
* Set locale param for the site's url
* Sets locale param for the site's url based on given locale
*
* @param {string} locale
*/
Expand Down

0 comments on commit 9a9a1d0

Please sign in to comment.