From 22b75cc323c6cf2c8877cf364d615c01ef2d319b Mon Sep 17 00:00:00 2001
From: Daniel Richards <daniel.richards@automattic.com>
Date: Mon, 17 Jan 2022 11:35:28 +0800
Subject: [PATCH 1/2] Fix empty secondary sidebar overlapping widget editor
 content on mobile viewports

---
 packages/edit-widgets/src/components/layout/interface.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/edit-widgets/src/components/layout/interface.js b/packages/edit-widgets/src/components/layout/interface.js
index 902a7de83effd8..b578323d2a754a 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 (
 		<InterfaceSkeleton
 			labels={ interfaceLabels }
 			header={ <Header /> }
-			secondarySidebar={ <SecondarySidebar /> }
+			secondarySidebar={ hasSecondarySidebar && <SecondarySidebar /> }
 			sidebar={
 				hasSidebarEnabled && (
 					<ComplementaryArea.Slot scope="core/edit-widgets" />

From bed622b2d9fc5a16f4df9592be9e152cac4107f4 Mon Sep 17 00:00:00 2001
From: Daniel Richards <daniel.richards@automattic.com>
Date: Mon, 17 Jan 2022 12:09:13 +0800
Subject: [PATCH 2/2] Add e2e test

---
 .../specs/widgets/editing-widgets.test.js     | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/packages/e2e-tests/specs/widgets/editing-widgets.test.js b/packages/e2e-tests/specs/widgets/editing-widgets.test.js
index 6174302419443e..09064447aca7a0 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();
+	} );
 } );
 
 /**