[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:
parent
9f79715d06
commit
98aebdfcc7
|
@ -0,0 +1,4 @@
|
|||
Significance: patch
|
||||
Type: update
|
||||
|
||||
Update /customize-store tests, so they are passing against Pressable env.
|
|
@ -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/,
|
||||
},
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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 );
|
||||
}
|
||||
);
|
||||
} );
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
);
|
||||
} );
|
||||
|
|
|
@ -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();
|
||||
} );
|
||||
|
|
|
@ -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' );
|
||||
}
|
||||
);
|
||||
}
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue