Skip to content

Commit

Permalink
Use preview instead of publishing post in block bindings tests (WordP…
Browse files Browse the repository at this point in the history 
…ress#62235)

* Use `openPreviewPage` instead of `publishPost`

* Remove unused `BlockBindingsUtils`

Co-authored-by: SantosGuillamot <[email protected]>
Co-authored-by: artemiomorales <[email protected]>
Co-authored-by: cbravobernal <[email protected]>
  • Loading branch information
@SantosGuillamot @artemiomorales @cbravobernal
4 people authored Jun 7, 2024
1 parent d90814b commit 9b1c970
Showing 1 changed file with 46 additions and 97 deletions.
143 changes: 46 additions & 97 deletions test/e2e/specs/editor/various/block-bindings.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,12 +30,6 @@ test.describe( 'Block bindings', () => {
await requestUtils.deactivatePlugin( 'gutenberg-test-block-bindings' );
} );

test.use( {
BlockBindingsUtils: async ( { editor, page, pageUtils }, use ) => {
await use( new BlockBindingsUtils( { editor, page, pageUtils } ) );
},
} );

test.describe( 'Template context', () => {
test.beforeEach( async ( { admin, editor } ) => {
await admin.visitSiteEditor( {
Expand Down Expand Up @@ -1170,7 +1164,6 @@ test.describe( 'Block bindings', () => {
test.describe( 'Paragraph', () => {
test( 'should show the value of the custom field when exists', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
Expand All @@ -1195,19 +1188,14 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const previewPage = await editor.openPreviewPage();
await expect(
page.locator( '#paragraph-binding' )
).toBeVisible();
await expect( page.locator( '#paragraph-binding' ) ).toHaveText(
'Value of the text_custom_field'
);
previewPage.locator( '#paragraph-binding' )
).toHaveText( 'Value of the text_custom_field' );
} );

test( "should show the value of the key when custom field doesn't exist", async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
Expand Down Expand Up @@ -1237,16 +1225,14 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend doesn't show the content.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect( page.locator( '#paragraph-binding' ) ).toHaveText(
'fallback value'
);
const previewPage = await editor.openPreviewPage();
await expect(
previewPage.locator( '#paragraph-binding' )
).toHaveText( 'fallback value' );
} );

test( 'should not show the value of a protected meta field', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
Expand All @@ -1268,16 +1254,14 @@ test.describe( 'Block bindings', () => {
} );
await expect( paragraphBlock ).toHaveText( '_protected_field' );
// Check the frontend doesn't show the content.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect( page.locator( '#paragraph-binding' ) ).toHaveText(
'fallback value'
);
const previewPage = await editor.openPreviewPage();
await expect(
previewPage.locator( '#paragraph-binding' )
).toHaveText( 'fallback value' );
} );

test( 'should not show the value of a meta field with `show_in_rest` false', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
Expand All @@ -1301,11 +1285,10 @@ test.describe( 'Block bindings', () => {
'show_in_rest_false_field'
);
// Check the frontend doesn't show the content.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect( page.locator( '#paragraph-binding' ) ).toHaveText(
'fallback value'
);
const previewPage = await editor.openPreviewPage();
await expect(
previewPage.locator( '#paragraph-binding' )
).toHaveText( 'fallback value' );
} );

test( 'should add empty paragraph block when pressing enter', async ( {
Expand Down Expand Up @@ -1412,7 +1395,6 @@ test.describe( 'Block bindings', () => {
test.describe( 'Heading', () => {
test( 'should show the value of the custom field', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/heading',
Expand All @@ -1437,14 +1419,10 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const previewPage = await editor.openPreviewPage();
await expect(
page.locator( '#heading-binding' )
).toBeVisible();
await expect( page.locator( '#heading-binding' ) ).toHaveText(
'Value of the text_custom_field'
);
previewPage.locator( '#heading-binding' )
).toHaveText( 'Value of the text_custom_field' );
} );

test( 'should add empty paragraph block when pressing enter', async ( {
Expand Down Expand Up @@ -1498,7 +1476,6 @@ test.describe( 'Block bindings', () => {
test.describe( 'Button', () => {
test( 'should show the value of the custom field when text is bound', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
Expand Down Expand Up @@ -1533,10 +1510,10 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-text-binding a' );
await expect( buttonDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const buttonDom = previewPage.locator(
'#button-text-binding a'
);
await expect( buttonDom ).toHaveText(
'Value of the text_custom_field'
);
Expand All @@ -1548,7 +1525,6 @@ test.describe( 'Block bindings', () => {

test( 'should use the value of the custom field when url is bound', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
Expand All @@ -1573,10 +1549,10 @@ test.describe( 'Block bindings', () => {
} );

// Check the frontend shows the original value of the custom field.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-url-binding a' );
await expect( buttonDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const buttonDom = previewPage.locator(
'#button-url-binding a'
);
await expect( buttonDom ).toHaveText( 'button default text' );
await expect( buttonDom ).toHaveAttribute(
'href',
Expand All @@ -1586,7 +1562,6 @@ test.describe( 'Block bindings', () => {

test( 'should use the values of the custom fields when text and url are bound', async ( {
editor,
page,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
Expand Down Expand Up @@ -1615,10 +1590,10 @@ test.describe( 'Block bindings', () => {
} );

// Check the frontend uses the values of the custom fields.
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-multiple-bindings a' );
await expect( buttonDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const buttonDom = previewPage.locator(
'#button-multiple-bindings a'
);
await expect( buttonDom ).toHaveText(
'Value of the text_custom_field'
);
Expand Down Expand Up @@ -1701,8 +1676,6 @@ test.describe( 'Block bindings', () => {
} );
test( 'should show the value of the custom field when url is bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/image',
Expand Down Expand Up @@ -1732,10 +1705,10 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend uses the value of the custom field.
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-url-binding img' );
await expect( imageDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const imageDom = previewPage.locator(
'#image-url-binding img'
);
await expect( imageDom ).toHaveAttribute(
'src',
imageCustomFieldSrc
Expand All @@ -1753,7 +1726,6 @@ test.describe( 'Block bindings', () => {
test( 'should show value of the custom field in the alt textarea when alt is bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/image',
Expand Down Expand Up @@ -1793,10 +1765,10 @@ test.describe( 'Block bindings', () => {
expect( altValue ).toBe( 'Value of the text_custom_field' );

// Check the frontend uses the value of the custom field.
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-alt-binding img' );
await expect( imageDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const imageDom = previewPage.locator(
'#image-alt-binding img'
);
await expect( imageDom ).toHaveAttribute(
'src',
imagePlaceholderSrc
Expand All @@ -1814,7 +1786,6 @@ test.describe( 'Block bindings', () => {
test( 'should show value of the custom field in the title input when title is bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/image',
Expand Down Expand Up @@ -1864,10 +1835,10 @@ test.describe( 'Block bindings', () => {
expect( titleValue ).toBe( 'Value of the text_custom_field' );

// Check the frontend uses the value of the custom field.
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-title-binding img' );
await expect( imageDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const imageDom = previewPage.locator(
'#image-title-binding img'
);
await expect( imageDom ).toHaveAttribute(
'src',
imagePlaceholderSrc
Expand All @@ -1885,7 +1856,6 @@ test.describe( 'Block bindings', () => {
test( 'Multiple bindings should show the value of the custom fields', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/image',
Expand Down Expand Up @@ -1946,10 +1916,10 @@ test.describe( 'Block bindings', () => {
expect( titleValue ).toBe( 'default title value' );

// Check the frontend uses the values of the custom fields.
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-multiple-bindings img' );
await expect( imageDom ).toBeVisible();
const previewPage = await editor.openPreviewPage();
const imageDom = previewPage.locator(
'#image-multiple-bindings img'
);
await expect( imageDom ).toHaveAttribute(
'src',
imageCustomFieldSrc
Expand Down Expand Up @@ -2168,24 +2138,3 @@ test.describe( 'Block bindings', () => {
} );
} );
} );

class BlockBindingsUtils {
constructor( { page } ) {
this.page = page;
}

// Helper to update the post.
async updatePost() {
await this.page
.getByRole( 'region', { name: 'Editor top bar' } )
.getByRole( 'button', { name: 'Save' } )
.click();
await this.page
.getByRole( 'button', { name: 'Dismiss this notice' } )
.filter( { hasText: 'updated' } )
.waitFor();
const postId = new URL( this.page.url() ).searchParams.get( 'post' );

return typeof postId === 'string' ? parseInt( postId, 10 ) : null;
}
}

0 comments on commit 9b1c970

Please sign in to comment.