From 836c01c73e42caab0101ac4988f0a9b27cf96a5b Mon Sep 17 00:00:00 2001
From: Sean Perkins <sean@ionic.io>
Date: Thu, 24 Feb 2022 15:57:18 -0500
Subject: [PATCH] fix(modal): re-enable swipe gestures when modal is dismissed
 (#24846)

Resolves #24817
---
 .../components/menu/test/focus-trap/e2e.ts    | 36 +++++++++++++++++--
 core/src/components/modal/modal.tsx           |  2 ++
 2 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/core/src/components/menu/test/focus-trap/e2e.ts b/core/src/components/menu/test/focus-trap/e2e.ts
index 82e6bb8478..3d9cf8935f 100644
--- a/core/src/components/menu/test/focus-trap/e2e.ts
+++ b/core/src/components/menu/test/focus-trap/e2e.ts
@@ -12,7 +12,7 @@ test('menu: focus trap with overlays', async () => {
 
   const ionDidOpen = await page.spyOnEvent('ionDidOpen');
   const ionModalDidPresent = await page.spyOnEvent('ionModalDidPresent');
-  const ionModalDidDismiss= await page.spyOnEvent('ionModalDidDismiss');
+  const ionModalDidDismiss = await page.spyOnEvent('ionModalDidDismiss');
 
   const menu = await page.find('ion-menu');
   await menu.callMethod('open');
@@ -40,7 +40,6 @@ test('menu: focus trap with content inside overlays', async () => {
 
   const ionDidOpen = await page.spyOnEvent('ionDidOpen');
   const ionModalDidPresent = await page.spyOnEvent('ionModalDidPresent');
-  const ionModalDidDismiss= await page.spyOnEvent('ionModalDidDismiss');
 
   const menu = await page.find('ion-menu');
   await menu.callMethod('open');
@@ -57,3 +56,36 @@ test('menu: focus trap with content inside overlays', async () => {
 
   expect(await getActiveElementID(page)).toEqual('other-button');
 });
+
+test('menu: should work with swipe gestures after modal is dismissed', async () => {
+  const page = await newE2EPage({
+    url: '/src/components/menu/test/focus-trap?ionic:_testing=true'
+  });
+
+  const ionDidOpen = await page.spyOnEvent('ionDidOpen');
+  const ionModalDidPresent = await page.spyOnEvent('ionModalDidPresent');
+  const ionModalDidDismiss = await page.spyOnEvent('ionModalDidDismiss');
+
+  const menu = await page.find('ion-menu');
+  await menu.callMethod('open');
+  await ionDidOpen.next();
+
+  const openModal = await page.find('#open-modal-button');
+  await openModal.click();
+  await ionModalDidPresent.next();
+
+  const modal = await page.find('ion-modal');
+  await modal.callMethod('dismiss');
+  await ionModalDidDismiss.next();
+
+  await page.mouse.move(30, 168);
+  await page.mouse.down();
+
+  await page.mouse.move(384, 168);
+  await page.mouse.up();
+
+  await page.waitForChanges();
+
+  expect(menu.classList.contains('show-menu')).toBeTruthy();
+
+});
diff --git a/core/src/components/modal/modal.tsx b/core/src/components/modal/modal.tsx
index 1d2b1736c2..1da21433c1 100644
--- a/core/src/components/modal/modal.tsx
+++ b/core/src/components/modal/modal.tsx
@@ -527,6 +527,8 @@ export class Modal implements ComponentInterface, OverlayInterface {
       const { delegate } = this.getDelegate();
       await detachComponent(delegate, this.usersElement);
 
+      writeTask(() => this.el.classList.remove('show-modal'));
+
       if (this.animation) {
         this.animation.destroy();
       }