Migrate 'block editor keyboard shortcuts' e2e tests to Playwright #57422
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Co-authored-by: Alvi Tazwar <55917380+alvitazwar@users.noreply.github.com>
Mamaduka
added
the
[Type] Automated Testing
Mamaduka
requested review from
kevin940726,
ntwb,
nerrad and
ajitbohra
as code owners
Mamaduka
commented
Dec 28, 2023
| // Duplicate via keyboard. | ||
| await pageUtils.pressKeys( 'primaryShift+d' ); | ||
|
|
||
| await expect.poll( editor.getBlocks ).toMatchObject( [ |
There was a problem hiding this comment.
I'm not sure if it's an issue with the editor.getBlocks method or a bug in the editor, but after duplication, the newly inserted blocks content attribute is undefined.
I've omitted attributes in this test since it's only testing the event propagation via portals. I think it's worth to look into this separately.
P.S. The assertion works correctly if I insert another block.
Example test case
test( 'duplication test', async ( { editor, page, pageUtils } ) => {
await editor.canvas
.getByRole( 'button', { name: 'Add default block' } )
.click();
await page.keyboard.type( '1st' );
// Duplicate via keyboard.
await pageUtils.pressKeys( 'primaryShift+d' );
// Insert another block manually.
await page.keyboard.press( 'ArrowDown' );
await page.keyboard.press( 'Enter' );
await expect.poll( editor.getBlocks ).toMatchObject( [
{
name: 'core/paragraph',
attributes: { content: '1st' },
},
{
name: 'core/paragraph',
attributes: { content: '1st' },
},
{
name: 'core/paragraph',
attributes: { content: '' },
},
] );
} );
There was a problem hiding this comment.
I can't reproduce this. The content attribute is correctly showing for me 🤔 .
There was a problem hiding this comment.
Try removing the // Insert another block manually. part of the example test.
There was a problem hiding this comment.
I can reproduce this after re-pulling the latest trunk.
It seems like a side-effect of #43204. After duplication, they shared the same RichTextData content and triggered the loop-detection optimization of toMatchObject, and bailed out comparing it. I don't know why inserting a new block fixes it though.
There was a problem hiding this comment.
I guess we can add a check in editor.getBlocks() to automatically convert RichTextData to plain string for testing purposes.
|
Size Change: 0 B Total Size: 1.69 MB ℹ️ View Unchanged
|
Mamaduka
requested review from
WunderBart
and removed request for
ntwb,
ajitbohra and
nerrad
kevin940726
approved these changes
Dec 31, 2023
| */ | ||
| const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' ); | ||
|
|
||
| async function addTestParagraphBlocks( { editor, page } ) { |
There was a problem hiding this comment.
Nit: What do you think if we just use editor.setContent or createNewPost with the content option? If it's easier to manage focus this way then nvm.
There was a problem hiding this comment.
I forgot about the editor.setContent 😅 I think it should work; IIRC, the resetBlocks should focus on the last block, where these tests expect it.
There was a problem hiding this comment.
I was mistaken. The resetBlocks doesn't handle the focus; the replaceBlocks does. I guess we can update the setContent to focus on the last inserted block, but that's probably out of the scope of this PR.
| } ); | ||
| } | ||
|
|
||
| test.describe( 'Block editor keyboard shortcuts', () => { |
There was a problem hiding this comment.
Nit: I think a lot of these tests can be grouped into one to speed up the process. Especially we use mostly the same setup for each test, and each test only does one assertion. It's not a requirement for this migration though!
There was a problem hiding this comment.
We might need to adjust test shortcuts handling through portals in the same tree tests, but it should be doable.
What's the preferred method for having multiple checks in a single file, test.step or custom failure messages?
There was a problem hiding this comment.
What's the preferred method for having multiple checks in a single file,
test.stepor custom failure messages?
Either! Whichever looks the best to you 😉.
There was a problem hiding this comment.
Let's skip this for now. The whole suite runs in less than 10s.
I thought I could use editor.setContent to reset to the content state, but #57422 (comment) will complicate tests.
| // Duplicate via keyboard. | ||
| await pageUtils.pressKeys( 'primaryShift+d' ); | ||
|
|
||
| await expect.poll( editor.getBlocks ).toMatchObject( [ |
There was a problem hiding this comment.
I can't reproduce this. The content attribute is correctly showing for me 🤔 .
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Part of #38851.
Supersedes and closes #50930.
PR migrates
block-editor-keyboard-shortcuts.test.jse2e tests to Playwright.Why?
See #38851.
How?
I've included the author of the previous PR so they get credit for their contribution.
Testing Instructions