Skip to content

Commit

Permalink
Writing flow: fix paste for input fields (#61389)
Browse files Browse the repository at this point in the history
Co-authored-by: ellatrix <ellatrix@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: kevin940726 <kevin940726@git.wordpress.org>
Co-authored-by: allilevine <firewatch@git.wordpress.org>
Co-authored-by: afercia <afercia@git.wordpress.org>
Co-authored-by: liviopv <liviopv@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
  • Loading branch information
8 people authored and fullofcaffeine committed May 24, 2024
1 parent 6833b22 commit 1e75c48
Show file tree
Hide file tree
Showing 3 changed files with 66 additions and 17 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,25 @@ export default function useClipboardHandler() {
return;
}

// Let native copy/paste behaviour take over in input fields.
// But always handle multiple selected blocks.
if ( ! hasMultiSelection() ) {
const { target } = event;
const { ownerDocument } = target;
// If copying, only consider actual text selection as selection.
// Otherwise, any focus on an input field is considered.
const hasSelection =
event.type === 'copy' || event.type === 'cut'
? documentHasUncollapsedSelection( ownerDocument )
: documentHasSelection( ownerDocument ) &&
! ownerDocument.activeElement.isContentEditable;

// Let native copy behaviour take over in input fields.
if ( hasSelection ) {
return;
}
}

const { activeElement } = event.target.ownerDocument;

if ( ! node.contains( activeElement ) ) {
Expand All @@ -72,22 +91,6 @@ export default function useClipboardHandler() {
const expandSelectionIsNeeded =
! shouldHandleWholeBlocks && ! isSelectionMergeable;
if ( event.type === 'copy' || event.type === 'cut' ) {
if ( ! hasMultiSelection() ) {
const { target } = event;
const { ownerDocument } = target;
// If copying, only consider actual text selection as selection.
// Otherwise, any focus on an input field is considered.
const hasSelection =
event.type === 'copy' || event.type === 'cut'
? documentHasUncollapsedSelection( ownerDocument )
: documentHasSelection( ownerDocument );

// Let native copy behaviour take over in input fields.
if ( hasSelection ) {
return;
}
}

event.preventDefault();

if ( selectedBlockClientIds.length === 1 ) {
Expand Down
17 changes: 16 additions & 1 deletion packages/e2e-test-utils-playwright/src/page-utils/press-keys.ts
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export function setClipboardData(
}

async function emulateClipboard( page: Page, type: 'copy' | 'cut' | 'paste' ) {
clipboardDataHolder = await page.evaluate(
const output = await page.evaluate(
( [ _type, _clipboardData ] ) => {
const canvasDoc =
// @ts-ignore
Expand Down Expand Up @@ -99,6 +99,10 @@ async function emulateClipboard( page: Page, type: 'copy' | 'cut' | 'paste' ) {

canvasDoc.activeElement.dispatchEvent( event );

if ( _type === 'paste' ) {
return event.defaultPrevented;
}

return {
'text/plain': event.clipboardData.getData( 'text/plain' ),
'text/html': event.clipboardData.getData( 'text/html' ),
Expand All @@ -107,6 +111,17 @@ async function emulateClipboard( page: Page, type: 'copy' | 'cut' | 'paste' ) {
},
[ type, clipboardDataHolder ] as const
);

if ( typeof output === 'object' ) {
clipboardDataHolder = output;
}

if ( output === false ) {
// Emulate paste by typing the clipboard content, which works across all
// elements and documents (keyboard.type does uses the nested active
// element automatically).
await page.keyboard.type( clipboardDataHolder[ 'text/plain' ] );
}
}

const isAppleOS = () => process.platform === 'darwin';
Expand Down
31 changes: 31 additions & 0 deletions test/e2e/specs/editor/blocks/rss.spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
/**
* WordPress dependencies
*/
const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );

test.describe( 'RSS', () => {
test.beforeEach( async ( { admin } ) => {
await admin.createNewPost();
} );

// See: https://github.com/WordPress/gutenberg/pull/61389.
test( 'should retain native copy/paste behavior for input fields', async ( {
editor,
pageUtils,
} ) => {
await editor.insertBlock( { name: 'core/rss' } );
pageUtils.setClipboardData( {
plainText: 'https://developer.wordpress.org/news/feed/',
} );
await pageUtils.pressKeys( 'primary+v' );

await expect.poll( editor.getBlocks ).toMatchObject( [
{
name: 'core/rss',
attributes: {
feedURL: 'https://developer.wordpress.org/news/feed/',
},
},
] );
} );
} );

1 comment on commit 1e75c48

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected in 1e75c48.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/9228105964
📝 Reported issues:

Please sign in to comment.