diff --git a/packages/e2e-tests/specs/widgets/editing-widgets.test.js b/packages/e2e-tests/specs/widgets/editing-widgets.test.js index 6174302419443..09064447aca7a 100644 --- a/packages/e2e-tests/specs/widgets/editing-widgets.test.js +++ b/packages/e2e-tests/specs/widgets/editing-widgets.test.js @@ -16,6 +16,7 @@ import { openGlobalBlockInserter, searchForBlock, closeGlobalBlockInserter, + setBrowserViewport, } from '@wordpress/e2e-test-utils'; /** @@ -842,6 +843,41 @@ describe( 'Widgets screen', () => { expect( listItems.length >= widgetAreas.length ).toEqual( true ); await closeListView(); } ); + + // Check for regressions of https://github.com/WordPress/gutenberg/issues/38002. + it( 'allows blocks to be added on mobile viewports', async () => { + await setBrowserViewport( 'small' ); + const [ firstWidgetArea ] = await findAll( { + role: 'document', + name: 'Block: Widget Area', + } ); + + const addParagraphBlock = await getBlockInGlobalInserter( 'Paragraph' ); + await addParagraphBlock.click(); + + const addedParagraphBlockInFirstWidgetArea = await find( + { + name: /^Empty block/, + selector: '[data-block][data-type="core/paragraph"]', + }, + { + root: firstWidgetArea, + } + ); + await addedParagraphBlockInFirstWidgetArea.focus(); + await page.keyboard.type( 'First Paragraph' ); + const updatedParagraphBlockInFirstWidgetArea = await find( + { + name: 'Paragraph block', + value: 'First Paragraph', + }, + { + root: firstWidgetArea, + } + ); + + expect( updatedParagraphBlockInFirstWidgetArea ).toBeTruthy(); + } ); } ); /** diff --git a/packages/edit-widgets/src/components/layout/interface.js b/packages/edit-widgets/src/components/layout/interface.js index 902a7de83effd..b578323d2a754 100644 --- a/packages/edit-widgets/src/components/layout/interface.js +++ b/packages/edit-widgets/src/components/layout/interface.js @@ -83,11 +83,13 @@ function Interface( { blockEditorSettings } ) { } }, [ isInserterOpened, isListViewOpened, isHugeViewport ] ); + const hasSecondarySidebar = isListViewOpened || isInserterOpened; + return ( } - secondarySidebar={ } + secondarySidebar={ hasSecondarySidebar && } sidebar={ hasSidebarEnabled && (