Skip to content

Commit

Permalink
Merge pull request #2521 from woocommerce/update/2487-hide-jetpack-e2…
Browse files Browse the repository at this point in the history 
…e-tests

Update e2e tests for #2487
  • Loading branch information
@dsawardekar
dsawardekar authored Aug 14, 2024
2 parents e2f2420 + 7523a05 commit 9e606c1
Show file tree
Hide file tree
Showing 2 changed files with 75 additions and 93 deletions.
68 changes: 35 additions & 33 deletions tests/e2e/specs/setup-mc/step-1-accounts.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,28 +79,6 @@ test.describe( 'Set up accounts', () => {
await expect( continueButton ).toBeDisabled();
} );

test( 'JetpackConnected: should verify that the Jetpack connect button is hidden if already connected', async () => {
await setUpAccountsPage.goto();

await expect(
page.getByRole( 'heading', { name: 'Set up your accounts' } )
).toBeVisible();

await expect(
page.getByText(
'Connect the accounts required to use Google for WooCommerce.'
)
).toBeVisible();

await expect(
page.getByRole( 'button', { name: 'Connect' } ).first()
).toBeEnabled();

const firstCard = setUpAccountsPage.getWPAccountCard();
await expect( firstCard ).toBeEnabled();
await expect( firstCard ).not.toContainText( 'WordPress.com' );
} );

