diff --git a/src/js/pages/More/Donate.jsx b/src/js/pages/More/Donate.jsx index 3acd54a0c..b4957dbc3 100644 --- a/src/js/pages/More/Donate.jsx +++ b/src/js/pages/More/Donate.jsx @@ -159,19 +159,19 @@ class Donate extends Component { ); preDonateDescription = () => ( - + Thank you for being a voter! For every $10 donated, you help 50 Americans be voters too. ); preDonateDescriptionBottom = (isC4Donation) => ( - + + Our budgets are small, - + Want more Americans to vote? diff --git a/tests/browserstack_automation/page_objects/donate.page.js b/tests/browserstack_automation/page_objects/donate.page.js index 315c43b6e..02ff4737b 100644 --- a/tests/browserstack_automation/page_objects/donate.page.js +++ b/tests/browserstack_automation/page_objects/donate.page.js @@ -1,4 +1,4 @@ -import { $, $$, driver } from '@wdio/globals'; +import { $, driver } from '@wdio/globals'; import Page from './page'; class DonatePage extends Page { @@ -11,28 +11,28 @@ class DonatePage extends Page { } async checkLinkAndTite () { - await expect(driver).toHaveUrl('https://quality.wevote.us/donate'); + await expect(driver).toHaveUrl(path + '/donate'); await expect(driver).toHaveTitle('Donate - WeVote'); } getDonateHeader () { - return $('//*[@id="app"]//h1'); + return $('#want_to_vote'); } getFirstParagraph () { - return $('//*[@id="app"]/div/div[2]/div/div/div[2]/div[1]/span[1]'); + return $('(//*[@id="first_paragraph"])[2]'); } getSecondParagraph () { - return $('//*[@id="app"]/div/div[2]/div/div/div[2]/div[1]/span[2]'); + return $('(//*[@id="second_paragraph"])[2]'); } getTextLink () { - return $('#annualBudget > span'); + return $('#budgets_small'); } getOneTimeButton () { - return $('//label[@for="plan_duration_one_time"]'); + return $('#plan_duration_one_time'); } getDonateAmountButton (amount) { @@ -43,10 +43,6 @@ class DonatePage extends Page { return $('#donorbox-iframe'); } - getCommentCheckbox () { - return $('//*[@id="standard-donation-section"]/div[6]/div/label/span[4]'); - } - getCommentField () { return $('#ty-msg'); } @@ -76,10 +72,10 @@ class DonatePage extends Page { } getOneTimeLabel () { - return $('//*[@id="donation-amount-description"]/div/h3/span[2]'); + return $('.donation-interval.plan_duration_one_time'); } - getAmount () { + getOneTimeAmount () { return $('h3 > var > span'); } @@ -95,16 +91,28 @@ class DonatePage extends Page { return $('#donation_custom_amount'); } + getCommentCheckbox () { + return $('//span[text()="Write us a comment"]/../span[4]'); + } + getDisplayDonationCheckbox () { - return $('//*[@id="standard-donation-section"]/div[8]/div[1]/div/label/span[4]'); + return $('//span[contains(text(), "on the donor wall")]/../span[4]'); } getDisplayFirstNameCheckbox () { - return $('//*[@id="standard-donation-section"]/div[8]/div[2]/div/label/span[4]'); + return $('//span[contains(text(), "first name instead")]/../span[4]'); } getHideDonationAmountCheckbox () { - return $('//*[@id="standard-donation-section"]/div[8]/div[3]/div/label/span[4]'); + return $('//span[contains(text(), "Hide donation")]/../span[4]'); + } + + getDedicateMyDonationCheckbox () { + return $('//span[contains(text(), "Dedicate")]/../span[4]'); + } + + getInMemoryOfRadioButton () { + return $('label[for="donation_donation_honor_attributes_honor_type_memory"]'); } getFirstName () { @@ -123,40 +131,32 @@ class DonatePage extends Page { return $('#footer_button'); } - getMonthlyLabel () { - return $('//*[@id="linkButton"]/span[1]/span[2]'); + getIntervalLabel () { + return $('.plan_duration_monthly.interval'); } getProcessingFeeLabel () { - return $('//*[@id="donor-form-step-4"]/div/label[2]/span/var/span'); + return $('(//span[@class="processing_fee"])[2]'); } getMonthlyAmount () { - return $('//*[@id="linkButton"]/span[1]/span[2]/var/span'); + return $('(//span[@class="donation-amt"])[3]'); } getQuarterlyAmount () { - return $('//*[@id="linkButton"]/span[1]/span[3]/var/span'); + return $('(//span[@class="donation-amt"])[4]'); } getAnnuallyAmount () { - return $('//*[@id="linkButton"]/span[1]/span[4]/var/span'); + return $('(//span[@class="donation-amt"])[5]'); } getQuarterlyButton () { - return $('label[for="plan_duration_quarterly"]'); + return $('#plan_duration_quarterly'); } getAnnuallyButton () { - return $('label[for="plan_duration_annual"]'); - } - - getDedicateMyDonationCheckbox () { - return $('//*[@id="standard-donation-section"]/div[5]/div/label/span[4]'); - } - - getInMemoryOfRadioButton () { - return $('label[for="donation_donation_honor_attributes_honor_type_memory"]'); + return $('#plan_duration_annual'); } getHonoreeNameField () { diff --git a/tests/browserstack_automation/specs/DonatePage.js b/tests/browserstack_automation/specs/DonatePage.js index 909f892f3..3bd75c6be 100644 --- a/tests/browserstack_automation/specs/DonatePage.js +++ b/tests/browserstack_automation/specs/DonatePage.js @@ -1,14 +1,41 @@ import { driver, expect, $ } from '@wdio/globals'; import ReadyPage from '../page_objects/ready.page'; import DonatePage from '../page_objects/donate.page'; -import { attach } from 'webdriverio'; /* eslint-disable no-undef This eslint-disable turns off warnings for describe() and it() We don't need those warnings, because describe() and it() are available at runtime Refer to https://webdriver.io/docs/pageobjects for guidance */ -const waitTime = 2000; +var fillDonationForm = async (name, lastName, email) => { + await DonatePage.getFirstName().setValue(name); + await DonatePage.getLasttName().setValue(lastName); + await DonatePage.getEmail().setValue(email); + (await DonatePage.getNextButton()).click(); +}; + +async function nextButtonScrollIntoView() { + const nextButton = await DonatePage.getNextButton(); + await nextButton.scrollIntoView(); + await expect(nextButton).toBeDisplayed(); + await nextButton.click(); +} + +var checkAmounts = async (interval, processingFee, fullAmount, withoutFeeAmount, amountLabel) => { + const elementText = await DonatePage.getIntervalLabel().getText(); + const amount = await amountLabel; + expect(elementText.includes(interval)); + await expect(DonatePage.getProcessingFeeLabel()).toHaveText(processingFee); + await expect(amount).toHaveText(fullAmount); + driver.pause(3000); + (await DonatePage.getOptionalFeesCheckbox()).click(); + driver.pause(3000); + await expect(amount).toHaveText(withoutFeeAmount); + + (await DonatePage.getDonateButton()).click(); + await expect(driver).toHaveTitle('Log in to your PayPal account'); +}; + describe('DonatePage', () => { @@ -65,17 +92,19 @@ describe('DonatePage', () => { const value = await DonatePage.getCommentField().getValue(); await expect(value).toBe('Hello, WeVote!'); - const nextButton = await DonatePage.getNextButton(); - await nextButton.scrollIntoView(); - await expect(nextButton).toBeDisplayed(); - await nextButton.click(); + await nextButtonScrollIntoView(); await DonatePage.getPayPalButton().click(); await expect(DonatePage.getOneTimeLabel()).toHaveText("One-time"); - await expect(DonatePage.getAmount()).toHaveText('$125.17'); + await expect(DonatePage.getOneTimeAmount()).toHaveText('$125.17'); await driver.switchToFrame(await DonatePage.getPayPalIFrame()); - await DonatePage.getPayPalButton2().click(); + const payPalButton = await DonatePage.getPayPalButton2(); + await payPalButton.waitForClickable({ timeout: 5000 }); + await payPalButton.scrollIntoView(); + await expect(payPalButton).toBeDisplayed(); + await expect(payPalButton).toBeClickable(); + await payPalButton.click(); const allWindowHandles = await driver.getWindowHandles(); await driver.switchToWindow(allWindowHandles[allWindowHandles.length - 1]); @@ -105,26 +134,9 @@ describe('DonatePage', () => { await checkbox.click(); } - const nextButton = await DonatePage.getNextButton(); - await nextButton.scrollIntoView(); - await expect(nextButton).toBeDisplayed(); - await nextButton.click(); - - await DonatePage.getFirstName().setValue('Dmytro'); - await DonatePage.getLasttName().setValue('Dolbilov'); - await DonatePage.getEmail().setValue('dolbilov@gmail.com'); - await nextButton.click(); - - const elementText = await DonatePage.getMonthlyLabel().getText(); - expect(elementText.includes('Monthly')); - await expect(DonatePage.getProcessingFeeLabel()).toHaveText('$0.70'); - await expect(DonatePage.getMonthlyAmount()).toHaveText('$5.71'); - (await DonatePage.getOptionalFeesCheckbox()).click(); - await expect(DonatePage.getMonthlyAmount()).toHaveText('$5.01'); - - (await DonatePage.getDonateButton()).click(); - await expect(driver).toHaveTitle('Log in to your PayPal account'); - await driver.pause(waitTime); + await nextButtonScrollIntoView(); + await fillDonationForm('Dmytro', 'Dolbilov', 'dolbilov@gmail.com'); + await checkAmounts('Monthly', '$0.70', '$5.71', '$5.01', DonatePage.getMonthlyAmount()); }); // Donate_006 @@ -141,25 +153,9 @@ describe('DonatePage', () => { (await DonatePage.getRecipientEmailField()).setValue('bill@gmail.com'); (await DonatePage.getRecipientMessageField()).setValue('Donation in memory of John F. Kennedy'); - const nextButton = await DonatePage.getNextButton(); - await nextButton.scrollIntoView(); - await expect(nextButton).toBeDisplayed(); - await nextButton.click(); - - await DonatePage.getFirstName().setValue('Dmytro'); - await DonatePage.getLasttName().setValue('Dolbilov'); - await DonatePage.getEmail().setValue('dolbilov@gmail.com'); - await nextButton.click(); - - const elementText = await DonatePage.getMonthlyLabel().getText(); - expect(elementText.includes('Quarterly')); - await expect(DonatePage.getProcessingFeeLabel()).toHaveText('$2.45'); - await expect(DonatePage.getQuarterlyAmount()).toHaveText('$52.45'); - (await DonatePage.getOptionalFeesCheckbox()).click(); - await expect(DonatePage.getQuarterlyAmount()).toHaveText('$50'); - - (await DonatePage.getDonateButton()).click(); - await expect(driver).toHaveTitle('Log in to your PayPal account'); + await nextButtonScrollIntoView(); + await fillDonationForm('Dmytro', 'Dolbilov', 'dolbilov@gmail.com'); + await checkAmounts('Quarterly', '$2.45', '$52.45', '$50', DonatePage.getQuarterlyAmount()); }); // Donate_007 @@ -186,32 +182,14 @@ describe('DonatePage', () => { await expect(DonatePage.getDisplayDonationCheckbox()).not.toBeChecked(); (await DonatePage.getDisplayDonationCheckbox()).click(); - await expect(DonatePage.getDisplayFirstNameCheckbox()).not.toBeChecked(); (await DonatePage.getDisplayFirstNameCheckbox()).click(); - await expect(DonatePage.getHideDonationAmountCheckbox()).not.toBeChecked(); (await DonatePage.getHideDonationAmountCheckbox()).click(); - const nextButton = await DonatePage.getNextButton(); - await nextButton.scrollIntoView(); - await expect(nextButton).toBeDisplayed(); - await nextButton.click(); - - await DonatePage.getFirstName().setValue('Dmytro'); - await DonatePage.getLasttName().setValue('Dolbilov'); - await DonatePage.getEmail().setValue('dolbilov@gmail.com'); - await nextButton.click(); - - const elementText = await DonatePage.getMonthlyLabel().getText(); - expect(elementText.includes('Annually')); - await expect(DonatePage.getProcessingFeeLabel()).toHaveText('$12.16'); - await expect(DonatePage.getAnnuallyAmount()).toHaveText('$312.16'); - (await DonatePage.getOptionalFeesCheckbox()).click(); - await expect(DonatePage.getAnnuallyAmount()).toHaveText('$300'); - - (await DonatePage.getDonateButton()).click(); - await expect(driver).toHaveTitle('Log in to your PayPal account'); + await nextButtonScrollIntoView(); + await fillDonationForm('Dmytro', 'Dolbilov', 'dolbilov@gmail.com'); + await checkAmounts('Anually', '$12.16', '$312.16', '$300', DonatePage.getAnnuallyAmount()); }); });