qe-fe-automation/cypress/e2e/growth/growth_common_lib/ads.ts

FE test automation framework using cypress

import { AmplitudeEvents } from './amplitude-events';

const adsSelectors = {
  homePageTile: '[data-testid="tile-upsell-banner-NAVAN_EXPENSE"]',
  upsellExpenseLP: '.upsell-expense-lp',
  upsellExpenseLPCheckbox: '[data-testid="agreement-check"]',
  upsellExpenseLPCTA: '[data-testid="add-expense-button"] button',
  upsellExpenseCongratsPage: '.upsell-expense-congrats',
  upsellExpenseCongratsButton: '[data-testid="upsell-expense-congrats-button"]',
  upsellExpenseExpendingBannerButton: '.expense-upsell-banner__content__CTAs button',
  pricingAdBanner: '[data-testid="pricing-ad-banner"]',
  pricingAdBannerTitle: '[data-testid="pricing-ad-banner-title"]',
  pricingAdBannerCTA: '[data-testid="pricing-ad-banner-cta"]'
};
export class GrowthAds {
  static clickOnExpendingBannerAd(): void {
    cy.allure().logStep('click on admin expending banner');
    cy.get(adsSelectors.upsellExpenseExpendingBannerButton).should('be.visible');
    cy.get(adsSelectors.upsellExpenseExpendingBannerButton).click();
    AmplitudeEvents.addExpectedAmplitudeEvents('upsell banner clicked');
  }

  static clickOnHomePageAdTile(): void {
    cy.allure().logStep('click on ad tile home page');
    cy.get(adsSelectors.homePageTile).should('be.visible');
    cy.get(adsSelectors.homePageTile).click();
    AmplitudeEvents.addExpectedAmplitudeEvents('expense tile banner clicked');
  }

  static verifyUpsellExpenseOpen(): void {
    cy.allure().logStep('Verify expense/upsell LP is getting opened');
    cy.url().should('include', '/expense/upsell');
    cy.get(adsSelectors.upsellExpenseLP).should('be.visible');
    AmplitudeEvents.addExpectedAmplitudeEvents('expense upsell page opened');
  }

  static clickOnAddExpenseCheckbox(): void {
    this.submitShouldBeDisabled();
    cy.allure().logStep('click on add expense checkbox');
    cy.get(adsSelectors.upsellExpenseLPCheckbox).click();
  }

  static submitShouldBeDisabled(): void {
    cy.get(adsSelectors.upsellExpenseLPCTA).within(($content) => {
      expect($content.is('[disabled]'), 'submit button should be disabled').to.be.true;
    });
  }

  static clickOnAddExpenseCTA(): void {
    cy.allure().logStep('click on add expense CTA');
    cy.get(adsSelectors.upsellExpenseLPCTA).click();
    AmplitudeEvents.addExpectedAmplitudeEvents('add expense clicked');
  }

  static verifyUpsellExpenseSubmitted(): void {
    cy.allure().logStep('Verify expense/upsell LP got submitted');
    cy.url().should('include', 'expense/upsell/congratulations');
    cy.get(adsSelectors.upsellExpenseCongratsPage).should('be.visible');
    AmplitudeEvents.addExpectedAmplitudeEvents('add expense success');
  }

  static clickOnSetUpNavanExpense(): void {
    cy.allure().logStep('click on set up navan expense');
    cy.get(adsSelectors.upsellExpenseCongratsButton).click();
  }

  static verifyPricingAdBannerLoaded(): void {
    // expected ad content
    const adContent = {
      title:
        'Your company has exceeded the free limit of 15 Monthly Active Users last month',
      ctas: [
        {
          title: 'Add a payment method',
          link: '/app/company/platform-fees?referral=mau_fop_reminder_admin_banner',
          icon: {
            name: 'plus',
            theme: 'solid'
          }
        },
        {
          title: 'Contact sales',
          link: 'mailto:growthsales@navan.com',
          icon: {
            name: 'email',
            theme: 'solid'
          }
        }
      ]
    };
    cy.allure().logStep('Verify pricing ad banner got loaded');
    cy.get(adsSelectors.pricingAdBanner).should('be.visible');
    cy.get(adsSelectors.pricingAdBannerTitle).should('have.text', adContent.title);
    cy.get(adsSelectors.pricingAdBannerCTA)
      .eq(0)
      .should('have.text', adContent.ctas[0].title);
    cy.get(adsSelectors.pricingAdBannerCTA)
      .eq(1)
      .should('have.text', adContent.ctas[1].title);
    cy.get(adsSelectors.pricingAdBannerCTA).eq(0).click();
    AmplitudeEvents.addExpectedAmplitudeEvents('expense mau banner clicked');
  }
}