diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/4-site-logo.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/4-site-logo.cy.js index 75a326e5a..abaf39c81 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/4-site-logo.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/4-site-logo.cy.js @@ -1,21 +1,31 @@ // -import { AdminBarCheck, BackButtonCheck, DarkBGCheck, DisabledNextButton, LightBGCheck, ProgressBarCheck, SkipButtonCheck } from '../wp-module-support/siteGen.cy'; -import { apiList, siteGenMockAll, homePagesMock } from '../wp-module-support/MockApi.cy'; +import { + AdminBarCheck, + BackButtonCheck, + DarkBGCheck, + DisabledNextButton, + LightBGCheck, + ProgressBarCheck, + SkipButtonCheck, +} from '../wp-module-support/siteGen.cy'; +import { + apiList, + siteGenMockAll, + homePagesMock, +} from '../wp-module-support/MockApi.cy'; describe( 'SiteGen Site Logo Step', function () { before( () => { cy.intercept( apiList.sitegen, ( req ) => { siteGenMockAll( req ); } ).as( 'sitegenCalls' ); - + cy.intercept( apiList.homepages, ( req ) => { homePagesMock( req ); } ).as( 'homePageCall' ); - cy.visit( - 'wp-admin/?page=nfd-onboarding#/sitegen/step/site-logo' - ); + cy.visit( 'wp-admin/?page=nfd-onboarding#/sitegen/step/site-logo' ); cy.wait( '@sitegenCalls', { timeout: 60000 } ); cy.wait( '@homePageCall', { timeout: 60000 } ); } ); diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/5-experience.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/5-experience.cy.js index b5e1dec49..7e90ecb9e 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/5-experience.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/5-experience.cy.js @@ -1,6 +1,12 @@ // -import { AdminBarCheck, DarkBGCheck, ExperienceDetails, LightBGCheck, ProgressBarCheck} from "../wp-module-support/siteGen.cy"; +import { + AdminBarCheck, + DarkBGCheck, + ExperienceDetails, + LightBGCheck, + ProgressBarCheck, +} from '../wp-module-support/siteGen.cy'; describe( 'SiteGen Experience & Site Building Step', function () { before( () => { @@ -9,44 +15,47 @@ describe( 'SiteGen Experience & Site Building Step', function () { ); } ); - it( 'Check for the header admin bar', () => { - AdminBarCheck(); - } ); + it( 'Check for the header admin bar', () => { + AdminBarCheck(); + } ); - it( 'Check for the existing dark background', () => { + it( 'Check for the existing dark background', () => { DarkBGCheck(); } ); - it( 'Check for the light background', () => { - LightBGCheck(); - } ); - - it( 'Check the Progress Bar Value', () => { - ProgressBarCheck('57.1429%'); - }); - - it( 'Check for the existence & the count of experience level cards', () => { - cy.get( '.nfd-sg-experience-level' ).should('be.visible'); - cy.get( '.nfd-sg-loader' ).should('be.visible'); - cy.get( '.nfd-sg-card' ).should('be.visible'); - cy.get('.nfd__option_heading_subheading__wrapper').should('have.length',3) - } ); - - it( 'Check each experience cards', () => { - const className = '.nfd__option_heading_subheading__wrapper' - let options = 0; - const arr = cy.get( className ); + it( 'Check for the light background', () => { + LightBGCheck(); + } ); + + it( 'Check the Progress Bar Value', () => { + ProgressBarCheck( '57.1429%' ); + } ); + + it( 'Check for the existence & the count of experience level cards', () => { + cy.get( '.nfd-sg-experience-level' ).should( 'be.visible' ); + cy.get( '.nfd-sg-loader' ).should( 'be.visible' ); + cy.get( '.nfd-sg-card' ).should( 'be.visible' ); + cy.get( '.nfd__option_heading_subheading__wrapper' ).should( + 'have.length', + 3 + ); + } ); + + it( 'Check each experience cards', () => { + const className = '.nfd__option_heading_subheading__wrapper'; + let options = 0; + const arr = cy.get( className ); arr.each( () => { - if(options == 0){ - ExperienceDetails(className,'Beginner',options); - }; - if(options == 1){ - ExperienceDetails(className,'Intermediate',options); - }; - if(options == 2){ - ExperienceDetails(className, 'Expert',options); - }; - options+=1; - }); - } ); -}); + if ( options == 0 ) { + ExperienceDetails( className, 'Beginner', options ); + } + if ( options == 1 ) { + ExperienceDetails( className, 'Intermediate', options ); + } + if ( options == 2 ) { + ExperienceDetails( className, 'Expert', options ); + } + options += 1; + } ); + } ); +} ); diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/6-preview.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/6-preview.cy.js index 8778168a7..708616f94 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/6-preview.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/6-preview.cy.js @@ -1,84 +1,103 @@ // -import { AdminBarCheck, DarkBGCheck, LightBGCheck, ProgressBarCheck } from "../wp-module-support/siteGen.cy"; -import { apiList } from "../wp-module-support/MockApi.cy"; +import { + AdminBarCheck, + DarkBGCheck, + LightBGCheck, + ProgressBarCheck, +} from '../wp-module-support/siteGen.cy'; describe( 'SiteGen Site Preview Step', function () { - before( () => { - cy.visit( - 'wp-admin/index.php?page=nfd-onboarding#/sitegen/step/preview' - ); - cy.wait(5000); - } ); + before( () => { + cy.visit( + 'wp-admin/index.php?page=nfd-onboarding#/sitegen/step/preview' + ); + cy.wait( 5000 ); + } ); - it( 'Check for the header admin bar', () => { - AdminBarCheck(); - } ); + it( 'Check for the header admin bar', () => { + AdminBarCheck(); + } ); - it( 'Check for the existing dark background', () => { - DarkBGCheck(); - } ); + it( 'Check for the existing dark background', () => { + DarkBGCheck(); + } ); - it( 'Check for the light background', () => { - LightBGCheck(); - } ); + it( 'Check for the light background', () => { + LightBGCheck(); + } ); - it( 'Check the Progress Bar Value', () => { - ProgressBarCheck('71.4286%'); - }); + it( 'Check the Progress Bar Value', () => { + ProgressBarCheck( '71.4286%' ); + } ); - it( 'Check for by default 3 versions should be there', () => { - cy.get('.live-preview-sitegen--selectable-card', {timeout:20000}) - .should('be.visible') - .should('have.length', 3); - } ); + it( 'Check for by default 3 versions should be there', () => { + cy.get( '.live-preview-sitegen--selectable-card', { timeout: 20000 } ) + .should( 'be.visible' ) + .should( 'have.length', 3 ); + } ); - it( 'Check for the favourited theme versions', () => { - cy.get('g[clip-path="url(#heart-filled_svg__a)"]').should('not.exist'); // when no fav theme is selected - cy.get( '.live-preview-sitegen--selectable-card__live-preview-container-buttons__button__icon' ) - .eq(0) - .scrollIntoView() - .should('be.visible') - .click(); - cy.get('g[clip-path="url(#heart-filled_svg__a)"]' , {timeout:20000} ) - .should('exist'); - cy.get('.live-preview-sitegen--selectable-card__live-preview-container__overlay') - .eq(0) - .scrollIntoView() - .click(); - cy.reload(); - cy.wait(5000); - cy.get('g[clip-path="url(#heart-filled_svg__a)"]' , {timeout:20000} ) - .should('exist'); - cy.go('back'); - cy.reload(); - } ); + it( 'Check for the favourited theme versions', () => { + cy.get( 'g[clip-path="url(#heart-filled_svg__a)"]' ).should( + 'not.exist' + ); // when no fav theme is selected + cy.get( + '.live-preview-sitegen--selectable-card__live-preview-container-buttons__button__icon' + ) + .eq( 0 ) + .scrollIntoView() + .should( 'be.visible' ) + .click(); + cy.get( 'g[clip-path="url(#heart-filled_svg__a)"]', { + timeout: 20000, + } ).should( 'exist' ); + cy.get( + '.live-preview-sitegen--selectable-card__live-preview-container__overlay' + ) + .eq( 0 ) + .scrollIntoView() + .click(); + cy.reload(); + cy.wait( 5000 ); + cy.get( 'g[clip-path="url(#heart-filled_svg__a)"]', { + timeout: 20000, + } ).should( 'exist' ); + cy.go( 'back' ); + cy.reload(); + } ); - it.skip( 'Check for regenerating the new theme versions', () => { - cy.get('[aria-label="Regenerate Content"]', {timeout:20000}) - .eq(1) - .wait(1000) - .click({force : true}) - cy.get('[aria-label="Regenerate Content"]', {timeout:20000}) - .eq(2) - .scrollIntoView() - cy.get('.live-preview-sitegen--selectable-card', {timeout:20000}) - .should('be.visible') - .should('have.length', 4); - } ); + it.skip( 'Check for regenerating the new theme versions', () => { + cy.get( '[aria-label="Regenerate Content"]', { timeout: 20000 } ) + .eq( 1 ) + .wait( 1000 ) + .click( { force: true } ); + cy.get( '[aria-label="Regenerate Content"]', { timeout: 20000 } ) + .eq( 2 ) + .scrollIntoView(); + cy.get( '.live-preview-sitegen--selectable-card', { timeout: 20000 } ) + .should( 'be.visible' ) + .should( 'have.length', 4 ); + } ); - it( 'Check for the preview note at the bottom', () => { - cy.get('.nfd-onboarding-step--site-gen__preview__note') - .scrollIntoView() - .should('be.visible'); - cy.get('g[id="State\\=Active"]').should('exist'); - cy.get('.nfd-onboarding-step--site-gen__preview__note span').scrollIntoView().contains('Favorite'); - } ); + it( 'Check for the preview note at the bottom', () => { + cy.get( '.nfd-onboarding-step--site-gen__preview__note' ) + .scrollIntoView() + .should( 'be.visible' ); + cy.get( 'g[id="State\\=Active"]' ).should( 'exist' ); + cy.get( '.nfd-onboarding-step--site-gen__preview__note span' ) + .scrollIntoView() + .contains( 'Favorite' ); + } ); - it( 'Select any theme and go forward to the next step', () => { - cy.get('.live-preview-sitegen--selectable-card__live-preview-container__overlay', {timeout: 10000}) - .eq(0) - .click(); - cy.url().should('not.contain', 'sitegen/step/preview', {timeout: 20000}); - } ); -}); + it( 'Select any theme and go forward to the next step', () => { + cy.get( + '.live-preview-sitegen--selectable-card__live-preview-container__overlay', + { timeout: 10000 } + ) + .eq( 0 ) + .click(); + cy.url().should( 'not.contain', 'sitegen/step/preview', { + timeout: 20000, + } ); + } ); +} ); diff --git a/tests/cypress/integration/wp-module-support/MockApi.cy.js b/tests/cypress/integration/wp-module-support/MockApi.cy.js index fd63959ec..3e3822c39 100644 --- a/tests/cypress/integration/wp-module-support/MockApi.cy.js +++ b/tests/cypress/integration/wp-module-support/MockApi.cy.js @@ -13,9 +13,9 @@ export const apiList = { sitegen: '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fsitegen%2Fgenerate&flow=sitegen&_locale=user', homepages: - '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fsitegen%2Fhomepages&flow=sitegen&_locale=user', - homepagesRegenerate: - '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fsitegen%2Fhomepages%2Fregenerate&flow=sitegen&_locale=user' + '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fsitegen%2Fhomepages&flow=sitegen&_locale=user', + homepagesRegenerate: + '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fsitegen%2Fhomepages%2Fregenerate&flow=sitegen&_locale=user', }; export const siteGenMockAll = ( req ) => { @@ -29,13 +29,13 @@ export const siteGenMockAll = ( req ) => { 'color_palette': color_palette_mock, 'sitemap': sitemap_mock, 'plugin_recommendation': plugin_recommendation_mock, - 'font_pair': font_pair_mock - } + 'font_pair': font_pair_mock, + }; if ( sitegen_identifiers.hasOwnProperty( requestBody.identifier ) ) { req.reply( { statusCode: 200, - body: sitegen_identifiers[requestBody.identifier], + body: sitegen_identifiers[ requestBody.identifier ], headers: { 'content-type': 'application/json', }, diff --git a/tests/cypress/integration/wp-module-support/siteGen.cy.js b/tests/cypress/integration/wp-module-support/siteGen.cy.js index c5d832deb..6bb5ec852 100644 --- a/tests/cypress/integration/wp-module-support/siteGen.cy.js +++ b/tests/cypress/integration/wp-module-support/siteGen.cy.js @@ -1,69 +1,67 @@ // export const AdminBarCheck = () => { - cy.get( '.nfd-onboarding-header__admin-bar', {timeout:120000} ).should('be.visible'); + cy.get( '.nfd-onboarding-header__admin-bar', { timeout: 120000 } ).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 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 LightBGCheck = () => { - 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'); + 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' ); }; -export const OptionsDetails = (className,textValue,optionsValue) => { - cy.get(className, {timeout:10000}) - .eq(optionsValue) - .find('.nfd-onboarding-sitegen-options__container__heading__title') - .invoke( 'text' ) - .should('contain', textValue); +export const OptionsDetails = ( className, textValue, optionsValue ) => { + cy.get( className, { timeout: 10000 } ) + .eq( optionsValue ) + .find( '.nfd-onboarding-sitegen-options__container__heading__title' ) + .invoke( 'text' ) + .should( 'contain', textValue ); }; export const ProgressBarCheck = ( WidthPercent ) => { - cy.get('.nfd-onboarding-header__progress-bar').should('be.visible'); - cy.get('.nfd-onboarding-header__progress-bar__progress') - .invoke('attr', 'style') - .then((styleAttribute) => { - const value = styleAttribute.match(/width:\s*([\d.]+%)/)[1]; - expect(value).equal(WidthPercent); - }); + cy.get( '.nfd-onboarding-header__progress-bar' ).should( 'be.visible' ); + cy.get( '.nfd-onboarding-header__progress-bar__progress' ) + .invoke( 'attr', 'style' ) + .then( ( styleAttribute ) => { + const value = styleAttribute.match( /width:\s*([\d.]+%)/ )[ 1 ]; + expect( value ).equal( WidthPercent ); + } ); }; -export const BackButtonCheck = (currURL) => { - cy.get('.nfd-onboarding-button--dark') - .should('be.visible') - .click(); - cy.url().should('not.contain', currURL); - cy.go('back'); +export const BackButtonCheck = ( currURL ) => { + cy.get( '.nfd-onboarding-button--dark' ).should( 'be.visible' ).click(); + cy.url().should( 'not.contain', currURL ); + cy.go( 'back' ); }; export const SkipButtonCheck = () => { - cy.get('.skip-button') - .should('be.visible') - .contains('Skip for now'); + cy.get( '.skip-button' ).should( 'be.visible' ).contains( 'Skip for now' ); }; export const DisabledNextButton = () => { - cy.get('.nfd-onboarding-button--site-gen-next--disabled') - .should('be.visible') - .contains( 'Next' ); + cy.get( '.nfd-onboarding-button--site-gen-next--disabled' ) + .should( 'be.visible' ) + .contains( 'Next' ); }; -export const ExperienceDetails = (classname,textValue,optionsValue) => { - cy.get(classname) - .eq(optionsValue) - .find('.nfd__option_heading_subheading__left_top') - .invoke( 'text' ) - .should('contain', textValue); +export const ExperienceDetails = ( classname, textValue, optionsValue ) => { + cy.get( classname ) + .eq( optionsValue ) + .find( '.nfd__option_heading_subheading__left_top' ) + .invoke( 'text' ) + .should( 'contain', textValue ); };