Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update cypress test with testIsolation true #21

Merged
merged 1 commit into from
Jan 7, 2025
Merged

Update cypress test with testIsolation true #21

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
95 changes: 53 additions & 42 deletions tests/cypress/integration/global-ctb.cy.js
View file
Open in desktop
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
View file
Open in desktop
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 }`
);
};
Loading