Skip to content

Commit

Permalink
Merge pull request #1880 from usagov/USAGOV-1834-Cypress-Footer-Updates
Browse files Browse the repository at this point in the history
USAGOV-1834-Cypress-Footer-Updates: Footer Regression Check Updates
  • Loading branch information
developer43 authored Sep 3, 2024
2 parents 2e49960 + eabb34c commit 80d462d
Show file tree
Hide file tree
Showing 5 changed files with 145 additions and 33 deletions.
30 changes: 15 additions & 15 deletions automated_tests/e2e-cypress/cypress/e2e/functional/eng/footer.cy.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,10 +23,10 @@ describe('Footer [ENG]', () => {
const invalidEmails = ['test@#$1123', 'test2@', '@test3.com']

// Test invalid emails
for (let i = 0; i < invalidEmails.length; i++) {
for (const email of invalidEmails) {
cy.get('#footer-email')
.type(invalidEmails[i])
.should('have.value', invalidEmails[i])
.type(email)
.should('have.value', email)
.type('{enter}')

cy.get('input:invalid').should('have.length', 1)
Expand All @@ -41,8 +41,8 @@ describe('Footer [ENG]', () => {
// Origin URL should now be connect.usa.gov
const sentArgs = { email: validEmail }
cy.origin(
'https://connect.usa.gov/',
{ args: sentArgs },
'https://connect.usa.gov/',
{ args: sentArgs },
({ email }) => {
cy.get('input')
.filter('[name="email"]')
Expand All @@ -55,15 +55,15 @@ describe('Footer [ENG]', () => {
cy.get('#footer-email')
.type(validEmail)
.should('have.value', validEmail)

cy.get('.usa-sign-up')
.find('button[type="submit"]')
.click()

// Origin URL should now be connect.usa.gov
cy.origin(
'https://connect.usa.gov/',
{ args: sentArgs },
'https://connect.usa.gov/',
{ args: sentArgs },
({ email }) => {
cy.get('input')
.filter('[name="email"]')
Expand All @@ -72,16 +72,16 @@ describe('Footer [ENG]', () => {
)
})
it('BTE 14: Social media icons appear in footer and link to correct places', () => {
for (let i = 0; i < socials.length; i++) {
for (const social of socials) {
cy.get('.usa-footer__contact-links')
.find(`[alt="${socials[i].name} USAGov"]`)
.should('have.attr', 'src', `/themes/custom/usagov/images/footer_icon_${socials[i].name.toLowerCase()}.svg`)
.find(`[alt="${social.alt_text} USAGov"]`)
.should('have.attr', 'src', `/themes/custom/usagov/images/social-media-icons/${social.name}_Icon.svg`)

cy.get('.usa-footer__contact-links')
.find(`[alt="${socials[i].name} USAGov"]`)
.find(`[alt="${social.alt_text} USAGov"]`)
.parent()
.as('link')
.should('have.attr', 'href', socials[i].link)
.should('have.attr', 'href', social.link)
}
})
it('BTE 15: Contact Center information appears in footer and phone number links to /phone', () => {
Expand All @@ -93,7 +93,7 @@ describe('Footer [ENG]', () => {
})
it('BTE 16: Subfooter indicating USAGov is official site appears at very bottom', () => {
cy.get('.usa-footer')
.find('.usa-identifier__usagov-description')
.find('.usa-identifier')
.should('contain', 'USAGov')
.should('contain', 'official guide')
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,10 +23,10 @@ describe('Footer [ES]', () => {
const invalidEmails = ['test@#$1123', 'test2@', '@test3.com']

// Test invalid emails
for (let i = 0; i < invalidEmails.length; i++) {
for (const email of invalidEmails) {
cy.get('#footer-email')
.type(invalidEmails[i])
.should('have.value', invalidEmails[i])
.type(email)
.should('have.value', email)
.type('{enter}')

cy.get('input:invalid').should('have.length', 1)
Expand All @@ -41,8 +41,8 @@ describe('Footer [ES]', () => {
// Origin URL should now be connect.usa.gov
const sentArgs = { email: validEmail }
cy.origin(
'https://conectate.gobiernousa.gov',
{ args: sentArgs },
'https://conectate.gobiernousa.gov',
{ args: sentArgs },
({ email }) => {
cy.get('input')
.filter('[name="email"]')
Expand All @@ -55,15 +55,15 @@ describe('Footer [ES]', () => {
cy.get('#footer-email')
.type(validEmail)
.should('have.value', validEmail)

cy.get('.usa-sign-up')
.find('button[type="submit"]')
.click()

// Origin URL should now be connect.usa.gov
cy.origin(
'https://conectate.gobiernousa.gov',
{ args: sentArgs },
'https://conectate.gobiernousa.gov',
{ args: sentArgs },
({ email }) => {
cy.get('input')
.filter('[name="email"]')
Expand All @@ -72,17 +72,17 @@ describe('Footer [ES]', () => {
)
})
it('BTS 14: Social media icons appear in footer and link to correct places', () => {
for (let i = 0; i < socials.length; i++) {
if (socials[i].linkEs.length > 0) {
for (const social of socials) {
if (social.linkEs.length > 0) {
cy.get('.usa-footer__contact-links')
.find(`[alt="${socials[i].name} USAGov"]`)
.should('have.attr', 'src', `/themes/custom/usagov/images/footer_icon_${socials[i].name.toLowerCase()}.svg`)
.find(`[alt="${social.alt_text} USAGov"]`)
.should('have.attr', 'src', `/themes/custom/usagov/images/social-media-icons/${social.name}_Icon.svg`)

cy.get('.usa-footer__contact-links')
.find(`[alt="${socials[i].name} USAGov"]`)
.find(`[alt="${social.alt_text} USAGov"]`)
.parent()
.as('link')
.should('have.attr', 'href', socials[i].linkEs)
.should('have.attr', 'href', social.linkEs)
}
}
})
Expand All @@ -95,7 +95,7 @@ describe('Footer [ES]', () => {
})
it('BTS 16: Subfooter indicating USAGov is official site appears at very bottom', () => {
cy.get('.usa-footer')
.find('.usa-identifier__usagov-description')
.find('.usa-identifier')
.should('contain', 'USAGov')
.should('contain', 'la guía oficial')
})
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
const socials = require("../../fixtures/socials.json");
const paths = ["/", "/es"];

paths.forEach((path, idx) => {
let lang;
if (path === "/") {
lang = "English";
} else {
lang = "Español";
}
describe(`${lang} Footer`, () => {
beforeEach(() => {
// Set base URL
cy.visit(path);
});
it(`BTE/S 12: Footer links appear and work appropriately`, () => {
cy.get(".usa-footer__nav")
.find("a")
.not('[href="/website-analytics/"]')
.each((link) => {
cy.wrap(link)
.invoke("attr", "href")
.then((href) => {
cy.request(href).its("status").should("eq", 200);
});
});
});
it("BTE/S 13: Email subscription form appears in footer and works appropriately", () => {
const validEmail = "[email protected]";
const invalidEmails = ["test@#$1123", "test2@", "@test3.com"];
const emails = [
"https://connect.usa.gov/",
"https://conectate.gobiernousa.gov",
];
// Test invalid emails
for (const email of invalidEmails) {
cy.get("#footer-email")
.type(email)
.should("have.value", email)
.type("{enter}");

cy.get("input:invalid").should("have.length", 1);
cy.get("input:invalid").clear();
}

// Test valid email
cy.get("#footer-email").type(validEmail).type("{enter}");

// Origin URL should now be connect.usa.gov
const sentArgs = { email: validEmail };
cy.origin(emails[idx], { args: sentArgs }, ({ email }) => {
cy.get("input").filter('[name="email"]').should("have.value", email);
});

// Go back to localhost to test submit button
cy.visit(path);
cy.get("#footer-email").type(validEmail).should("have.value", validEmail);

cy.get(".usa-sign-up").find('button[type="submit"]').click();

// Origin URL should now be connect.usa.gov
cy.origin(emails[idx], { args: sentArgs }, ({ email }) => {
cy.get("input").filter('[name="email"]').should("have.value", email);
});
});
it("BTE/S 14: Social media icons appear in footer and link to correct places", () => {
for (const social of socials) {
//if spanish check that there are links
if (path === "/es" && social.linkEs.length <= 0) {
continue;
} else {
cy.get(".usa-footer__contact-links")
.find(`[alt="${social.alt_text} USAGov"]`)
.should(
"have.attr",
"src",
`/themes/custom/usagov/images/social-media-icons/${social.name}_Icon.svg`,
);

let socialLink;
if (path === "/es") {
socialLink = social.linkEs;
} else {
socialLink = social.link;
}
cy.get(".usa-footer__contact-links")
.find(`[alt="${social.alt_text} USAGov"]`)
.parent()
.as("link")
.should("have.attr", "href", socialLink);
}
}
});
it("BTE/S 15: Contact Center information appears in footer and phone number links to /phone", () => {
const phones = ["/phone", "/es/llamenos"];
cy.get("#footer-phone").find("a").click();

cy.url().should("include", phones[idx]);
});
it("BTE/S 16: Subfooter indicating USAGov is official site appears at very bottom", () => {
const identifier = ["official guide", "la guía oficial"];
cy.get(".usa-footer")
.find(".usa-identifier")
.should("contain", "USAGov")
.should("contain", identifier[idx]);
});
});
});
8 changes: 6 additions & 2 deletions automated_tests/e2e-cypress/cypress/fixtures/socials.json
Original file line number Diff line number Diff line change
@@ -1,21 +1,25 @@
[
{
"name": "Facebook",
"alt_text": "Facebook",
"link": "https://www.facebook.com/USAgov",
"linkEs": "https://www.facebook.com/usagovespanol"
},
{
"name": "Twitter",
"name": "X_Twitter",
"alt_text": "X Twitter",
"link": "https://twitter.com/USAgov",
"linkEs": "https://twitter.com/usagovespanol"
},
{
"name": "Youtube",
"name": "YouTube",
"alt_text": "Youtube",
"link": "https://www.youtube.com/usagov1",
"linkEs": "https://www.youtube.com/USAgovespanol"
},
{
"name": "Instagram",
"alt_text": "Instagram",
"link": "https://www.instagram.com/usagov/",
"linkEs": ""
}
Expand Down

0 comments on commit 80d462d

Please sign in to comment.