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 && (