Editor: Fix regression introduced in CopyHandler (#12543)

* Edior: Fix regression introduced in CopyHandler

* Refactor CopyHandler to be less dependent on withData implementation

packages/editor/src/components/copy-handler/index.js

@@ -11,8 +11,8 @@ class CopyHandler extends Component {
  constructor() {
  super( ...arguments );
 
- this.onCopy = this.onCopy.bind( this );
- this.onCut = this.onCut.bind( this );
+ this.onCopy = ( event ) => this.props.onCopy( event );
+ this.onCut = ( event ) => this.props.onCut( event );
  }
 
  componentDidMount() {
@@ -25,16 +25,6 @@ class CopyHandler extends Component {
  document.removeEventListener( 'cut', this.onCut );
  }
 
- onCopy( event ) {
- this.props.onCopy( event.clipboardData );
- event.preventDefault();
- }
-
- onCut( event ) {
- this.props.onCut( event.clipboardData );
- event.preventDefault();
- }
-
  render() {
  return null;
  }
@@ -50,29 +40,38 @@ export default compose( [
  } = select( 'core/editor' );
  const { removeBlocks } = dispatch( 'core/editor' );
 
- const selectedBlockClientId = getSelectedBlockClientId();
- const selectedBlockClientIds = selectedBlockClientId ? [ selectedBlockClientId ] : getMultiSelectedBlockClientIds();
+ const onCopy = ( event ) => {
+ const selectedBlockClientIds = getSelectedBlockClientId() ?
+ [ getSelectedBlockClientId() ] :
+ getMultiSelectedBlockClientIds();
 
- return {
- onCopy( dataTransfer ) {
- if ( selectedBlockClientIds.length === 0 ) {
- return;
- }
+ if ( selectedBlockClientIds.length === 0 ) {
+ return;
+ }
 
-  // Let native copy behaviour take over in input fields.
-  if ( ! hasMultiSelection() && documentHasSelection() ) {
-  return;
-  }
+ // Let native copy behaviour take over in input fields.
+ if ( ! hasMultiSelection() && documentHasSelection() ) {
+ return;
+ }
 
-  const serialized = serialize( getBlocksByClientId( selectedBlockClientIds ) );
+ const serialized = serialize( getBlocksByClientId( selectedBlockClientIds ) );
 
- dataTransfer.setData( 'text/plain', serialized );
- dataTransfer.setData( 'text/html', serialized );
- },
- onCut( dataTransfer ) {
- this.onCopy( dataTransfer );
+ event.clipboardData.setData( 'text/plain', serialized );
+ event.clipboardData.setData( 'text/html', serialized );
+
+ event.preventDefault();
+ };
+
+ return {
+ onCopy,
+ onCut( event ) {
+ onCopy( event );
 
  if ( hasMultiSelection() ) {
+ const selectedBlockClientIds = getSelectedBlockClientId() ?
+ [ getSelectedBlockClientId() ] :
+ getMultiSelectedBlockClientIds();
+
  removeBlocks( selectedBlockClientIds );
  }
  },