test.describe( 'FAQ panels', () => {
test( 'should see two questions in FAQ', async () => {
const faqTitles = getFAQPanelTitle( page );
Expand Down Expand Up @@ -138,7 +116,7 @@ test.describe( 'Set up accounts', () => {
} );
} );

test.describe( 'Connect Google account', () => {
test.describe( 'Connected WordPress.com account', async () => {
test.beforeAll( async () => {
// Mock Jetpack as connected
await setUpAccountsPage.mockJetpackConnected(
Expand All @@ -155,14 +133,44 @@ test.describe( 'Set up accounts', () => {
await setUpAccountsPage.goto();
} );

test( 'should see their WPORG email, "Google" title & connect button', async () => {
const jetpackDescriptionRow =
setUpAccountsPage.getJetpackDescriptionRow();
test( 'should not show the WP.org connection card when already connected', async () => {
await expect(
page.getByRole( 'heading', { name: 'Set up your accounts' } )
).toBeVisible();

await expect(
page.getByText(
'Connect the accounts required to use Google for WooCommerce.'
)
).toBeVisible();

await expect( jetpackDescriptionRow ).toContainText(
await expect(
page.getByRole( 'button', { name: 'Connect' } ).first()
).toBeEnabled();

const wpAccountCard = setUpAccountsPage.getWPAccountCard();
await expect( wpAccountCard ).not.toBeVisible();
} );
} );

test.describe( 'Connect Google account', () => {
test.beforeAll( async () => {
// Mock Jetpack as connected
await setUpAccountsPage.mockJetpackConnected(
'Test user',
'[email protected]'
);

// Mock google as not connected.
// When pending even WPORG will not render yet.
// If not mocked will fail and render nothing,
// as Jetpack is mocked only on the client-side.
await setUpAccountsPage.mockGoogleNotConnected();

await setUpAccountsPage.goto();
} );

test( 'should see their WPORG email, "Google" title & connect button', async () => {
const googleAccountCard = setUpAccountsPage.getGoogleAccountCard();

await expect(
Expand Down Expand Up @@ -415,12 +423,6 @@ test.describe( 'Set up accounts', () => {
} );

test( 'should see their WPORG email, Google email, "Google Merchant Center" title & "Create account" button', async () => {
const jetpackDescriptionRow =
setUpAccountsPage.getJetpackDescriptionRow();
await expect( jetpackDescriptionRow ).toContainText(
'[email protected]'
);

const googleDescriptionRow =
setUpAccountsPage.getGoogleDescriptionRow();
await expect( googleDescriptionRow ).toContainText(
Expand Down
100 changes: 40 additions & 60 deletions tests/e2e/utils/pages/setup-mc/step-1-set-up-accounts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,31 +69,15 @@ export default class SetUpAccountsPage extends MockRequests {
return button.locator( ':scope.is-primary' );
}

/**
* Get .gla-account-card__title class.
*
* @return {import('@playwright/test').Locator} Get .gla-account-card__title class.
*/
getCardTitleClass() {
return this.page.locator( '.gla-account-card__title' );
}

/**
* Get .gla-account-card__description class.
*
* @return {import('@playwright/test').Locator} Get .gla-account-card__description class.
*/
getCardDescriptionClass() {
return this.page.locator( '.gla-account-card__description' );
}

/**
* Get Jetpack description row.
*
* @return {import('@playwright/test').Locator} Get Jetpack description row.
*/
getJetpackDescriptionRow() {
return this.getCardDescriptionClass().first();
return this.getWPAccountCard().locator(
'.gla-account-card__description'
);
}

/**
Expand All @@ -102,7 +86,9 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google description row.
*/
getGoogleDescriptionRow() {
return this.getCardDescriptionClass().nth( 1 );
return this.getGoogleAccountCard().locator(
'.gla-account-card__description'
);
}

/**
Expand All @@ -111,7 +97,9 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Merchant Center description row.
*/
getMCDescriptionRow() {
return this.getCardDescriptionClass().nth( 3 );
return this.getMCAccountCard().locator(
'.gla-account-card__description'
);
}

/**
Expand All @@ -120,7 +108,9 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google Ads title.
*/
getAdsTitleRow() {
return this.getCardTitleClass().nth( 2 );
return this.getGoogleAdsAccountCard().locator(
'.gla-account-card__title'
);
}

/**
Expand All @@ -129,7 +119,7 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google Merchant Center title.
*/
getMCTitleRow() {
return this.getCardTitleClass().nth( 3 );
return this.getMCAccountCard().locator( '.gla-account-card__title' );
}

/**
Expand Down Expand Up @@ -177,22 +167,13 @@ export default class SetUpAccountsPage extends MockRequests {
return this.getModal().locator( 'button.is-secondary' );
}

/**
* Get .gla-connected-icon-label class.
*
* @return {import('@playwright/test').Locator} Get .gla-connected-icon-label class.
*/
getConnectedLabelClass() {
return this.page.locator( '.gla-connected-icon-label' );
}

/**
* Get Jetpack connected label.
*
* @return {import('@playwright/test').Locator} Get Jetpack connected label.
*/
getJetpackConnectedLabel() {
return this.getConnectedLabelClass().first();
return this.getWPAccountCard().locator( '.gla-connected-icon-label' );
}

/**
Expand All @@ -201,7 +182,9 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google connected label.
*/
getGoogleConnectedLabel() {
return this.getConnectedLabelClass().nth( 1 );
return this.getGoogleAccountCard().locator(
'.gla-connected-icon-label'
);
}

/**
Expand All @@ -210,7 +193,7 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Merchant Center connected label.
*/
getMCConnectedLabel() {
return this.getConnectedLabelClass().nth( 2 );
return this.getMCAccountCard().locator( '.gla-connected-icon-label' );
}

/**
Expand Down Expand Up @@ -246,31 +229,15 @@ export default class SetUpAccountsPage extends MockRequests {
return this.page.locator( 'input#inspector-input-control-0' );
}

/**
* Get sub section title row.
*
* @return {import('@playwright/test').Locator} Get sub section title row.
*/
getSubSectionTitleRow() {
return this.page.locator( '.wcdl-subsection-title' );
}

/**
* Get section footer row.
*
* @return {import('@playwright/test').Locator} Get section footer row.
*/
getSectionFooterRow() {
return this.page.locator( '.wcdl-section-card-footer' );
}

/**
* Get select existing Merchant Center account title.
*
* @return {import('@playwright/test').Locator} Get select existing Merchant Center account title.
*/
getSelectExistingMCAccountTitle() {
return this.getSubSectionTitleRow().nth( 4 );
return this.getMCAccountCard()
.locator( '.wcdl-subsection-title' )
.nth( 1 );
}

/**
Expand All @@ -297,10 +264,11 @@ export default class SetUpAccountsPage extends MockRequests {
/**
* Get account cards.
*
* @param {Object} options
* @return {import('@playwright/test').Locator} Get account cards.
*/
getAccountCards() {
return this.page.locator( '.gla-account-card' );
getAccountCards( options = {} ) {
return this.page.locator( '.gla-account-card', options );
}

/**
Expand All @@ -309,7 +277,7 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get WordPress account card.
*/
getWPAccountCard() {
return this.getAccountCards().first();
return this.getAccountCards( { hasText: 'WordPress.com' } ).first();
}

/**
Expand All @@ -318,7 +286,11 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google account card.
*/
getGoogleAccountCard() {
return this.getAccountCards().nth( 1 );
return this.getAccountCards( {
has: this.page.locator( '.gla-account-card__title', {
hasText: 'Google',
} ),
} ).first();
}

/**
Expand All @@ -327,7 +299,11 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Google Ads account card.
*/
getGoogleAdsAccountCard() {
return this.getAccountCards().nth( 2 );
return this.getAccountCards( {
has: this.page.locator( '.gla-account-card__title', {
hasText: 'Google Ads',
} ),
} ).first();
}

/**
Expand All @@ -336,7 +312,11 @@ export default class SetUpAccountsPage extends MockRequests {
* @return {import('@playwright/test').Locator} Get Merchant Center account card.
*/
getMCAccountCard() {
return this.getAccountCards().nth( 3 );
return this.getAccountCards( {
has: this.page.locator( '.gla-account-card__title', {
hasText: 'Google Merchant Center',
} ),
} ).first();
}

/**
Expand Down

0 comments on commit 9e606c1

Please sign in to comment.