From 24b6949d894b79c8484329e4688590a2d4b2e862 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Mon, 12 Nov 2018 09:02:19 +0100 Subject: [PATCH 1/4] Fix multiselection for float elements --- .../editor/src/components/block-list/index.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/packages/editor/src/components/block-list/index.js b/packages/editor/src/components/block-list/index.js index 7d589a329fca37..7e07c34ca66a15 100644 --- a/packages/editor/src/components/block-list/index.js +++ b/packages/editor/src/components/block-list/index.js @@ -2,7 +2,8 @@ * External dependencies */ import { - findLast, + filter, + last, map, invert, mapValues, @@ -22,6 +23,7 @@ import { compose } from '@wordpress/compose'; */ import BlockListBlock from './block'; import BlockListAppender from '../block-list-appender'; +import { getBlockDOMNode } from '../../utils/dom'; class BlockList extends Component { constructor( props ) { @@ -78,9 +80,14 @@ class BlockList extends Component { this.props.onStartMultiSelect(); } - const boundaries = this.nodes[ this.selectionAtStart ].getBoundingClientRect(); - const y = clientY - boundaries.top; - const key = findLast( this.coordMapKeys, ( coordY ) => coordY < y ); + const blockContentBoundaries = getBlockDOMNode( this.selectionAtStart ).getBoundingClientRect(); + if ( clientY >= blockContentBoundaries.top && clientY <= blockContentBoundaries.bottom ) { + return; + } + + const y = clientY - blockContentBoundaries.top; + const hoveredBlocks = filter( this.coordMapKeys, ( coordY ) => coordY < y ); + const key = last( hoveredBlocks ); this.onSelectionChange( this.coordMap[ key ] ); } From 50439fae957ef9ab07875c8bf9ebe7b70abe5f65 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Mon, 12 Nov 2018 10:18:21 +0100 Subject: [PATCH 2/4] Update changelog --- packages/editor/CHANGELOG.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/editor/CHANGELOG.md b/packages/editor/CHANGELOG.md index cfa181b65cf68a..f192a1fbcb14ae 100644 --- a/packages/editor/CHANGELOG.md +++ b/packages/editor/CHANGELOG.md @@ -1,3 +1,9 @@ +## 7.0.1 (Unreleased) + +### Bug Fixes + +- Fix multi-selection triggering too often when using floated blocks. + ## 7.0.0 (2018-11-12) ### Breaking Change From 737f3305216b35db9e6583e6220df75a2f879850 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Mon, 12 Nov 2018 11:25:58 +0100 Subject: [PATCH 3/4] Add a comment to explain the fix --- packages/editor/src/components/block-list/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/editor/src/components/block-list/index.js b/packages/editor/src/components/block-list/index.js index 7e07c34ca66a15..e917efd0395a41 100644 --- a/packages/editor/src/components/block-list/index.js +++ b/packages/editor/src/components/block-list/index.js @@ -81,6 +81,9 @@ class BlockList extends Component { } const blockContentBoundaries = getBlockDOMNode( this.selectionAtStart ).getBoundingClientRect(); + + // prevent multi-selection from triggering when the selected block is a float + // and the cursor is still between the top and the bottom of the block. if ( clientY >= blockContentBoundaries.top && clientY <= blockContentBoundaries.bottom ) { return; } From 30b4de033be8d9c97d631747963ed0dcaa98579d Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Mon, 12 Nov 2018 11:28:05 +0100 Subject: [PATCH 4/4] revert unrelated change --- packages/editor/src/components/block-list/index.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/editor/src/components/block-list/index.js b/packages/editor/src/components/block-list/index.js index e917efd0395a41..b8e7e2926225fc 100644 --- a/packages/editor/src/components/block-list/index.js +++ b/packages/editor/src/components/block-list/index.js @@ -2,8 +2,7 @@ * External dependencies */ import { - filter, - last, + findLast, map, invert, mapValues, @@ -89,8 +88,7 @@ class BlockList extends Component { } const y = clientY - blockContentBoundaries.top; - const hoveredBlocks = filter( this.coordMapKeys, ( coordY ) => coordY < y ); - const key = last( hoveredBlocks ); + const key = findLast( this.coordMapKeys, ( coordY ) => coordY < y ); this.onSelectionChange( this.coordMap[ key ] ); }