From c276e7f941e916e994c87691c665dc6bbf7df61c Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Sat, 11 May 2019 20:06:27 +0300 Subject: [PATCH 01/13] adds selection persistence on sidebar tab switch --- packages/block-editor/src/store/actions.js | 11 +++++++ packages/block-editor/src/store/reducer.js | 15 ++++++++- packages/e2e-tests/specs/a11y.test.js | 31 +++++++++++++++++++ .../sidebar/settings-header/index.js | 4 ++- 4 files changed, 59 insertions(+), 2 deletions(-) diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index 4dafaa291fcf3..758d1f047cf7d 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -203,6 +203,17 @@ export function clearSelectedBlock() { }; } +/** + * Returns an action object used in restoring the previously cleared selected blocks. + * + * @return {Object} Action object. + */ +export function restoreSelectedBlock() { + return { + type: 'RESTORE_SELECTED_BLOCK', + }; +} + /** * Returns an action object that enables or disables block selection. * diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index d9d0ecbdd28b6..cf5c95e49cbdc 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -718,7 +718,20 @@ const BLOCK_SELECTION_INITIAL_STATE = { export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) { switch ( action.type ) { case 'CLEAR_SELECTED_BLOCK': - return BLOCK_SELECTION_INITIAL_STATE; + return { + ...BLOCK_SELECTION_INITIAL_STATE, + previousSelection: { + start: state.start, + end: state.end, + isMultiSelecting: state.isMultiSelecting, + isEnabled: state.isEnabled, + initialPosition: state.initialPosition, + }, + }; + case 'RESTORE_SELECTED_BLOCK': + return { + ...state.previousSelection, + }; case 'START_MULTI_SELECT': if ( state.isMultiSelecting ) { return state; diff --git a/packages/e2e-tests/specs/a11y.test.js b/packages/e2e-tests/specs/a11y.test.js index 6f6cc960f204a..05ec5446fff32 100644 --- a/packages/e2e-tests/specs/a11y.test.js +++ b/packages/e2e-tests/specs/a11y.test.js @@ -2,6 +2,7 @@ * WordPress dependencies */ import { + clickBlockAppender, createNewPost, pressKeyWithModifier, } from '@wordpress/e2e-test-utils'; @@ -29,6 +30,36 @@ describe( 'a11y', () => { expect( isFocusedToggle ).toBe( true ); } ); + it( 'checks persistent selection', async () => { + await clickBlockAppender(); + await page.keyboard.type( 'Testing editor selection persistence' ); + + await page.keyboard.down( 'Control' ); + await page.keyboard.down( 'Shift' ); + await page.keyboard.press( '`' ); + await page.keyboard.press( '`' ); + await page.keyboard.up( 'Control' ); + await page.keyboard.up( 'Shift' ); + + await page.keyboard.press( 'Tab' ); + await page.keyboard.press( 'Space' ); + + let isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { + return focusedElement.classList.contains( 'block-editor-rich-text__editable' ); + } ); + + expect( isFocusedParagraphBlock ).toBe( false ); + + await page.keyboard.press( 'Tab' ); + await page.keyboard.press( 'Space' ); + + isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { + return focusedElement.classList.contains( 'block-editor-rich-text__editable' ); + } ); + + expect( isFocusedParagraphBlock ).toBe( true ); + } ); + it( 'constrains focus to a modal when tabbing', async () => { // Open keyboard help modal. await pressKeyWithModifier( 'access', 'h' ); diff --git a/packages/edit-post/src/components/sidebar/settings-header/index.js b/packages/edit-post/src/components/sidebar/settings-header/index.js index eeb95a872166f..47d00bce72048 100644 --- a/packages/edit-post/src/components/sidebar/settings-header/index.js +++ b/packages/edit-post/src/components/sidebar/settings-header/index.js @@ -57,7 +57,8 @@ const SettingsHeader = ( { openDocumentSettings, openBlockSettings, sidebarName export default withDispatch( ( dispatch ) => { const { openGeneralSidebar } = dispatch( 'core/edit-post' ); - const { clearSelectedBlock } = dispatch( 'core/block-editor' ); + const { clearSelectedBlock, restoreSelectedBlock } = dispatch( 'core/block-editor' ); + return { openDocumentSettings() { openGeneralSidebar( 'edit-post/document' ); @@ -65,6 +66,7 @@ export default withDispatch( ( dispatch ) => { }, openBlockSettings() { openGeneralSidebar( 'edit-post/block' ); + restoreSelectedBlock(); }, }; } )( SettingsHeader ); From 288048156cf922a9c07fc4b6400bb92d0f04311a Mon Sep 17 00:00:00 2001 From: andrei draganescu Date: Tue, 21 May 2019 07:23:40 -0700 Subject: [PATCH 02/13] autogen doc for the new restoreSelectedBlock action --- .../developers/data/data-core-block-editor.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 6e496446d6be2..591e5322cf35b 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -1039,6 +1039,14 @@ _Returns_ - `Object`: Action object. +# **restoreSelectedBlock** + +Returns an action object used in restoring the previously cleared selected blocks. + +_Returns_ + +- `Object`: Action object. + # **selectBlock** Returns an action object used in signalling that the block with the From 0b5488691c7a4d353935dbcabfc7ad56f342db9f Mon Sep 17 00:00:00 2001 From: andrei draganescu Date: Tue, 21 May 2019 07:46:23 -0700 Subject: [PATCH 03/13] removed useless spread operator and used lodash omit for a more declarative construction --- packages/block-editor/src/store/reducer.js | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index cf5c95e49cbdc..e4a0065fd4c7d 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -720,18 +720,10 @@ export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) case 'CLEAR_SELECTED_BLOCK': return { ...BLOCK_SELECTION_INITIAL_STATE, - previousSelection: { - start: state.start, - end: state.end, - isMultiSelecting: state.isMultiSelecting, - isEnabled: state.isEnabled, - initialPosition: state.initialPosition, - }, + previousSelection: omit( state, [ 'previousSelection' ] ), }; case 'RESTORE_SELECTED_BLOCK': - return { - ...state.previousSelection, - }; + return state.previousSelection; case 'START_MULTI_SELECT': if ( state.isMultiSelecting ) { return state; From b6b4efa0903f17090a8349bc519bbff8102a8c2e Mon Sep 17 00:00:00 2001 From: andrei draganescu Date: Tue, 21 May 2019 08:32:59 -0700 Subject: [PATCH 04/13] wip: updating the test for better readability --- packages/e2e-tests/specs/a11y.test.js | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/packages/e2e-tests/specs/a11y.test.js b/packages/e2e-tests/specs/a11y.test.js index 05ec5446fff32..fc9f55b3aa32d 100644 --- a/packages/e2e-tests/specs/a11y.test.js +++ b/packages/e2e-tests/specs/a11y.test.js @@ -34,14 +34,19 @@ describe( 'a11y', () => { await clickBlockAppender(); await page.keyboard.type( 'Testing editor selection persistence' ); - await page.keyboard.down( 'Control' ); - await page.keyboard.down( 'Shift' ); - await page.keyboard.press( '`' ); - await page.keyboard.press( '`' ); - await page.keyboard.up( 'Control' ); - await page.keyboard.up( 'Shift' ); + // moving focus backwards using keyboard shortcuts + // twice to get to the inspector tabs + await pressKeyWithModifier( 'ctrlShift', '`' ); + await pressKeyWithModifier( 'ctrlShift', '`' ); await page.keyboard.press( 'Tab' ); + + const isFocusedInspectorDocumentTab = await page.$eval( ':focus', ( focusedElement ) => { + return focusedElement.getAttribute( 'data-label' ); + } ); + + expect( isFocusedInspectorDocumentTab ).toEqual( 'Document' ); + await page.keyboard.press( 'Space' ); let isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { @@ -51,6 +56,13 @@ describe( 'a11y', () => { expect( isFocusedParagraphBlock ).toBe( false ); await page.keyboard.press( 'Tab' ); + + const isFocusedInspectorBlockTab = await page.$eval( ':focus', ( focusedElement ) => { + return focusedElement.getAttribute( 'data-label' ); + } ); + + expect( isFocusedInspectorBlockTab ).toEqual( 'Block' ); + await page.keyboard.press( 'Space' ); isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { From c5f1cf325e7052267e990d2580971eefbd5c8dc6 Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Wed, 22 May 2019 16:07:53 +0300 Subject: [PATCH 05/13] small updates to make the tests pass --- packages/block-editor/src/store/reducer.js | 3 +++ packages/block-editor/src/store/test/reducer.js | 1 + 2 files changed, 4 insertions(+) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index e4a0065fd4c7d..33908e18e95ee 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -718,6 +718,9 @@ const BLOCK_SELECTION_INITIAL_STATE = { export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) { switch ( action.type ) { case 'CLEAR_SELECTED_BLOCK': + if ( isEqual( state, BLOCK_SELECTION_INITIAL_STATE ) ) { + return BLOCK_SELECTION_INITIAL_STATE; + } return { ...BLOCK_SELECTION_INITIAL_STATE, previousSelection: omit( state, [ 'previousSelection' ] ), diff --git a/packages/block-editor/src/store/test/reducer.js b/packages/block-editor/src/store/test/reducer.js index 7543fdad57dd8..b0d79d8911292 100644 --- a/packages/block-editor/src/store/test/reducer.js +++ b/packages/block-editor/src/store/test/reducer.js @@ -1740,6 +1740,7 @@ describe( 'state', () => { initialPosition: null, isMultiSelecting: false, isEnabled: true, + previousSelection: original, } ); } ); From 5c5183fadd7202f0097e3ba89f8ab730e0ff3405 Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Tue, 28 May 2019 15:27:56 +0300 Subject: [PATCH 06/13] fixed the failing session persistence test --- packages/block-editor/src/store/reducer.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index 33908e18e95ee..a09a5b8a423ba 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -726,7 +726,10 @@ export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) previousSelection: omit( state, [ 'previousSelection' ] ), }; case 'RESTORE_SELECTED_BLOCK': - return state.previousSelection; + return { + ...BLOCK_SELECTION_INITIAL_STATE, + ...state.previousSelection, + }; case 'START_MULTI_SELECT': if ( state.isMultiSelecting ) { return state; From 9790e719a202749af295f9630b71c5300eef3c19 Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Tue, 28 May 2019 22:45:39 +0300 Subject: [PATCH 07/13] adds a destructive way to clear selection --- .../developers/data/data-core-block-editor.md | 4 ++++ packages/block-editor/src/store/actions.js | 10 +++++++++- packages/block-editor/src/store/reducer.js | 2 ++ packages/edit-post/src/store/effects.js | 2 +- 4 files changed, 16 insertions(+), 2 deletions(-) diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 591e5322cf35b..5664148643014 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -826,6 +826,10 @@ _Returns_ Returns an action object used in signalling that the block selection is cleared. +_Parameters_ + +- _type_ `Object`: Object specifying if the clearing is destructive or not, default { destructive: false }. + _Returns_ - `Object`: Action object. diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index 758d1f047cf7d..bd18f39fff12e 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -195,9 +195,17 @@ export function multiSelect( start, end ) { /** * Returns an action object used in signalling that the block selection is cleared. * + * @param {Object} type Object specifying if the clearing is destructive or not, default + * { destructive: false }. + * * @return {Object} Action object. */ -export function clearSelectedBlock() { +export function clearSelectedBlock( type = { destructive: false } ) { + if ( type.destructive === true ) { + return { + type: 'DESTRUCTIVELY_CLEAR_SELECTED_BLOCK', + }; + } return { type: 'CLEAR_SELECTED_BLOCK', }; diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index a09a5b8a423ba..3bf5b24022907 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -717,6 +717,8 @@ const BLOCK_SELECTION_INITIAL_STATE = { */ export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) { switch ( action.type ) { + case 'DESTRUCTIVELY_CLEAR_SELECTED_BLOCK': + return BLOCK_SELECTION_INITIAL_STATE; case 'CLEAR_SELECTED_BLOCK': if ( isEqual( state, BLOCK_SELECTION_INITIAL_STATE ) ) { return BLOCK_SELECTION_INITIAL_STATE; diff --git a/packages/edit-post/src/store/effects.js b/packages/edit-post/src/store/effects.js index 54bfe07fbd67b..2b747431250a8 100644 --- a/packages/edit-post/src/store/effects.js +++ b/packages/edit-post/src/store/effects.js @@ -109,7 +109,7 @@ const effects = { SWITCH_MODE( action ) { // Unselect blocks when we switch to the code editor. if ( action.mode !== 'visual' ) { - dispatch( 'core/block-editor' ).clearSelectedBlock(); + dispatch( 'core/block-editor' ).clearSelectedBlock( { destructive: true } ); } const message = action.mode === 'visual' ? __( 'Visual editor selected' ) : __( 'Code editor selected' ); From 290b3df066caaee80b6ddd715b4bdd882b45183f Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Sun, 2 Jun 2019 15:01:03 +0300 Subject: [PATCH 08/13] adds destructive selection clearer and clears on visual edititng toggle and manual deselection --- .../block-selection-clearer/index.js | 8 ++++---- packages/block-editor/src/store/actions.js | 18 ++++++++++++------ packages/block-editor/src/store/reducer.js | 2 +- packages/edit-post/src/store/effects.js | 2 +- 4 files changed, 18 insertions(+), 12 deletions(-) diff --git a/packages/block-editor/src/components/block-selection-clearer/index.js b/packages/block-editor/src/components/block-selection-clearer/index.js index be39e5df9e7de..cc2e27944e06b 100644 --- a/packages/block-editor/src/components/block-selection-clearer/index.js +++ b/packages/block-editor/src/components/block-selection-clearer/index.js @@ -33,12 +33,12 @@ class BlockSelectionClearer extends Component { const { hasSelectedBlock, hasMultiSelection, - clearSelectedBlock, + wipeSelectedBlock, } = this.props; const hasSelection = ( hasSelectedBlock || hasMultiSelection ); if ( event.target === this.container && hasSelection ) { - clearSelectedBlock(); + wipeSelectedBlock(); } } @@ -68,7 +68,7 @@ export default compose( [ }; } ), withDispatch( ( dispatch ) => { - const { clearSelectedBlock } = dispatch( 'core/block-editor' ); - return { clearSelectedBlock }; + const { wipeSelectedBlock } = dispatch( 'core/block-editor' ); + return { wipeSelectedBlock }; } ), ] )( BlockSelectionClearer ); diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index bd18f39fff12e..9361e62c1c70f 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -192,6 +192,17 @@ export function multiSelect( start, end ) { }; } +/** + * Returns an action object used in signalling that the block selection is cleared. + * + * @return {Object} Action object. + */ +export function wipeSelectedBlock() { + return { + type: 'WIPE_SELECTED_BLOCK', + }; +} + /** * Returns an action object used in signalling that the block selection is cleared. * @@ -200,12 +211,7 @@ export function multiSelect( start, end ) { * * @return {Object} Action object. */ -export function clearSelectedBlock( type = { destructive: false } ) { - if ( type.destructive === true ) { - return { - type: 'DESTRUCTIVELY_CLEAR_SELECTED_BLOCK', - }; - } +export function clearSelectedBlock() { return { type: 'CLEAR_SELECTED_BLOCK', }; diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index 3bf5b24022907..e62734d0412e2 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -717,7 +717,7 @@ const BLOCK_SELECTION_INITIAL_STATE = { */ export function blockSelection( state = BLOCK_SELECTION_INITIAL_STATE, action ) { switch ( action.type ) { - case 'DESTRUCTIVELY_CLEAR_SELECTED_BLOCK': + case 'WIPE_SELECTED_BLOCK': return BLOCK_SELECTION_INITIAL_STATE; case 'CLEAR_SELECTED_BLOCK': if ( isEqual( state, BLOCK_SELECTION_INITIAL_STATE ) ) { diff --git a/packages/edit-post/src/store/effects.js b/packages/edit-post/src/store/effects.js index 2b747431250a8..36d3c2b501369 100644 --- a/packages/edit-post/src/store/effects.js +++ b/packages/edit-post/src/store/effects.js @@ -109,7 +109,7 @@ const effects = { SWITCH_MODE( action ) { // Unselect blocks when we switch to the code editor. if ( action.mode !== 'visual' ) { - dispatch( 'core/block-editor' ).clearSelectedBlock( { destructive: true } ); + dispatch( 'core/block-editor' ).wipeSelectedBlock(); } const message = action.mode === 'visual' ? __( 'Visual editor selected' ) : __( 'Code editor selected' ); From a737a49737b028c952ffb65599fdec1d236b02ca Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Mon, 3 Jun 2019 09:09:28 +0300 Subject: [PATCH 09/13] autogen docs --- .../developers/data/data-core-block-editor.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 5664148643014..7a8dfcedbf972 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -1237,4 +1237,12 @@ _Returns_ Undocumented declaration. +# **wipeSelectedBlock** + +Returns an action object used in signalling that the block selection is cleared. + +_Returns_ + +- `Object`: Action object. + From 5d7a3c86f41c32d85b7e2b5444c5522b5f07292c Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Mon, 3 Jun 2019 09:53:07 +0300 Subject: [PATCH 10/13] removes unused documentation --- packages/block-editor/src/store/actions.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index 9361e62c1c70f..34cf853957e44 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -206,9 +206,6 @@ export function wipeSelectedBlock() { /** * Returns an action object used in signalling that the block selection is cleared. * - * @param {Object} type Object specifying if the clearing is destructive or not, default - * { destructive: false }. - * * @return {Object} Action object. */ export function clearSelectedBlock() { From 050685dc2625000862db0a41fab9bf839fcd8495 Mon Sep 17 00:00:00 2001 From: Grzegorz Ziolkowski Date: Mon, 3 Jun 2019 10:11:32 +0200 Subject: [PATCH 11/13] Docs: Rengenerate after API docs has changed --- .../developers/data/data-core-block-editor.md | 4 ---- 1 file changed, 4 deletions(-) diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 7a8dfcedbf972..8fbd6405b4a67 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -826,10 +826,6 @@ _Returns_ Returns an action object used in signalling that the block selection is cleared. -_Parameters_ - -- _type_ `Object`: Object specifying if the clearing is destructive or not, default { destructive: false }. - _Returns_ - `Object`: Action object. From 6ec44298ba74f09da97bc1cbb887f519307803e5 Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Wed, 5 Jun 2019 00:53:27 +0300 Subject: [PATCH 12/13] better docs and unit tests for new actions --- .../developers/data/data-core-block-editor.md | 7 +++++-- packages/block-editor/src/store/actions.js | 7 +++++-- .../block-editor/src/store/test/actions.js | 18 ++++++++++++++++++ 3 files changed, 28 insertions(+), 4 deletions(-) diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 8fbd6405b4a67..f765454e94887 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -824,7 +824,9 @@ _Returns_ # **clearSelectedBlock** -Returns an action object used in signalling that the block selection is cleared. +Returns an action object used in signaling that the block selection is cleared. +This will save the current selection in a state called `previousSelection` and +`restoreSelectedBlock` will be able to restore the selection. _Returns_ @@ -1235,7 +1237,8 @@ Undocumented declaration. # **wipeSelectedBlock** -Returns an action object used in signalling that the block selection is cleared. +Returns an action object used in signaling that the block selection is wiped. +This will remove block selection so that `restoreSelectedBlock` will have no effect. _Returns_ diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index 34cf853957e44..e1e4c1f69ed04 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -193,7 +193,8 @@ export function multiSelect( start, end ) { } /** - * Returns an action object used in signalling that the block selection is cleared. + * Returns an action object used in signaling that the block selection is wiped. + * This will remove block selection so that `restoreSelectedBlock` will have no effect. * * @return {Object} Action object. */ @@ -204,7 +205,9 @@ export function wipeSelectedBlock() { } /** - * Returns an action object used in signalling that the block selection is cleared. + * Returns an action object used in signaling that the block selection is cleared. + * This will save the current selection in a state called `previousSelection` and + * `restoreSelectedBlock` will be able to restore the selection. * * @return {Object} Action object. */ diff --git a/packages/block-editor/src/store/test/actions.js b/packages/block-editor/src/store/test/actions.js index 1fb97cd38d9bd..93123c17bf987 100644 --- a/packages/block-editor/src/store/test/actions.js +++ b/packages/block-editor/src/store/test/actions.js @@ -3,6 +3,8 @@ */ import { clearSelectedBlock, + wipeSelectedBlock, + restoreSelectedBlock, enterFormattedText, exitFormattedText, hideInsertionPoint, @@ -116,6 +118,22 @@ describe( 'actions', () => { } ); } ); + describe( 'wipeSelectedBlock', () => { + it( 'should return WIPE_SELECTED_BLOCK action', () => { + expect( wipeSelectedBlock() ).toEqual( { + type: 'WIPE_SELECTED_BLOCK', + } ); + } ); + } ); + + describe( 'restoreSelectedBlock', () => { + it( 'should return RESTORE_SELECTED_BLOCK action', () => { + expect( restoreSelectedBlock() ).toEqual( { + type: 'RESTORE_SELECTED_BLOCK', + } ); + } ); + } ); + describe( 'replaceBlock', () => { it( 'should yield the REPLACE_BLOCKS action if the new block can be inserted in the destination root block', () => { const block = { From 35141ccea12c84fcc053493b9da79b77a37d7aad Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Wed, 5 Jun 2019 01:04:19 +0300 Subject: [PATCH 13/13] updated the selection persistence test for better readability --- packages/e2e-tests/specs/a11y.test.js | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/e2e-tests/specs/a11y.test.js b/packages/e2e-tests/specs/a11y.test.js index fc9f55b3aa32d..784ee4dc55674 100644 --- a/packages/e2e-tests/specs/a11y.test.js +++ b/packages/e2e-tests/specs/a11y.test.js @@ -32,8 +32,16 @@ describe( 'a11y', () => { it( 'checks persistent selection', async () => { await clickBlockAppender(); + + // adding one Paragraph block which contains a focusable RichText await page.keyboard.type( 'Testing editor selection persistence' ); + let isFocusedRichText = await page.$eval( ':focus', ( focusedElement ) => { + return focusedElement.classList.contains( 'block-editor-rich-text__editable' ); + } ); + + expect( isFocusedRichText ).toBe( true ); + // moving focus backwards using keyboard shortcuts // twice to get to the inspector tabs await pressKeyWithModifier( 'ctrlShift', '`' ); @@ -49,11 +57,11 @@ describe( 'a11y', () => { await page.keyboard.press( 'Space' ); - let isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { + isFocusedRichText = await page.$eval( ':focus', ( focusedElement ) => { return focusedElement.classList.contains( 'block-editor-rich-text__editable' ); } ); - expect( isFocusedParagraphBlock ).toBe( false ); + expect( isFocusedRichText ).toBe( false ); await page.keyboard.press( 'Tab' ); @@ -65,11 +73,11 @@ describe( 'a11y', () => { await page.keyboard.press( 'Space' ); - isFocusedParagraphBlock = await page.$eval( ':focus', ( focusedElement ) => { + isFocusedRichText = await page.$eval( ':focus', ( focusedElement ) => { return focusedElement.classList.contains( 'block-editor-rich-text__editable' ); } ); - expect( isFocusedParagraphBlock ).toBe( true ); + expect( isFocusedRichText ).toBe( true ); } ); it( 'constrains focus to a modal when tabbing', async () => {