Skip to content

Commit

Permalink
Pass id directly in the block insertion
Browse files Browse the repository at this point in the history
  • Loading branch information
SantosGuillamot committed Feb 7, 2024
1 parent eeffb21 commit e697db0
Showing 1 changed file with 14 additions and 38 deletions.
52 changes: 14 additions & 38 deletions test/e2e/specs/editor/various/block-bindings.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -250,7 +250,7 @@ test.describe( 'Block bindings', () => {
name: 'Block: Button',
exact: true,
} )
.locator( 'div' );
.getByRole( 'textbox' );
await buttonBlock.click();

// Alignment controls exist.
Expand Down Expand Up @@ -312,7 +312,7 @@ test.describe( 'Block bindings', () => {
name: 'Block: Button',
exact: true,
} )
.locator( 'div' );
.getByRole( 'textbox' );
await buttonBlock.click();

// Format controls exist.
Expand Down Expand Up @@ -376,7 +376,7 @@ test.describe( 'Block bindings', () => {
name: 'Block: Button',
exact: true,
} )
.locator( 'div' );
.getByRole( 'textbox' );
await buttonBlock.click();

// Alignment controls are visible.
Expand Down Expand Up @@ -734,11 +734,11 @@ test.describe( 'Block bindings', () => {
test( 'Should show the value of the custom field when exists', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
attributes: {
anchor: 'paragraph-binding',
content: 'paragraph default content',
metadata: {
bindings: {
Expand All @@ -763,7 +763,6 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
await BlockBindingsUtils.setId( 'paragraph-binding' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect(
Expand All @@ -777,11 +776,11 @@ test.describe( 'Block bindings', () => {
test( "Should show the value of the key when custom field doesn't exists", async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/paragraph',
attributes: {
anchor: 'paragraph-binding',
content: 'p',
metadata: {
bindings: {
Expand All @@ -806,7 +805,6 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend doesn't show the content.
await BlockBindingsUtils.setId( 'paragraph-binding' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect(
Expand All @@ -818,11 +816,11 @@ test.describe( 'Block bindings', () => {
test( 'Heading - should show the value of the custom field', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/heading',
attributes: {
anchor: 'heading-binding',
content: 'heading default content',
metadata: {
bindings: {
Expand All @@ -847,7 +845,6 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
await BlockBindingsUtils.setId( 'heading-binding' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
await expect( page.locator( '#heading-binding' ) ).toBeVisible();
Expand All @@ -860,14 +857,14 @@ test.describe( 'Block bindings', () => {
test( 'Should show the value of the custom field when text is bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
innerBlocks: [
{
name: 'core/button',
attributes: {
anchor: 'button-text-binding',
text: 'button default text',
url: '#default-url',
metadata: {
Expand All @@ -887,7 +884,7 @@ test.describe( 'Block bindings', () => {
name: 'Block: Button',
exact: true,
} )
.locator( 'div' );
.getByRole( 'textbox' );
await buttonBlock.click();
await expect( buttonBlock ).toHaveText(
'Value of the text_custom_field'
Expand All @@ -900,7 +897,6 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend shows the value of the custom field.
await BlockBindingsUtils.setId( 'button-text-binding' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-text-binding a' );
Expand All @@ -917,14 +913,14 @@ test.describe( 'Block bindings', () => {
test( 'Should use the value of the custom field when url is bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
innerBlocks: [
{
name: 'core/button',
attributes: {
anchor: 'button-url-binding',
text: 'button default text',
url: '#default-url',
metadata: {
Expand All @@ -941,7 +937,6 @@ test.describe( 'Block bindings', () => {
} );

// Check the frontend shows the original value of the custom field.
await BlockBindingsUtils.setId( 'button-url-binding' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-url-binding a' );
Expand All @@ -956,14 +951,14 @@ test.describe( 'Block bindings', () => {
test( 'Should use the values of the custom fields when text and url are bound', async ( {
editor,
page,
BlockBindingsUtils,
} ) => {
await editor.insertBlock( {
name: 'core/buttons',
innerBlocks: [
{
name: 'core/button',
attributes: {
anchor: 'button-multiple-bindings',
text: 'button default text',
url: '#default-url',
metadata: {
Expand All @@ -984,7 +979,6 @@ test.describe( 'Block bindings', () => {
} );

// Check the frontend uses the values of the custom fields.
await BlockBindingsUtils.setId( 'button-multiple-bindings' );
const postId = await editor.publishPost();
await page.goto( `/?p=${ postId }` );
const buttonDom = page.locator( '#button-multiple-bindings a' );
Expand Down Expand Up @@ -1031,6 +1025,7 @@ test.describe( 'Block bindings', () => {
await editor.insertBlock( {
name: 'core/image',
attributes: {
anchor: 'image-url-binding',
url: imagePlaceholderSrc,
alt: 'default alt value',
title: 'default title value',
Expand All @@ -1055,7 +1050,6 @@ test.describe( 'Block bindings', () => {
);

// Check the frontend uses the value of the custom field.
await BlockBindingsUtils.setId( 'image-url-binding' );
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-url-binding img' );
Expand All @@ -1082,6 +1076,7 @@ test.describe( 'Block bindings', () => {
await editor.insertBlock( {
name: 'core/image',
attributes: {
anchor: 'image-alt-binding',
url: imagePlaceholderSrc,
alt: 'default alt value',
title: 'default title value',
Expand Down Expand Up @@ -1121,7 +1116,6 @@ test.describe( 'Block bindings', () => {
expect( altValue ).toBe( 'Value of the text_custom_field' );

// Check the frontend uses the value of the custom field.
await BlockBindingsUtils.setId( 'image-alt-binding' );
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-alt-binding img' );
Expand All @@ -1148,6 +1142,7 @@ test.describe( 'Block bindings', () => {
await editor.insertBlock( {
name: 'core/image',
attributes: {
anchor: 'image-title-binding',
url: imagePlaceholderSrc,
alt: 'default alt value',
title: 'default title value',
Expand Down Expand Up @@ -1197,7 +1192,6 @@ test.describe( 'Block bindings', () => {
expect( titleValue ).toBe( 'Value of the text_custom_field' );

// Check the frontend uses the value of the custom field.
await BlockBindingsUtils.setId( 'image-title-binding' );
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-title-binding img' );
Expand All @@ -1224,6 +1218,7 @@ test.describe( 'Block bindings', () => {
await editor.insertBlock( {
name: 'core/image',
attributes: {
anchor: 'image-multiple-bindings',
url: imagePlaceholderSrc,
alt: 'default alt value',
title: 'default title value',
Expand Down Expand Up @@ -1289,7 +1284,6 @@ test.describe( 'Block bindings', () => {
expect( titleValue ).toBe( 'default title value' );

// Check the frontend uses the values of the custom fields.
await BlockBindingsUtils.setId( 'image-multiple-bindings' );
const postId = await BlockBindingsUtils.updatePost();
await page.goto( `/?p=${ postId }` );
const imageDom = page.locator( '#image-multiple-bindings img' );
Expand All @@ -1316,24 +1310,6 @@ class BlockBindingsUtils {
this.page = page;
}

// Helper to add an anchor/id to be able to locate the block in the frontend.
async setId( testId ) {
const isAdvancedPanelOpen = await this.page
.getByRole( 'tabpanel', { name: 'Block' } )
.getByRole( 'button', { name: 'Advanced' } )
.getAttribute( 'aria-expanded' );
if ( isAdvancedPanelOpen === 'false' ) {
await this.page
.getByRole( 'tabpanel', { name: 'Block' } )
.getByRole( 'button', { name: 'Advanced' } )
.click();
}
await this.page
.getByRole( 'tabpanel', { name: 'Block' } )
.getByLabel( 'HTML anchor' )
.fill( testId );
}

// Helper to update the post.
async updatePost() {
await this.page
Expand Down

0 comments on commit e697db0

Please sign in to comment.