Migrate Block Switcher Test case to Playwright #50845
Conversation
pavanpatil1
requested review from
kevin940726,
ntwb,
nerrad and
ajitbohra
as code owners
pavanpatil1
changed the title
juanfra
added
the
[Type] Automated Testing
|
Hi @pavanpatil1! This is still on my backlog but I'm currently busy with something else. I'll get back to this as soon as possible! Thanks for the PR! |
| await pageUtils.pressKeys( 'alt+F10' ); | ||
|
|
||
| // Verify the block switcher exists. | ||
| expect( page.locator( 'role=button[name="List"i]' ) ).toBeTruthy(); |
There was a problem hiding this comment.
A locator is always truthy. Let's try toBeVisible() instead? We can also scope it under the block toolbar.
| expect( page.locator( 'role=button[name="List"i]' ) ).toBeTruthy(); | |
| const blockToolbar = page.getByRole( 'toolbar', { name: 'Block tools' } ); | |
| await expect( blockToolbar.getByRole( 'button', { name: 'List' } ) ) ).toBeVisible(); |
|
|
||
| // Remove the quote block from the list of registered blocks. | ||
| await page.evaluate( () => { | ||
| wp.blocks.unregisterBlockType( 'core/quote' ); |
There was a problem hiding this comment.
We can do window.wp here so we don't need the wp const above.
| await pageUtils.pressKeys( 'alt+F10' ); | ||
|
|
||
| // Verify the block switcher exists. | ||
| expect( page.locator( 'role=button[name="List"i]' ) ).toBeTruthy(); |
| pageUtils, | ||
| } ) => { | ||
| const wp = ''; | ||
| async function getAvailableBlockTransforms() { |
There was a problem hiding this comment.
Why not use the function from the utils below?
| await pageUtils.pressKeys( 'alt+F10' ); | ||
|
|
||
| // Remove the paragraph and quote block from the list of registered blocks. | ||
| await page.evaluate( () => { |
There was a problem hiding this comment.
This is executed before the key press in the original test. I think we should follow the original behavior :).
| // Verify the block switcher exists. | ||
| expect( | ||
| page.locator( | ||
| '.block-editor-block-toolbar .block-editor-block-switcher' |
| await this.page.click( 'role=button[name="List"i]' ); | ||
| return this.page.evaluate( ( buttonSelector ) => { | ||
| return Array.from( | ||
| document.querySelectorAll( buttonSelector ) | ||
| ).map( ( button ) => { | ||
| return button.textContent; | ||
| } ); | ||
| }, '.block-editor-block-switcher__popover .block-editor-block-switcher__transforms__menugroup button' ); | ||
| } |
There was a problem hiding this comment.
We can rewrite this into accessible selectors:
await this.getBlockSwitcher( blockName ).click();
return await this.page.getByRole( 'menu', { name: blockName } )
.getByRole( 'menuitem' )
.allTextContents();I left out the implementation of getBlockSwitcher here though. Feel free to ask questions if it's not clear!
|
Migrated via #57381. |
What?
Part of #38851.
Migrate block-switcher.test.js to its Playwright version.
Why?
Part of #38851.
How?
See MIGRATION.md for migration steps.
Testing Instructions
Run
npm run test:e2e:playwright test/e2e/specs/editor/various/block-switcher.spec.js