From 2935589c9856f1d24b19b079934ebf38e6f65822 Mon Sep 17 00:00:00 2001 From: Avneet Raj Date: Fri, 5 Jan 2024 18:06:28 +0530 Subject: [PATCH 1/4] create fork step test --- .../5-AI-SiteGen-onboarding-flow/fork.cy.js | 50 +++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js new file mode 100644 index 000000000..71ec56c94 --- /dev/null +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js @@ -0,0 +1,50 @@ +// + +describe( 'SiteGen Fork Step', function () { + before( () => { + cy.visit( + 'wp-admin/?page=nfd-onboarding#/wp-setup/step/fork' + ); + } ); + + it( 'Check for the header admin bar', () => { + cy.get( '.nfd-onboarding-header__admin-bar' ).should('be.visible'); + } ); + + it( 'Check for the existing dark background', () => { + cy.wait( 2000 ); + // When the page loads, it should have dark background by default + cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); + } ); + + it( 'Check for the light background', () => { + cy.get( '.nfd-onboarding-toggle__theme__button__dark' ) + .should( 'exist' ) + .click(); + cy.get( '.nfd-onboarding-sitegen-light' ).should('be.visible'); + // Now changing the background back to dark + cy.get( '.nfd-onboarding-toggle__theme__button__light' ) + .should( 'exist' ) + .click(); + cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); + } ); + + it( 'Check for the heading and the title', () => { + cy.get( '.nfd-onboarding-step__heading__title' ) + .should('be.visible') + .should('have.text', 'Welcome to WordPress'); + } ); + + it ( 'Check for the subheading', () => { + cy.get( '.nfd-onboarding-step__heading__subtitle' ).should('be.visible'); + } ); + + it( 'Check for the import your WP account link at the bottom', () => { + cy.get( '.nfd-onboarding-step--site-gen__fork__importsite' ) + .scrollIntoView() + .should('exist') + .should('contain', 'Already have a WordPress site') + .should('have.attr', 'href', 'https://my.bluehost.com/cgi/services/migration'); + } ); + +}); \ No newline at end of file From 121c22ee674b12c6df515e9841d84dda4febde44 Mon Sep 17 00:00:00 2001 From: Avneet Raj Date: Mon, 8 Jan 2024 18:26:14 +0530 Subject: [PATCH 2/4] Add the remaining tests --- .../5-AI-SiteGen-onboarding-flow/fork.cy.js | 63 ++++++++++++++----- .../wp-module-support/siteGenBG.cy.js | 23 +++++++ 2 files changed, 70 insertions(+), 16 deletions(-) create mode 100644 tests/cypress/integration/wp-module-support/siteGenBG.cy.js diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js index 71ec56c94..2d46d2b63 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js @@ -1,5 +1,7 @@ // +import { AdminBarCheck, DarkBGCheck, LightBGChcek } from "../wp-module-support/siteGenBG.cy"; + describe( 'SiteGen Fork Step', function () { before( () => { cy.visit( @@ -8,25 +10,15 @@ describe( 'SiteGen Fork Step', function () { } ); it( 'Check for the header admin bar', () => { - cy.get( '.nfd-onboarding-header__admin-bar' ).should('be.visible'); + AdminBarCheck(); } ); - it( 'Check for the existing dark background', () => { - cy.wait( 2000 ); - // When the page loads, it should have dark background by default - cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); + it( 'Check for the existing dark background', () => { + DarkBGCheck(); } ); it( 'Check for the light background', () => { - cy.get( '.nfd-onboarding-toggle__theme__button__dark' ) - .should( 'exist' ) - .click(); - cy.get( '.nfd-onboarding-sitegen-light' ).should('be.visible'); - // Now changing the background back to dark - cy.get( '.nfd-onboarding-toggle__theme__button__light' ) - .should( 'exist' ) - .click(); - cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); + LightBGChcek(); } ); it( 'Check for the heading and the title', () => { @@ -39,6 +31,46 @@ describe( 'SiteGen Fork Step', function () { cy.get( '.nfd-onboarding-step__heading__subtitle' ).should('be.visible'); } ); + const OptionsDetails = (className,textValue,optionsValue) => { + cy.get(className) + .eq(optionsValue) + .find('.nfd-onboarding-sitegen-options__container__heading__title') + .invoke( 'text' ) + .should('contain', textValue); + if(optionsValue!=2){ // Excluding the Last Option as it takes to new tab, just validating the title text + cy.get(className) + .eq(optionsValue) + .click(); + }; + }; + + it( 'Check for selection of different container options', () => { + let options = 0; + const className = '.nfd-onboarding-sitegen-options__container__options'; + const arr = cy.get( className ); + arr.each( () => { + if(options == 0){ + OptionsDetails(className,'Build it myself',options); + cy.url().should('include', 'get-started/welcome',{ + timeout: 10000, + } ); + cy.go('back'); + }; + if(options == 1){ + OptionsDetails(className,'AI Website Creator',options); + cy.url().should('include', 'sitegen/step/welcome',{ + timeout: 10000, + } ); + cy.go('back'); + }; + if(options == 2){ + OptionsDetails(className, 'Hire a Pro',options); + }; + options+=1; + + }); + }); + it( 'Check for the import your WP account link at the bottom', () => { cy.get( '.nfd-onboarding-step--site-gen__fork__importsite' ) .scrollIntoView() @@ -46,5 +78,4 @@ describe( 'SiteGen Fork Step', function () { .should('contain', 'Already have a WordPress site') .should('have.attr', 'href', 'https://my.bluehost.com/cgi/services/migration'); } ); - -}); \ No newline at end of file +}); diff --git a/tests/cypress/integration/wp-module-support/siteGenBG.cy.js b/tests/cypress/integration/wp-module-support/siteGenBG.cy.js new file mode 100644 index 000000000..9ee1d9e59 --- /dev/null +++ b/tests/cypress/integration/wp-module-support/siteGenBG.cy.js @@ -0,0 +1,23 @@ +// + +export const AdminBarCheck = () => { + cy.get( '.nfd-onboarding-header__admin-bar' ).should('be.visible'); +}; + +export const DarkBGCheck = () => { + cy.wait( 2000 ); + // When the page loads, it should have dark background by default + cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); +}; + +export const LightBGChcek = () => { + cy.get( '.nfd-onboarding-toggle__theme__button__dark' ) + .should( 'exist' ) + .click(); + cy.get( '.nfd-onboarding-sitegen-light' ).should('be.visible'); + // Now changing the background back to dark + cy.get( '.nfd-onboarding-toggle__theme__button__light' ) + .should( 'exist' ) + .click(); + cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); +}; From bef70c0552cf6b0e8076239d6ac7f11a144285b3 Mon Sep 17 00:00:00 2001 From: Avneet Raj Date: Wed, 10 Jan 2024 15:47:14 +0530 Subject: [PATCH 3/4] address review comments --- .../5-AI-SiteGen-onboarding-flow/fork.cy.js | 15 +-------------- .../{siteGenBG.cy.js => siteGen.cy.js} | 13 +++++++++++++ 2 files changed, 14 insertions(+), 14 deletions(-) rename tests/cypress/integration/wp-module-support/{siteGenBG.cy.js => siteGen.cy.js} (62%) diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js index 2d46d2b63..a5973464e 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js @@ -1,6 +1,6 @@ // -import { AdminBarCheck, DarkBGCheck, LightBGChcek } from "../wp-module-support/siteGenBG.cy"; +import { AdminBarCheck, DarkBGCheck, LightBGChcek, OptionsDetails } from "../wp-module-support/siteGen.cy"; describe( 'SiteGen Fork Step', function () { before( () => { @@ -31,19 +31,6 @@ describe( 'SiteGen Fork Step', function () { cy.get( '.nfd-onboarding-step__heading__subtitle' ).should('be.visible'); } ); - const OptionsDetails = (className,textValue,optionsValue) => { - cy.get(className) - .eq(optionsValue) - .find('.nfd-onboarding-sitegen-options__container__heading__title') - .invoke( 'text' ) - .should('contain', textValue); - if(optionsValue!=2){ // Excluding the Last Option as it takes to new tab, just validating the title text - cy.get(className) - .eq(optionsValue) - .click(); - }; - }; - it( 'Check for selection of different container options', () => { let options = 0; const className = '.nfd-onboarding-sitegen-options__container__options'; diff --git a/tests/cypress/integration/wp-module-support/siteGenBG.cy.js b/tests/cypress/integration/wp-module-support/siteGen.cy.js similarity index 62% rename from tests/cypress/integration/wp-module-support/siteGenBG.cy.js rename to tests/cypress/integration/wp-module-support/siteGen.cy.js index 9ee1d9e59..ccb6db2cc 100644 --- a/tests/cypress/integration/wp-module-support/siteGenBG.cy.js +++ b/tests/cypress/integration/wp-module-support/siteGen.cy.js @@ -21,3 +21,16 @@ export const LightBGChcek = () => { .click(); cy.get('.nfd-onboarding-sitegen-dark').should('be.visible'); }; + +export const OptionsDetails = (className,textValue,optionsValue) => { + cy.get(className) + .eq(optionsValue) + .find('.nfd-onboarding-sitegen-options__container__heading__title') + .invoke( 'text' ) + .should('contain', textValue); + if(optionsValue!=2){ // Excluding the Last Option as it takes to new tab, just validating the title text + cy.get(className) + .eq(optionsValue) + .click(); + }; +}; From 8b217a684d29b56c1f43d405121c2b1efb125700 Mon Sep 17 00:00:00 2001 From: Avneet Raj Date: Wed, 10 Jan 2024 17:16:20 +0530 Subject: [PATCH 4/4] Update fork.cy.js Added one more test to check the number of container options available --- .../integration/5-AI-SiteGen-onboarding-flow/fork.cy.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js index a5973464e..98b9db108 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/fork.cy.js @@ -31,6 +31,12 @@ describe( 'SiteGen Fork Step', function () { cy.get( '.nfd-onboarding-step__heading__subtitle' ).should('be.visible'); } ); + it ( 'Check the number of container options available', () => { + cy.get( '.nfd-onboarding-sitegen-options__container__options' ) + .should( 'be.visible' ) + .should('have.length', 3); + } ); + it( 'Check for selection of different container options', () => { let options = 0; const className = '.nfd-onboarding-sitegen-options__container__options';