This is Gutenberg
-" -`; - -exports[`Links can be created by selecting text and using keyboard shortcuts 2`] = ` -" -This is Gutenberg
-" -`; - exports[`Links can be created instantly when a URL is selected 1`] = ` "This is Gutenberg: https://wordpress.org/gutenberg
diff --git a/packages/e2e-tests/specs/editor/various/links.test.js b/packages/e2e-tests/specs/editor/various/links.test.js index 9d8bddff952b60..5920f8463277bb 100644 --- a/packages/e2e-tests/specs/editor/various/links.test.js +++ b/packages/e2e-tests/specs/editor/various/links.test.js @@ -103,48 +103,6 @@ describe( 'Links', () => { expect( urlInputValue ).toBe( '' ); } ); - it( 'can be created by selecting text and using keyboard shortcuts', async () => { - // Create a block with some text. - await clickBlockAppender(); - await page.keyboard.type( 'This is Gutenberg' ); - - // Select some text. - await pressKeyWithModifier( 'shiftAlt', 'ArrowLeft' ); - - // Press Cmd+K to insert a link. - await pressKeyWithModifier( 'primary', 'K' ); - - // Wait for the URL field to auto-focus. - await waitForURLFieldAutoFocus(); - - // Type a URL. - await page.keyboard.type( 'https://wordpress.org/gutenberg' ); - - // Open settings. - await page.keyboard.press( 'Tab' ); - await page.keyboard.press( 'Space' ); - - // Navigate to and toggle the "Open in new tab" checkbox. - await page.keyboard.press( 'Tab' ); - await page.keyboard.press( 'Space' ); - - // Toggle should still have focus and be checked. - await page.waitForSelector( - ':focus:checked.components-checkbox-control__input' - ); - - // Ensure that the contents of the post have not been changed, since at - // this point the link is still not inserted. - expect( await getEditedPostContent() ).toMatchSnapshot(); - - // Tab back to the Submit and apply the link. - await page.keyboard.press( 'Tab' ); - await page.keyboard.press( 'Enter' ); - - // The link should have been inserted. - expect( await getEditedPostContent() ).toMatchSnapshot(); - } ); - it( 'can be created without any text selected', async () => { // Create a block with some text. await clickBlockAppender(); diff --git a/test/e2e/specs/editor/blocks/links.spec.js b/test/e2e/specs/editor/blocks/links.spec.js new file mode 100644 index 00000000000000..1e03da549c2347 --- /dev/null +++ b/test/e2e/specs/editor/blocks/links.spec.js @@ -0,0 +1,69 @@ +/** + * WordPress dependencies + */ +const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' ); + +test.describe( 'Links', () => { + test.beforeEach( async ( { admin } ) => { + await admin.createNewPost(); + } ); + + test( `can be created by selecting text and using keyboard shortcuts`, async ( { + page, + editor, + pageUtils, + } ) => { + // Create a block with some text. + await editor.insertBlock( { + name: 'core/paragraph', + } ); + await page.keyboard.type( 'This is Gutenberg' ); + + // Select some text. + await pageUtils.pressKeys( 'shiftAlt+ArrowLeft' ); + + // Press Cmd+K to insert a link. + await pageUtils.pressKeys( 'primary+K' ); + + // Type a URL. + await page.keyboard.type( 'https://wordpress.org/gutenberg' ); + + // Open settings. + await page.getByRole( 'button', { name: 'Link Settings' } ).click(); + + // Navigate to and toggle the "Open in new tab" checkbox. + const checkbox = page.getByLabel( 'Open in new tab' ); + await checkbox.click(); + + // Toggle should still have focus and be checked. + await expect( checkbox ).toBeChecked(); + await expect( checkbox ).toBeFocused(); + + // Ensure that the contents of the post have not been changed, since at + // this point the link is still not inserted. + await expect.poll( editor.getBlocks ).toMatchObject( [ + { + name: 'core/paragraph', + attributes: { content: 'This is Gutenberg' }, + }, + ] ); + + // Tab back to the Submit and apply the link. + await page + //TODO: change to a better selector when https://github.com/WordPress/gutenberg/issues/51060 is resolved. + .locator( '.block-editor-link-control' ) + .getByRole( 'button', { name: 'Save' } ) + .click(); + + // The link should have been inserted. + await expect.poll( editor.getBlocks ).toMatchObject( [ + { + name: 'core/paragraph', + attributes: { + content: + 'This is Gutenberg', + }, + }, + ] ); + } ); +} );