diff --git a/core/src/components/modal/test/basic/modal.spec.tsx b/core/src/components/modal/test/basic/modal.spec.tsx
index 01bd0ab22f..67996e2ad1 100644
--- a/core/src/components/modal/test/basic/modal.spec.tsx
+++ b/core/src/components/modal/test/basic/modal.spec.tsx
@@ -2,6 +2,7 @@ import { h } from '@stencil/core';
import { newSpecPage } from '@stencil/core/testing';
import { Modal } from '../../modal';
+import { FOCUS_TRAP_DISABLE_CLASS } from '@utils/overlays';
describe('modal: htmlAttributes inheritance', () => {
it('should correctly inherit attributes on host', async () => {
@@ -15,3 +16,26 @@ describe('modal: htmlAttributes inheritance', () => {
await expect(modal.getAttribute('data-testid')).toBe('basic-modal');
});
});
+
+describe('modal: focus trap', () => {
+ it('should set the focus trap class when disabled', async () => {
+ const page = await newSpecPage({
+ components: [Modal],
+ template: () => ,
+ });
+
+ const modal = page.body.querySelector('ion-modal')!;
+
+ expect(modal.classList.contains(FOCUS_TRAP_DISABLE_CLASS)).toBe(true);
+ });
+ it('should not set the focus trap class by default', async () => {
+ const page = await newSpecPage({
+ components: [Modal],
+ template: () => ,
+ });
+
+ const modal = page.body.querySelector('ion-modal')!;
+
+ expect(modal.classList.contains(FOCUS_TRAP_DISABLE_CLASS)).toBe(false);
+ });
+});
diff --git a/core/src/components/popover/test/basic/popover.spec.tsx b/core/src/components/popover/test/basic/popover.spec.tsx
index 84ecc7150c..abe5db8fc6 100644
--- a/core/src/components/popover/test/basic/popover.spec.tsx
+++ b/core/src/components/popover/test/basic/popover.spec.tsx
@@ -3,6 +3,8 @@ import { newSpecPage } from '@stencil/core/testing';
import { Popover } from '../../popover';
+import { FOCUS_TRAP_DISABLE_CLASS } from '@utils/overlays';
+
describe('popover: htmlAttributes inheritance', () => {
it('should correctly inherit attributes on host', async () => {
const page = await newSpecPage({
@@ -15,3 +17,26 @@ describe('popover: htmlAttributes inheritance', () => {
await expect(popover.getAttribute('data-testid')).toBe('basic-popover');
});
});
+
+describe('popover: focus trap', () => {
+ it('should set the focus trap class when disabled', async () => {
+ const page = await newSpecPage({
+ components: [Popover],
+ template: () => ,
+ });
+
+ const popover = page.body.querySelector('ion-popover')!;
+
+ expect(popover.classList.contains(FOCUS_TRAP_DISABLE_CLASS)).toBe(true);
+ });
+ it('should not set the focus trap class by default', async () => {
+ const page = await newSpecPage({
+ components: [Popover],
+ template: () => ,
+ });
+
+ const popover = page.body.querySelector('ion-popover')!;
+
+ expect(popover.classList.contains(FOCUS_TRAP_DISABLE_CLASS)).toBe(false);
+ });
+});