[e2e tests] External sites - update /customize-store tests (#51004)

* Skip - number of introductory patterns not same on Pressable

* Skip - "Want more patterns?" is always present, skipping for now

* Skip -  it activates theme through CLI, don't work for Pressable

* Include /customize-store folder for Pressable execution

* Update month formatting

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Adrian Moldovan <3854374+adimoldovan@users.noreply.github.com>
This commit is contained in:
Ivan Stojadinov 2024-08-28 13:03:33 +02:00 committed by GitHub
parent 9f79715d06
commit 98aebdfcc7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 166 additions and 152 deletions

View File

@ -0,0 +1,4 @@
Significance: patch
Type: update
Update /customize-store tests, so they are passing against Pressable env.

View File

@ -15,6 +15,7 @@ config = {
'**/admin-analytics/**/*.spec.js',
'**/admin-marketing/**/*.spec.js',
'**/admin-tasks/**/*.spec.js',
'**/customize-store/**/*.spec.js',
],
grepInvert: /@skip-on-default-pressable/,
},

View File

@ -412,105 +412,105 @@ test.describe( 'Assembler -> Color Pickers', { tag: '@gutenberg' }, () => {
await expect( colorPicker ).toHaveClass( /is-active/ );
} );
test( 'Selected color palette should be applied on the frontend', async ( {
assemblerPageObject,
page,
baseURL,
} ) => {
const assembler = await assemblerPageObject.getAssembler();
const colorPicker = assembler
.locator(
'.woocommerce-customize-store_global-styles-variations_item'
)
.last();
test(
'Selected color palette should be applied on the frontend',
{ tag: '@skip-on-default-pressable' },
async ( { assemblerPageObject, page, baseURL } ) => {
const assembler = await assemblerPageObject.getAssembler();
const colorPicker = assembler
.locator(
'.woocommerce-customize-store_global-styles-variations_item'
)
.last();
await colorPicker.click();
await colorPicker.click();
await assembler.locator( '[aria-label="Back"]' ).click();
await assembler.locator( '[aria-label="Back"]' ).click();
const saveButton = assembler.getByText( 'Finish customizing' );
const saveButton = assembler.getByText( 'Finish customizing' );
const waitResponseGlobalStyles = page.waitForResponse(
( response ) =>
response.url().includes( 'wp-json/wp/v2/global-styles' ) &&
response.status() === 200
);
const wordPressVersion = await getInstalledWordPressVersion();
await saveButton.click();
await Promise.all( [
waitResponseGlobalStyles,
wordPressVersion < 6.6
? page.waitForResponse(
( response ) =>
response.url().includes(
// When CYS will support all block themes, this URL will change.
'wp-json/wp/v2/templates/twentytwentyfour//home'
) && response.status() === 200
)
: Promise.resolve(),
] );
await page.goto( baseURL );
const paragraphs = await page
.locator(
'p.wp-block.wp-block-paragraph:not([aria-label="Empty block; start writing or type forward slash to choose a block"])'
)
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
const waitResponseGlobalStyles = page.waitForResponse(
( response ) =>
response.url().includes( 'wp-json/wp/v2/global-styles' ) &&
response.status() === 200
);
const buttons = await page
.locator( '.wp-block-button > .wp-block-button__link' )
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
);
const wordPressVersion = await getInstalledWordPressVersion();
const headers = await page
.locator( 'h1, h2, h3, h4, h5, h6' )
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
);
await saveButton.click();
for ( const element of buttons ) {
await expect( element.background ).toEqual(
colorPalette.Slate.button.background
);
await Promise.all( [
waitResponseGlobalStyles,
wordPressVersion < 6.6
? page.waitForResponse(
( response ) =>
response.url().includes(
// When CYS will support all block themes, this URL will change.
'wp-json/wp/v2/templates/twentytwentyfour//home'
) && response.status() === 200
)
: Promise.resolve(),
] );
await page.goto( baseURL );
const paragraphs = await page
.locator(
'p.wp-block.wp-block-paragraph:not([aria-label="Empty block; start writing or type forward slash to choose a block"])'
)
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
);
const buttons = await page
.locator( '.wp-block-button > .wp-block-button__link' )
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
);
const headers = await page
.locator( 'h1, h2, h3, h4, h5, h6' )
.evaluateAll( ( elements ) =>
elements.map( ( element ) => {
const style = window.getComputedStyle( element );
return {
background: style.backgroundColor,
color: style.color,
};
} )
);
for ( const element of buttons ) {
await expect( element.background ).toEqual(
colorPalette.Slate.button.background
);
}
for ( const element of paragraphs ) {
expect(
colorPalette.Slate.paragraph.color.includes( element.color )
).toBe( true );
}
for ( const element of headers ) {
expect(
colorPalette.Slate.header.color.includes( element.color )
).toBe( true );
}
}
for ( const element of paragraphs ) {
expect(
colorPalette.Slate.paragraph.color.includes( element.color )
).toBe( true );
}
for ( const element of headers ) {
expect(
colorPalette.Slate.header.color.includes( element.color )
).toBe( true );
}
} );
);
test( 'Create "your own" pickers should be visible', async ( {
assemblerPageObject,

View File

@ -343,32 +343,35 @@ test.describe( 'Assembler -> Full composability', { tag: '@gutenberg' }, () => {
await expect( defaultPattern ).toBeVisible();
} );
test( 'Clicking opt-in new patterns should be available', async ( {
pageObject,
baseURL,
} ) => {
await prepareAssembler( pageObject, baseURL );
const assembler = await pageObject.getAssembler();
test(
'Clicking opt-in new patterns should be available',
{ tag: '@skip-on-default-pressable' },
async ( { pageObject, baseURL } ) => {
await prepareAssembler( pageObject, baseURL );
const assembler = await pageObject.getAssembler();
await assembler.getByText( 'Usage tracking' ).click();
await expect(
assembler.getByText( 'Access more patterns' )
).toBeVisible();
await assembler.getByText( 'Usage tracking' ).click();
await expect(
assembler.getByText( 'Access more patterns' )
).toBeVisible();
await assembler.getByRole( 'button', { name: 'Opt in' } ).click();
await assembler.getByRole( 'button', { name: 'Opt in' } ).click();
await assembler
.getByText( 'Access more patterns' )
.waitFor( { state: 'hidden' } );
await assembler
.getByText( 'Access more patterns' )
.waitFor( { state: 'hidden' } );
const sidebarPattern = assembler.locator(
'.block-editor-block-patterns-list'
);
const sidebarPattern = assembler.locator(
'.block-editor-block-patterns-list'
);
await sidebarPattern.waitFor( { state: 'visible' } );
await sidebarPattern.waitFor( { state: 'visible' } );
await expect(
assembler.locator( '.block-editor-block-patterns-list__list-item' )
).toHaveCount( 10 );
} );
await expect(
assembler.locator(
'.block-editor-block-patterns-list__list-item'
)
).toHaveCount( 10 );
}
);
} );

View File

@ -314,22 +314,23 @@ test.describe( 'Homepage tracking banner', () => {
).toBeVisible();
} );
test( 'Should not show the "Want more patterns?" banner when tracking is allowed', async ( {
baseURL,
pageObject,
} ) => {
await setOption(
request,
baseURL,
'woocommerce_allow_tracking',
'yes'
);
test(
'Should not show the "Want more patterns?" banner when tracking is allowed',
{ tag: '@skip-on-default-pressable' },
async ( { baseURL, pageObject } ) => {
await setOption(
request,
baseURL,
'woocommerce_allow_tracking',
'yes'
);
await prepareAssembler( pageObject, baseURL );
await prepareAssembler( pageObject, baseURL );
const assembler = await pageObject.getAssembler();
await expect(
assembler.getByText( 'Want more patterns?' )
).toBeHidden();
} );
const assembler = await pageObject.getAssembler();
await expect(
assembler.getByText( 'Want more patterns?' )
).toBeHidden();
}
);
} );

