Merge 4320780 into ba45252

.github/run_browserstack_acceptance.sh

@@ -6,4 +6,4 @@ export BROWSERSTACK_BUILD_ID="${GITHUB_BRANCH} - ${GITHUB_RUN_ID}"
 COMMIT_MSG_TITLE=$(git log -n 1 --pretty=format:%s)
 export BROWSERSTACK_TEST_RUN_NAME=$COMMIT_MSG_TITLE
 
-npm run acceptance -- --browsers browserstack:ie@11.0 browserstack:safari
+npm run acceptance -- --browsers browserstack:ie@11.0 browserstack:safari browserstack:firefox

.github/workflows/acceptance.yml

@@ -1,4 +1,4 @@
-name: BrowserStack Acceptance Tests
+name: Acceptance Tests
 
 on: push
 
@@ -31,4 +31,4 @@ jobs:
       - run: npm run setup-test-site
       - run: npm run build-test-site
       - name: Run Acceptance Tests
-        run: npm run acceptance -- --browsers chrome:headless firefox:headless
+        run: npm run acceptance -- --browsers chrome:headless

.github/workflows/coverage.yml

@@ -0,0 +1,30 @@
+# This workflow will run our tests, generate an lcov code coverage file,
+# and send that coverage to Coveralls 
+
+name: Code Coverage
+
+on:
+  push:
+    branches-ignore: dev/*
+  pull_request:
+
+jobs:
+  Coveralls:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [15.x]
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm ci
+    - run: npx jest tests/static/ --coverage
+    - name: Coveralls
+      uses: coverallsapp/github-action@master
+      with:
+        github-token: ${{ secrets.GITHUB_TOKEN }}

README.md

@@ -1,5 +1,11 @@
 # Answers Hitchhiker Theme
 
+<div>
+  <a href='https://coveralls.io/github/yext/answers-hitchhiker-theme?branch=master'>
+    <img src='https://coveralls.io/repos/github/yext/answers-hitchhiker-theme/badge.svg?branch=master' alt='Coverage Status' />
+  </a>
+</div>
+
 A [Jambo](https://github.com/yext/jambo) theme for building Answers experiences.
 
 Additonal resources for integrating Answers can be found at https://hitchhikers.yext.com/.

cards/event-standard/component.js

@@ -12,10 +12,12 @@ class event_standardCardComponent extends BaseCard['event-standard'] {
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.name, // The header text of the card
       url: profile.website, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       titleEventOptions: this.addDefaultEventOptions(),
       date: Formatter.bigDate(profile),
       subtitle: Formatter.dateRange(profile),
@@ -32,7 +34,7 @@ class event_standardCardComponent extends BaseCard['event-standard'] {
         label: 'RSVP', // The CTA's label
         iconName: 'calendar', // The icon to use for the CTA
         url: profile.ticketUrl || profile.website, // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened
+        target: linkTarget, // Where the new URL will be opened
         eventType: 'RSVP', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA
@@ -42,7 +44,7 @@ class event_standardCardComponent extends BaseCard['event-standard'] {
         label: 'Directions',
         iconName: 'directions',
         url: Formatter.getDirectionsUrl(profile),
-        target: '_top',
+        target: linkTarget,
         eventType: 'DRIVING_DIRECTIONS',
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '',

cards/faq-accordion/component.js

@@ -12,10 +12,12 @@ class faq_accordionCardComponent extends BaseCard['faq-accordion'] {
    * @param {Object} profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.question || profile.name, // The header text of the card
       // subtitle: '', // The sub-header text of the card
-      details: profile.answer ? ANSWERS.formatRichText(profile.answer, "answer", "_top") : null, // The text in the body of the card
+      details: profile.answer ? ANSWERS.formatRichText(profile.answer, "answer", linkTarget) : null, // The text in the body of the card
       // If the card's details are longer than a certain character count, you can truncate the
       // text. A toggle will be supplied that can show or hide the truncated text.
       // showMoreDetails: {
@@ -29,7 +31,7 @@ class faq_accordionCardComponent extends BaseCard['faq-accordion'] {
         label: profile.c_primaryCTA ? profile.c_primaryCTA.label : null, // The CTA's label
         // iconName: '', // The icon to use for the CTA
         url: Formatter.generateCTAFieldTypeLink(profile.c_primaryCTA), // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened. To open in a new tab use '_blank'
+        target: linkTarget, // Where the new URL will be opened. To open in a new tab use '_blank'
         eventType: 'CTA_CLICK', // Type of Analytics event fired when clicking the CTA
         // Event options for the analytics event fired when this CTA is clicked.
         eventOptions: this.addDefaultEventOptions({ /* Add additional options here */ }),
