diff --git a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/1-fork.cy.js b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/1-fork.cy.js index 50c71d33f..9758b0705 100644 --- a/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/1-fork.cy.js +++ b/tests/cypress/integration/5-AI-SiteGen-onboarding-flow/1-fork.cy.js @@ -1,4 +1,4 @@ -// +/// import { AdminBarCheck, @@ -6,126 +6,172 @@ import { LightBGCheck, } from '../wp-module-support/siteGen.cy'; import { apiList, migrationConnection } from '../wp-module-support/MockApi.cy'; +import { APIList, EventsAPI } from '../wp-module-support/EventsApi.cy'; +// Set a constant wait time for actions that need to wait for responses const waitTime = 60000; -describe( 'SiteGen Fork Step', function() { +describe( 'SiteGen Fork Step', function () { + // Run before any tests, setting the initial conditions for the WordPress environment before( () => { + // Clean up the option for onboarding flow cy.exec( 'npx wp-env run cli wp option delete nfd_module_onboarding_flow' ); + + // Set the site capabilities to enable AI SiteGen and access to AI cy.exec( - `npx wp-env run cli wp option set _transient_nfd_site_capabilities '{"hasAISiteGen": true, "canAccessAI": true}' --format=json` + `npx wp-env run cli wp option set _transient_nfd_site_capabilities '{"hasAISiteGen": true, "canAccessAI": true}' --format=json ` ); + + // Set a long timeout for the transient site capabilities cy.exec( `npx wp-env run cli wp option set _transient_timeout_nfd_site_capabilities 4102444800` ); + + // Wait for any background processes to complete cy.wait( 10000 ); + + // Visit the fork step of the onboarding page cy.visit( 'wp-admin/?page=nfd-onboarding#/wp-setup/step/fork' ); } ); + // Test the visibility of the header admin bar it( 'Check for the header admin bar', () => { AdminBarCheck(); } ); + // Test for the default light background it( 'Check for the default light background', () => { LightBGCheck(); } ); + // Test for the dark background it( 'Check for the dark background', () => { DarkBGCheck(); } ); - + // Verify the heading title text and visibility it( 'Check for the heading and the title', () => { cy.get( '.nfd-onboarding-step__heading__title' ) .should( 'be.visible' ) - .should( 'have.text', 'Welcome to WordPress' ); + .and( 'have.text', 'Welcome to WordPress' ); } ); + // Verify the subheading visibility it( 'Check for the subheading', () => { cy.get( '.nfd-onboarding-step__heading__subtitle' ).should( 'be.visible' ); } ); + // Check that there are exactly 3 container options available it( 'Check the number of container options available', () => { cy.get( '.nfd-onboarding-sitegen-options__option' ) .should( 'be.visible' ) - .should( 'have.length', 3 ); + .and( 'have.length', 3 ); } ); + // Test selecting different container options it( 'Check for selection of different container options', () => { const className = '.nfd-onboarding-sitegen-options__option'; - const arr = cy.get( className ); - arr.each( ( $element ) => { + cy.get( className ).each( ( $element ) => { const dataSlugText = $element.attr( 'data-flow' ); - if ( dataSlugText == 'sitebuild' ) { + if ( dataSlugText === 'sitebuild' ) { + // Click on the option and verify the URL $element.trigger( 'click' ); - cy.url().should( 'include', '#/wp-setup/step/get-started/welcome', { - timeout: 10000, - } ); + cy.url().should( + 'include', + '#/wp-setup/step/get-started/welcome', + { timeout: 10000 } + ); + + // Go back and wait for the options to reload cy.go( 'back' ); cy.get( className, { timeout: waitTime } ); } } ); } ); - it( 'Check the AI Sitegen flow.', () => { - cy.get( '.nfd-onboarding-sitegen-options__option--large' ).should( 'be.visible' ).trigger( 'click' ); + // Test the AI SiteGen flow + it( 'Check the AI Sitegen flow', () => { + cy.get( '.nfd-onboarding-sitegen-options__option--large' ) + .should( 'be.visible' ) + .trigger( 'click' ); + + // Verify the URL for the AI SiteGen flow cy.url().should( 'include', '#/sitegen/step/site-details', { timeout: 10000, } ); + + // Go back to the previous page cy.go( 'back' ); } ); + // Verify that "Import your WP account" opens the transfer site link it( 'Verify by default import your WP account leads to transfer site link', () => { cy.window().then( ( win ) => { - cy.spy( win, 'open', ( url ) => { - win.location.href = - 'https://bluehost.com/my-account/hosting/details/sites/add/transfer'; - } ).as( 'windowOpen' ); + // Spy on the window open method to ensure redirection + cy.spy( win, 'open' ).as( 'windowOpen' ); } ); - cy.get( '[data-flow=migration]' ) - .scrollIntoView() - .click(); + // Click on the migration option + cy.get( '[data-flow=migration]' ).scrollIntoView().click(); + // Verify the window open event was called cy.get( '@windowOpen' ).should( 'be.called' ); } ); + // Verify that import site leads to the migration process when capability is set it( 'Verify Import site leads to migration process initiation screen when can migrate capability is set', () => { + // Update the site capabilities to allow migration cy.exec( `npx wp-env run cli wp option update _transient_nfd_site_capabilities '{"hasAISiteGen": true, "canAccessAI": true, "canMigrateSite": true}' --format=json`, { timeout: 20000 } ); + + // Reload the page to apply the new settings cy.reload(); + + // Intercept the migration connection API call cy.intercept( apiList.migrateConnect, ( req ) => { migrationConnection( req ); } ).as( 'migrateCall' ); - cy.get( '[data-flow=migration]', { - timeout: waitTime, - } ) + + // Click on the migration option and verify the events and UI updates + cy.get( '[data-flow=migration]', { timeout: waitTime } ) .scrollIntoView() - .should( 'exist' ) .click(); + EventsAPI( + 'fork_option_selected_migrate', + 'MIGRATE', + APIList.events_api_general_onb, + 1 + ); + + // Verify that the migration UI elements are visible cy.get( '.nfd-onboarding-step__heading__title', { timeout: waitTime, } ).should( 'exist' ); cy.get( - '.nfd-onboarding-step--site-gen__migration--container__loader', { timeout: waitTime } + '.nfd-onboarding-step--site-gen__migration--container__loader', + { timeout: waitTime } ).should( 'exist' ); cy.get( '.nfd-onboarding-step--site-gen__migration--container__importtext' ).should( 'exist' ); + // Re-check for admin bar and background consistency AdminBarCheck(); LightBGCheck(); DarkBGCheck(); + + // Wait for the migration API call to complete cy.wait( '@migrateCall', { timeout: waitTime } ); } ); + // Verify the successful migration connection request and redirection it( 'Verify migration connection request is successful and redirection happens', () => { cy.url().should( 'contain', 'app.instawp.io/migrate' ); } ); diff --git a/tests/cypress/integration/wp-module-support/EventsApi.cy.js b/tests/cypress/integration/wp-module-support/EventsApi.cy.js index a1935c518..2b5937067 100644 --- a/tests/cypress/integration/wp-module-support/EventsApi.cy.js +++ b/tests/cypress/integration/wp-module-support/EventsApi.cy.js @@ -1,79 +1,133 @@ +// API routes for different events in the onboarding flow export const APIList = { - events_api_general_onb: '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fevents%2Fbatch&_locale=user', - events_api_ecomm: '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fevents%2Fbatch&_locale=user' + events_api_general_onb: + '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fevents%2Fbatch&_locale=user', + events_api_ecomm: + '/index.php?rest_route=%2Fnewfold-onboarding%2Fv1%2Fevents%2Fbatch&_locale=user', }; -export const EventsAPI = ( events_name, card_val, api_name ) => { +// Function to handle event validation from the API response +export const EventsAPI = ( + events_name, + card_val, + api_name, + expectedEventsCount +) => { + let actualEventsCount = 0; + + // Intercept the API request for events cy.intercept( api_name ).as( 'events' ); - cy.wait( '@events', { timeout: 15000 } ).then( ( requestObject ) => { - const responseBody = requestObject.request.body; - const responseData1 = responseBody[ 0 ].data; - if ( events_name == 'experience_level' ) { - if ( events_name in responseData1 ) { - expect( responseData1.experience_level ).equal( card_val ); - } else { - const responseData2 = responseBody[ 1 ].data; - if ( events_name in responseData2 ) { - expect( responseData2.experience_level ).equal( card_val ); + + // Wait for the intercepted request and process the response + cy.wait( '@events', { timeout: 15000 } ) + .then( ( requestObject ) => { + const responseBody = requestObject.request.body; + const responseData1 = responseBody[ 0 ].data; + + // Check the event type and validate the corresponding value + if ( events_name === 'experience_level' ) { + if ( events_name in responseData1 ) { + expect( responseData1.experience_level ).to.equal( + card_val + ); + } else { + const responseData2 = responseBody[ 1 ].data; + if ( events_name in responseData2 ) { + expect( responseData2.experience_level ).to.equal( + card_val + ); + } } } - } - if ( events_name == 'top_priority' ) { - if ( events_name in responseData1 ) { - expect( responseData1.top_priority ).equal( card_val ); - } else { - const responseData2 = responseBody[ 1 ].data; - if ( events_name in responseData2 ) { - expect( responseData2.top_priority ).equal( card_val ); + + if ( events_name === 'top_priority' ) { + if ( events_name in responseData1 ) { + expect( responseData1.top_priority ).to.equal( card_val ); + } else { + const responseData2 = responseBody[ 1 ].data; + if ( events_name in responseData2 ) { + expect( responseData2.top_priority ).to.equal( + card_val + ); + } } } - } - if ( events_name == 'primary_type' ) { - if ( events_name in responseData1 ) { - expect( responseData1.primary_type ).equal( card_val ); - } else { - const responseData2 = responseBody[ 1 ].data; - if ( events_name in responseData2 ) { - expect( responseData2.primary_type ).equal( card_val ); + if ( events_name === 'primary_type' ) { + if ( events_name in responseData1 ) { + expect( responseData1.primary_type ).to.equal( card_val ); + } else { + const responseData2 = responseBody[ 1 ].data; + if ( events_name in responseData2 ) { + expect( responseData2.primary_type ).to.equal( + card_val + ); + } } } - } - if ( events_name == 'secondary_type' ) { - if ( events_name in responseData1 ) { - expect( responseData1.secondary_type ).equal( card_val ); - } else { - const responseData2 = responseBody[ 1 ].data; - if ( events_name in responseData2 ) { - expect( responseData2.secondary_type ).equal( card_val ); + if ( events_name === 'secondary_type' ) { + if ( events_name in responseData1 ) { + expect( responseData1.secondary_type ).to.equal( card_val ); + } else { + const responseData2 = responseBody[ 1 ].data; + if ( events_name in responseData2 ) { + expect( responseData2.secondary_type ).to.equal( + card_val + ); + } } } - } - } ); + + // Special case for migration option selection + if ( events_name === 'fork_option_selected_migrate' ) { + expect( requestObject.response.statusCode ).to.eq( 202 ); + + // Count the number of migration events in the response + responseBody.forEach( ( body ) => { + if ( + body.data.hasOwnProperty( 'flow' ) && + body.data.flow === card_val + ) { + actualEventsCount++; + } + } ); + } + } ) + .then( () => { + if ( expectedEventsCount ) { + // Verify that the actual number of events matches the expected count + expect( actualEventsCount ).to.equal( expectedEventsCount ); + } + } ); }; +// Function to validate basic information in the API response export const BasicInfoAPI = ( events_name, label_key = [], actual_values = [] ) => { + // Wait for the events API to be intercepted cy.wait( '@events' ).then( ( requestObject ) => { const requestBody = requestObject.request.body; + // Iterate through the labels and verify their corresponding values label_key.forEach( ( labels, index ) => { - if ( labels == 'logo_added' ) { + if ( labels === 'logo_added' ) { + // Validate if the action is logo added expect( requestBody[ index ].action ).to.eq( 'logo_added' ); } else { const requestBodyData = requestBody[ index ].data; - if ( index == 0 ) { - if ( events_name == 'basic_info' ) { - expect( requestBodyData.label_key ).to.oneOf( [ - 'chapter', - 'top_priority', - ] ); - } + + // Check for basic info and validate label_key for certain events + if ( index === 0 && events_name === 'basic_info' ) { + expect( requestBodyData.label_key ).to.be.oneOf( [ + 'chapter', + 'top_priority', + ] ); } else { + // Validate the label_key and corresponding value expect( requestBodyData.label_key ).to.eq( labels ); expect( requestBodyData[ labels ] ).to.eq( actual_values[ index ] @@ -84,19 +138,28 @@ export const BasicInfoAPI = ( } ); }; +// Function to validate site features in the API response export const SiteFeaturesAPI = ( label_key_value, features = [] ) => { let index = 0; + // Wait for the events API to be intercepted cy.wait( '@events' ).then( ( requestObject ) => { const requestBody = requestObject.request.body; + + // Verify that the action is 'feature_added' expect( requestBody[ index ].action ).to.eq( 'feature_added' ); + // Iterate through the request body and validate the feature values requestBody.forEach( () => { const requestBodyData = requestBody[ index ].data; + + // Validate the label_key and its corresponding value for each feature expect( requestBodyData.label_key ).to.eq( label_key_value ); expect( requestBodyData[ label_key_value ] ).to.eq( features[ index ] ); + + // Increment index for the next feature index += 1; } ); } );