View File

@ -235,9 +235,10 @@ test.describe( 'Assembler -> Logo Picker', { tag: '@gutenberg' }, () => {
// alternative way to verify new site icon on the site
// verifying site icon shown in the new tab is impossible in headless mode
const date = new Date();
const month = ( date.getMonth() + 1 ).toString().padStart( 2, '0' );
await expect(
page.goto(
`/wp-content/uploads/${ date.getFullYear() }/${ date.getMonth() }/image-03-100x100.png`
`/wp-content/uploads/${ date.getFullYear() }/${ month }/image-03-100x100.png`
)
).toBeTruthy();
} );

View File

@ -115,34 +115,38 @@ test.describe(
).toBeVisible();
} );
test( 'it shows the "non default block theme" banner when the theme is a block theme different than TT4', async ( {
page,
} ) => {
await activateTheme( 'twentytwentythree' );
test(
'it shows the "non default block theme" banner when the theme is a block theme different than TT4',
{ tag: '@skip-on-default-pressable' },
async ( { page } ) => {
await activateTheme( 'twentytwentythree' );
await page.goto( CUSTOMIZE_STORE_URL );
await page.goto( CUSTOMIZE_STORE_URL );
await expect( page.locator( 'h1' ) ).toHaveText(
'Customize your theme'
);
await expect(
page.getByRole( 'button', { name: 'Go to the Editor' } )
).toBeVisible();
} );
await expect( page.locator( 'h1' ) ).toHaveText(
'Customize your theme'
);
await expect(
page.getByRole( 'button', { name: 'Go to the Editor' } )
).toBeVisible();
}
);
test( 'clicking on "Go to the Customizer" with a classic theme should go to the customizer', async ( {
page,
} ) => {
await activateTheme( 'twentytwenty' );
test(
'clicking on "Go to the Customizer" with a classic theme should go to the customizer',
{ tag: '@skip-on-default-pressable' },
async ( { page } ) => {
await activateTheme( 'twentytwenty' );
await page.goto( CUSTOMIZE_STORE_URL );
await page.goto( CUSTOMIZE_STORE_URL );
await page
.getByRole( 'button', { name: 'Go to the Customizer' } )
.click();
await page
.getByRole( 'button', { name: 'Go to the Customizer' } )
.click();
await page.waitForNavigation();
await expect( page.url() ).toContain( 'customize.php' );
} );
await page.waitForNavigation();
await expect( page.url() ).toContain( 'customize.php' );
}
);
}
);