@@ -40,7 +42,7 @@ class faq_accordionCardComponent extends BaseCard['faq-accordion'] {
         label: profile.c_secondaryCTA ? profile.c_secondaryCTA.label : null,
         // iconName: '',
         url: Formatter.generateCTAFieldTypeLink(profile.c_secondaryCTA),
-        target: '_top',
+        target: linkTarget,
         eventType: 'CTA_CLICK',
         eventOptions: this.addDefaultEventOptions({ /* Add additional options here */ }),
         // ariaLabel: '',

cards/financial-professional-location/component.js

@@ -18,12 +18,14 @@ class financial_professional_locationCardComponent extends BaseCard['financial-p
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       showOrdinal: true, // Show the map pin number on the card. Only supported for universal search
       title: profile.name, // The header text of the card
       // subtitle: '', // The sub-header text of the card
       url: profile.website || profile.landingPageUrl, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       titleEventOptions: this.addDefaultEventOptions(),
       address: Formatter.address(profile), // The address for the card
       details: profile.description, // The text in the body of the card
@@ -48,7 +50,7 @@ class financial_professional_locationCardComponent extends BaseCard['financial-p
         label: profile.c_primaryCTA ? profile.c_primaryCTA.label : null, // The CTA's label
         iconName: 'chevron', // The icon to use for the CTA
         url: Formatter.generateCTAFieldTypeLink(profile.c_primaryCTA), // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened
+        target: linkTarget, // Where the new URL will be opened
         eventType: 'CTA_CLICK', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA
@@ -58,7 +60,7 @@ class financial_professional_locationCardComponent extends BaseCard['financial-p
         label: profile.c_secondaryCTA ? profile.c_secondaryCTA.label : null,
         iconName: 'chevron',
         url: Formatter.generateCTAFieldTypeLink(profile.c_secondaryCTA),
-        target: '_top',
+        target: linkTarget,
         eventType: 'CTA_CLICK',
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: ''

cards/financial-professional-location/template.hbs

@@ -145,7 +145,7 @@
     href="tel:{{card.phone}}"
     data-eventtype="TAP_TO_CALL"
     data-eventoptions='{{json card.phoneEventOptions}}'
-    target="_top">
+    target={{#if card.target}}"{{card.target}}"{{else}}"_top"{{/if}}>
     {{card.phone}}
   </a>
 </div>

cards/job-standard/component.js

@@ -12,10 +12,12 @@ class job_standardCardComponent extends BaseCard['job-standard'] {
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.name, // The header text of the card
       url: profile.landingPageUrl, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       // image: '', // The URL of the image to display on the card
       // tagLabel: '', // The label of the displayed image
       titleEventOptions: this.addDefaultEventOptions(),
@@ -33,7 +35,7 @@ class job_standardCardComponent extends BaseCard['job-standard'] {
         label: 'Apply Now', // The CTA's label
         iconName: 'briefcase', // The icon to use for the CTA
         url: profile.applicationUrl || profile.landingPageUrl, // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened
+        target: linkTarget, // Where the new URL will be opened
         eventType: 'CTA_CLICK', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA

cards/link-standard/component.js

@@ -12,10 +12,12 @@ class link_standardCardComponent extends BaseCard['link-standard'] {
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.htmlTitle, // The header text of the card
       url: profile.link, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       titleEventOptions: this.addDefaultEventOptions(),
       // subtitle: '', // The sub-header text of the card
       // If the card's details are longer than a certain character count, you can truncate the

cards/location-standard/component.js

@@ -18,10 +18,12 @@ class location_standardCardComponent extends BaseCard['location-standard'] {
    * @param {Object} profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.name, // The header text of the card
       url: profile.website || profile.landingPageUrl, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       titleEventOptions: this.addDefaultEventOptions(), // The event options for title click analytics
       // subtitle: '', // The sub-header text of the card
       hours: Formatter.openStatus(profile),
@@ -38,7 +40,7 @@ class location_standardCardComponent extends BaseCard['location-standard'] {
         label: 'Call', // The label of the CTA
         iconName: 'phone', // The icon to use for the CTA
         url: Formatter.phoneLink(profile), // The URL a user will be directed to when clicking
-        target: '_top', // If the URL will be opened in a new tab, etc.
+        target: linkTarget, // If the URL will be opened in a new tab, etc.
         eventType: 'TAP_TO_CALL', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(), // The analytics event options for CTA clicks
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA
@@ -47,7 +49,7 @@ class location_standardCardComponent extends BaseCard['location-standard'] {
         label: 'Get Directions',
         iconName: 'directions',
         url: Formatter.getDirectionsUrl(profile),
-        target: '_top',
+        target: linkTarget,
         eventType: 'DRIVING_DIRECTIONS',
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '',

cards/location-standard/template.hbs

@@ -47,7 +47,7 @@
   <a class="HitchhikerLocationStandard-phone--mobile js-Hitchhiker-phone" href="tel:{{card.phone}}"
     data-eventtype="TAP_TO_CALL"
     data-eventoptions='{{json card.phoneEventOptions}}'
-    target="_top">
+    target={{#if card.target}}"{{card.target}}"{{else}}"_top"{{/if}}>
     {{card.phone}}
   </a>
 </div>

cards/menuitem-standard/component.js

@@ -12,10 +12,12 @@ class menuitem_standardCardComponent extends BaseCard['menuitem-standard'] {
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.name, // The header text of the card
       url: profile.landingPageUrl, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       image: Formatter.image(profile.c_photo).url, // The URL of the image to display on the card
       altText: Formatter.image(profile.c_photo).alternateText,  // The alternate text for the image
       // tagLabel: '', // The label of the displayed image
@@ -37,8 +39,8 @@ class menuitem_standardCardComponent extends BaseCard['menuitem-standard'] {
       CTA1: {
         label: 'Order Now', // The CTA's label
         iconName: 'chevron', // The icon to use for the CTA
-        url: profile.orderUrl, // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened
+        url: profile.orderUrl && profile.orderUrl.url, // The URL a user will be directed to when clicking
+        target: linkTarget, // Where the new URL will be opened
         eventType: 'CTA_CLICK', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA
@@ -48,7 +50,7 @@ class menuitem_standardCardComponent extends BaseCard['menuitem-standard'] {
         label: 'View Menu',
         iconName: 'magnifying_glass',
         url: profile.landingPageUrl,
-        target: '_top',
+        target: linkTarget,
         eventType: 'CTA_CLICK',
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '',

cards/multilang-event-standard/component.js

@@ -12,10 +12,12 @@ class multilang_event_standardCardComponent extends BaseCard['multilang-event-st
    * @param profile profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.name, // The header text of the card
       url: profile.website, // If the card title is a clickable link, set URL here
-      target: '_top', // If the title's URL should open in a new tab, etc.
+      target: linkTarget, // If the title's URL should open in a new tab, etc.
       titleEventOptions: this.addDefaultEventOptions(),
       date: Formatter.bigDate(profile),
       subtitle: Formatter.dateRange(profile),
@@ -32,7 +34,7 @@ class multilang_event_standardCardComponent extends BaseCard['multilang-event-st
         label: {{ translateJS phrase='RSVP' context='RSVP is a verb' }}, // The CTA's label
         iconName: 'calendar', // The icon to use for the CTA
         url: profile.ticketUrl || profile.website, // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened
+        target: linkTarget, // Where the new URL will be opened
         eventType: 'RSVP', // Type of Analytics event fired when clicking the CTA
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '', // Accessible text providing a descriptive label for the CTA
@@ -42,7 +44,7 @@ class multilang_event_standardCardComponent extends BaseCard['multilang-event-st
         label: {{ translateJS phrase='Directions' }},
         iconName: 'directions',
         url: Formatter.getDirectionsUrl(profile),
-        target: '_top',
+        target: linkTarget,
         eventType: 'DRIVING_DIRECTIONS',
         eventOptions: this.addDefaultEventOptions(),
         // ariaLabel: '',

cards/multilang-faq-accordion/component.js

@@ -12,10 +12,12 @@ class multilang_faq_accordionCardComponent extends BaseCard['multilang-faq-accor
    * @param {Object} profile of the entity in the card
    */
   dataForRender(profile) {
+    const linkTarget = AnswersExperience.runtimeConfig.get('linkTarget') || '_top';
+
     return {
       title: profile.question || profile.name, // The header text of the card
       // subtitle: '', // The sub-header text of the card
-      details: profile.answer ? ANSWERS.formatRichText(profile.answer, "answer", "_top") : null, // The text in the body of the card
+      details: profile.answer ? ANSWERS.formatRichText(profile.answer, "answer", linkTarget) : null, // The text in the body of the card
       // If the card's details are longer than a certain character count, you can truncate the
       // text. A toggle will be supplied that can show or hide the truncated text.
       // showMoreDetails: {
@@ -29,7 +31,7 @@ class multilang_faq_accordionCardComponent extends BaseCard['multilang-faq-accor
         label: profile.c_primaryCTA ? profile.c_primaryCTA.label : null, // The CTA's label
         // iconName: '', // The icon to use for the CTA
         url: Formatter.generateCTAFieldTypeLink(profile.c_primaryCTA), // The URL a user will be directed to when clicking
-        target: '_top', // Where the new URL will be opened. To open in a new tab use '_blank'
+        target: linkTarget, // Where the new URL will be opened. To open in a new tab use '_blank'
         eventType: 'CTA_CLICK', // Type of Analytics event fired when clicking the CTA
         // Event options for the analytics event fired when this CTA is clicked.
         eventOptions: this.addDefaultEventOptions({ /* Add additional options here */ }),
@@ -40,7 +42,7 @@ class multilang_faq_accordionCardComponent extends BaseCard['multilang-faq-accor
         label: profile.c_secondaryCTA ? profile.c_secondaryCTA.label : null,
         // iconName: '',
         url: Formatter.generateCTAFieldTypeLink(profile.c_secondaryCTA),
-        target: '_top',
+        target: linkTarget,
         eventType: 'CTA_CLICK',
         eventOptions: this.addDefaultEventOptions({ /* Add additional options here */ }),
         // ariaLabel: '',