init project

test/e2e/fixtures/FocusTrap/ClosedFocusTrap.tsx

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import FocusTrap from '@mui/material/Unstable_TrapFocus';
+
+export default function ClosedFocusTrap() {
+  return (
+    <React.Fragment>
+      <button type="button" autoFocus>
+        initial focus
+      </button>
+      <FocusTrap open={false}>
+        <div data-testid="root">
+          <button type="button">inside focusable</button>
+        </div>
+      </FocusTrap>
+      <button type="button">final tab target</button>
+    </React.Fragment>
+  );
+}

test/e2e/fixtures/FocusTrap/DefaultOpenLazyFocusTrap.tsx

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import FocusTrap from '@mui/material/Unstable_TrapFocus';
+
+export default function BaseFocusTrap() {
+  const [open, close] = React.useReducer(() => false, true);
+
+  return (
+    <React.Fragment>
+      <button type="button" autoFocus data-testid="initial-focus">
+        initial focus
+      </button>
+      <FocusTrap isEnabled={() => true} open={open} disableAutoFocus>
+        <div data-testid="root">
+          <div>Title</div>
+          <button type="button" onClick={close}>
+            close
+          </button>
+          <button type="button">noop</button>
+        </div>
+      </FocusTrap>
+    </React.Fragment>
+  );
+}

test/e2e/fixtures/FocusTrap/DisableEnforceFocusFocusTrap.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import FocusTrap from '@mui/material/Unstable_TrapFocus';
+
+export default function disableEnforceFocusFocusTrap() {
+  return (
+    <React.Fragment>
+      <button data-testid="initial-focus" type="button" autoFocus>
+        initial focus
+      </button>
+      <FocusTrap open disableEnforceFocus disableAutoFocus>
+        <div data-testid="root">
+          <button data-testid="inside-trap-focus" type="button">
+            inside focusable
+          </button>
+        </div>
+      </FocusTrap>
+    </React.Fragment>
+  );
+}

test/e2e/fixtures/FocusTrap/OpenFocusTrap.tsx

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import FocusTrap from '@mui/material/Unstable_TrapFocus';
+
+export default function OpenFocusTrap() {
+  return (
+    <React.Fragment>
+      <button type="button" autoFocus data-testid="initial-focus">
+        initial focus
+      </button>
+      <FocusTrap isEnabled={() => true} open>
+        <div tabIndex={-1} data-testid="root">
+          <div>Title</div>
+          <button type="button">confirm</button>
+          <button type="button">cancel</button>
+          <button type="button">ok</button>
+        </div>
+      </FocusTrap>
+    </React.Fragment>
+  );
+}