2023-06-01 11:51:59 +00:00
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*/
|
2023-06-27 10:01:38 +00:00
|
|
|
import { Page } from '@playwright/test';
|
2023-06-01 11:51:59 +00:00
|
|
|
import { Editor } from '@wordpress/e2e-test-utils-playwright';
|
2023-06-27 10:01:38 +00:00
|
|
|
import { BlockRepresentation } from '@wordpress/e2e-test-utils-playwright/build-types/editor/insert-block';
|
2023-06-01 11:51:59 +00:00
|
|
|
/**
|
|
|
|
* Internal dependencies
|
|
|
|
*/
|
|
|
|
|
|
|
|
export class EditorUtils {
|
|
|
|
editor: Editor;
|
2023-06-27 10:01:38 +00:00
|
|
|
page: Page;
|
|
|
|
constructor( editor: Editor, page: Page ) {
|
2023-06-01 11:51:59 +00:00
|
|
|
this.editor = editor;
|
2023-06-27 10:01:38 +00:00
|
|
|
this.page = page;
|
2023-06-01 11:51:59 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
async getBlockByName( name: string ) {
|
|
|
|
return this.editor.canvas.locator( `[data-type="${ name }"]` );
|
|
|
|
}
|
2023-06-27 10:01:38 +00:00
|
|
|
|
|
|
|
// todo: Make a PR to @wordpress/e2e-test-utils-playwright to add this method.
|
|
|
|
/**
|
|
|
|
* Inserts a block after a given client ID.
|
|
|
|
*
|
|
|
|
*/
|
|
|
|
async insertBlock(
|
|
|
|
blockRepresentation: BlockRepresentation,
|
|
|
|
index?: string,
|
|
|
|
rootClientId?: string
|
|
|
|
) {
|
|
|
|
await this.page.evaluate(
|
|
|
|
( {
|
|
|
|
blockRepresentation: _blockRepresentation,
|
|
|
|
index: _index,
|
|
|
|
rootClientId: _rootClientId,
|
|
|
|
} ) => {
|
|
|
|
function recursiveCreateBlock( {
|
|
|
|
name,
|
|
|
|
attributes = {},
|
|
|
|
innerBlocks = [],
|
|
|
|
}: BlockRepresentation ): BlockRepresentation {
|
|
|
|
return window.wp.blocks.createBlock(
|
|
|
|
name,
|
|
|
|
attributes,
|
|
|
|
innerBlocks.map( ( innerBlock ) =>
|
|
|
|
recursiveCreateBlock( innerBlock )
|
|
|
|
)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
const block = recursiveCreateBlock( _blockRepresentation );
|
|
|
|
|
|
|
|
window.wp.data
|
|
|
|
.dispatch( 'core/block-editor' )
|
|
|
|
.insertBlock( block, _index, _rootClientId );
|
|
|
|
},
|
|
|
|
{ blockRepresentation, index, rootClientId }
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
async getBlockRootClientId( clientId: string ) {
|
|
|
|
return this.page.evaluate< string | null, string >( ( id ) => {
|
|
|
|
return window.wp.data
|
|
|
|
.select( 'core/block-editor' )
|
|
|
|
.getBlockRootClientId( id );
|
|
|
|
}, clientId );
|
|
|
|
}
|
2023-06-01 11:51:59 +00:00
|
|
|
}
|