Skip to content

Commit

Permalink
Merge pull request #21 from newfold-labs/update/testisolation
Browse files Browse the repository at this point in the history
Update cypress test with testIsolation true
  • Loading branch information
circlecube authored Jan 7, 2025
2 parents b3bcd65 + 6530f43 commit d422d12
Show file tree
Hide file tree
Showing 2 changed files with 104 additions and 42 deletions.
95 changes: 53 additions & 42 deletions tests/cypress/integration/global-ctb.cy.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
// <reference types="Cypress" />
import { wpLogin, wpCli, setCapability } from '../wp-module-support/utils.cy';

const global_ctb_products = require( '../fixtures/global-ctb-products.json' );

describe( 'Click to buy', function () {
before( () => {
describe( 'Global Click to Buy', { testIsolation: true }, () => {
beforeEach( () => {
wpLogin();
wpCli( 'transient delete newfold_marketplace' );
cy.visit( '/wp-admin/index.php' );
cy.exec( 'npx wp-env run cli wp transient delete newfold_marketplace' );

cy.intercept(
{
method: 'GET',
Expand All @@ -13,6 +17,22 @@ describe( 'Click to buy', function () {
global_ctb_products
).as( 'global_ctb_products' );

cy.intercept(
{
method: 'GET',
url: /newfold-ctb(\/|%2F)v2(\/|%2F)ctb/,
},
{
body: {
url: 'https://example.com',
},
}
).as( 'ctb' );
} );

it( 'CTB Button renders and CTB Modal opens', () => {
// set ctb capability
setCapability( { canAccessGlobalCTB: true } );
cy.visit(
'/wp-admin/admin.php?page=' +
Cypress.env( 'pluginId' ) +
Expand All @@ -26,13 +46,13 @@ describe( 'Click to buy', function () {
}
);

} );

it( 'Button has CTB Attributes', () => {
cy.window().then( ( win ) => {
cy.log( `NewfoldRuntime.capabilities.canAccessGlobalCTB: ${ win.NewfoldRuntime.capabilities.canAccessGlobalCTB }` )
cy.log(
`NewfoldRuntime.capabilities.canAccessGlobalCTB: ${ win.NewfoldRuntime.capabilities.canAccessGlobalCTB }`
);
} );

// Check CTB Button attributes
cy.get( '#marketplace-item-a1ff70f1-9670-4e25-a0e1-a068d3e43a45' )
.scrollIntoView()
.should( 'exist' )
Expand All @@ -44,44 +64,32 @@ describe( 'Click to buy', function () {
'57d6a568-783c-45e2-a388-847cff155897'
)
.should( 'have.attr', 'target', '_blank' );
} );

it( 'CTB modal opens successfully', () => {
cy.intercept(
{
method: 'GET',
url: /newfold-ctb(\/|%2F)v2(\/|%2F)ctb/,
},
{
body: {
url: 'https://example.com',
},
}
);

cy.get( 'body' ).should( 'not.have.class', 'noscroll' );

// CTB modal opens successfully
cy.get( '[data-action="load-nfd-ctb"]' ).scrollIntoView().click();

// wait for intercept with data
cy.wait( 1000 );
cy.wait( '@ctb' );
cy.wait( 250 ); // give time for modal to open

// check body for noscroll class
cy.get( 'body' ).should( 'have.class', 'noscroll' );

// check for modal should be.visible
// check for modal content
cy.get( '#nfd-global-ctb-container' ).should( 'exist' );
cy.get( '.global-ctb-modal-content' )
.scrollIntoView()
.should( 'be.visible' );

// verify iframe content is visible
// verify iframe src is correct
cy.get( '.global-ctb-modal-content iframe' )
.should( 'have.attr', 'src', 'https://example.com' )
.should( 'be.visible' );
} );

it( 'CTB iframe dynamic sizing works', () => {
// CTB iframe dynamic sizing works

// Mock the 'frameWidth' and 'frameHeight' message events
cy.window().then( ( win ) => {
// 'frameWidth' event
Expand All @@ -103,9 +111,8 @@ describe( 'Click to buy', function () {
cy.get( '.global-ctb-modal-content iframe' )
.should( 'have.css', 'width', '800px' )
.and( 'have.css', 'height', '600px' );
} );

it( 'X button closes CTB modal', () => {
// X button closes CTB modal
// check that cancel button closes modal
cy.get( '.global-ctb-modal-close' ).click( { force: true } );
cy.wait( 200 );
Expand All @@ -119,28 +126,32 @@ describe( 'Click to buy', function () {
} );

it( 'CTB fallback is functional', () => {
cy.intercept(
{
method: 'GET',
url: /newfold-ctb(\/|%2F)v2(\/|%2F)ctb/,
},
{
statusCode: 500,
}
setCapability( { canAccessGlobalCTB: false } );
cy.visit(
'/wp-admin/admin.php?page=' +
Cypress.env( 'pluginId' ) +
'#/marketplace'
);

cy.get( 'body' ).should( 'not.have.class', 'noscroll' );

cy.get( '[data-action="load-nfd-ctb"]' ).scrollIntoView().click();

// wait for intercept
cy.wait( 1000 );
cy.get( '#marketplace-item-a1ff70f1-9670-4e25-a0e1-a068d3e43a45' )
.scrollIntoView()
.should( 'exist' )
.should( 'be.visible' );
cy.get( '.nfd-button--primary[data-action="load-nfd-ctb"]' )
.should(
'have.attr',
'href',
'https://yoa.st/bh-premium?utm_source=wp-admin%2Fadmin.php&utm_medium=brand_plugin'
)
.click();

// confirm modal is closed
// confirm modal is still closed
cy.get( 'body' ).should( 'not.have.class', 'noscroll' );
cy.get( '#nfd-global-ctb-container' )
.should( 'have.attr', 'aria-hidden' )
.and( 'equal', 'true' );
cy.get( '.global-ctb-modal-content' ).should( 'not.be.visible' );
cy.get( '.global-ctb-modal-content' ).should( 'not.exist' );
} );
} );
51 changes: 51 additions & 0 deletions tests/cypress/wp-module-support/utils.cy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
/**
* Loginto WordPress.
*/
export const wpLogin = () => {
cy.login( Cypress.env( 'wpUsername' ), Cypress.env( 'wpPassword' ) );
};

/**
* wp-cli helper
*
* This wraps the command in the required npx wp-env run cli wp
*
* @param {string} cmd the command to send to wp-cli
* @param {Object} paramArgs any args to pass to exec
*/
export const wpCli = ( cmd, paramArgs ) => {
const defaultArgs = {
env: {
NODE_TLS_REJECT_UNAUTHORIZED: '1',
},
failOnNonZeroExit: true,
};
const args = { ...defaultArgs, ...paramArgs };
cy.exec( `npx wp-env run cli wp ${ cmd }`, args ).then( ( result ) => {
for ( const [ key, value ] of Object.entries( result ) ) {
cy.log( `${ key }: ${ value }` );
}
} );
};

/**
* Set capability helper
*
* This calls performs a cli command to set a specific capability
*
* @param {*} capJSON json of capabilities
* @param {number} expiration seconds for transient to expire, defualt 3600 (1 hour)
*/
export const setCapability = ( capJSON, expiration = 3600 ) => {
wpCli(
`option update _transient_nfd_site_capabilities '${ JSON.stringify(
capJSON
) }' --format=json`
);
// set transient expiration to one hour (default) from now
const expiry = Math.floor( new Date().getTime() / 1000.0 ) + expiration;
// manually set expiration for the transients
wpCli(
`option update _transient_timeout_nfd_site_capabilities ${ expiry }`
);
};

0 comments on commit d422d12

Please sign in to comment.