focus-trap 8.1.0 → 8.2.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 8.2.1
+
+### Patch Changes
+
+- 7e0e518: Fixes lifecycle ordering bug introduced in v8.0.0 that always delays the order even if `delayInitialFocus=false`, `delayReturnFocus=false`, `checkCanFocusTrap=undefined`, `checkCanReturnFocus=undefined` (which would indicate a fully synchronous activation/pause/unpause/deactivation process) [#1862](https://github.com/focus-trap/focus-trap/issues/1862)
+- 2cba31e: Improve shadow DOM focus handling for nested traps by ensuring a parent trap resumes using the innermost active element ([#1885](https://github.com/focus-trap/focus-trap/issues/1885))
+
+## 8.2.0
+
+### Minor Changes
+
+- 567dbe1: Add new `delayReturnFocus` option (default true) to control whether return focus and onPostDeactivate are deferred by one frame (#1689).
+
+### Patch Changes
+
+- b70e8d9: Fix bug where removing the ancestor of a focused node within a trap would result in focus landing on the body instead of remaining in the trap (#1660).
+
 ## 8.1.0
 
 ### Minor Changes

package/README.md

@@ -150,6 +150,7 @@ Note that if [delayInitialFocus](#delayinitialfocus) is true, this handler will
 Animated dialogs have a small delay between when `onActivate` is called and when the focus trap is focusable. `checkCanFocusTrap` expects a promise to be returned. When that promise settles (resolves or rejects), focus will be sent to the first tabbable node (in tab order) in the focus trap (or the node configured in the `initialFocus` option).
 
 🔺 It does not matter whether the Promise resolves or rejects, only that it settles. A rejected Promise will not result in cancellation of trap activation.
+🔺 This controls **when activation may proceed**. The separate [delayInitialFocus](#delayinitialfocus) option controls whether there is an additional one-frame delay before focus is sent once activation can proceed.
 
 ##### onDeactivate
 
@@ -167,6 +168,8 @@ A function that will be called **before** returning focus to the node that had f
 
 A function that will be called after the trap is deactivated, after `onDeactivate`. If the `returnFocus` deactivation option was set, it will be called **after** returning focus to the node that had focus prior to activation (or configured with the `setReturnFocus` option) upon deactivation; otherwise, it will be called after deactivation completes.
 
+By default, this callback is delayed by one frame along with return-focus timing; set [delayReturnFocus](#delayreturnfocus) to `false` to remove that extra delay.
+
 ##### checkCanReturnFocus
 
 ```typescript
@@ -175,6 +178,8 @@ A function that will be called after the trap is deactivated, after `onDeactivat
 
 An animated trigger button will have a small delay between when `onDeactivate` is called and when the focus is able to be sent back to the trigger. `checkCanReturnFocus` expects a promise to be returned. When that promise settles (resolves or rejects), focus will be sent to to the node that had focus prior to the activation of the trap (or the node configured in the `setReturnFocus` option).
 
+🔺 If [delayReturnFocus](#delayreturnfocus) is `true` (default), there is still an additional one-frame delay after this Promise settles before focus is returned and `onPostDeactivate` is called.
+
 ##### initialFocus
 
 ```typescript
@@ -272,6 +277,19 @@ boolean
 Default: `true`. Delays the autofocus to the next execution frame when the focus trap is activated. This prevents elements within the focusable element from capturing the event that triggered the focus trap activation.
 
 🔺 Note that when this option is `true` (default), it means the initial element to be focused will not be focused until **after** [onPostActivate](#onpostactivate) or [onPostUnpause](#onpostunpause) are called.
+🔺 This option controls the extra frame delay on activation. Use [checkCanFocusTrap](#checkcanfocustrap) to gate activation readiness, and [delayReturnFocus](#delayreturnfocus) plus [checkCanReturnFocus](#checkcanreturnfocus) for the equivalent deactivation timing controls.
+
+##### delayReturnFocus
+
+```typescript
+boolean
+```
+
+Default: `true`. Delays return-focus to the next execution frame when the focus trap is deactivated.
+
+- This same delay also applies to [onPostDeactivate](#onpostdeactivate).
+- Set to `false` to skip the extra frame delay.
+- If [checkCanReturnFocus](#checkcanreturnfocus) is configured, that Promise must still settle first.
 
 ##### isolateSubtrees
 
@@ -410,7 +428,7 @@ These options are used to override the focus trap's default behavior for this pa
 - **returnFocus** `{boolean}`: Default: whatever you set for `createOptions.returnFocusOnDeactivate`. If `true`, then the `setReturnFocus` option (specified when the trap was created) is used to determine where focus will be returned.
 - **onDeactivate** `{(params: LifecycleParameters) => void}`: Default: whatever you set for `createOptions.onDeactivate`. `null` or `false` are the equivalent of a `noop`.
 - **onPostDeactivate** `{(params: LifecycleParameters) => void}`: Default: whatever you set for `createOptions.onPostDeactivate`. `null` or `false` are the equivalent of a `noop`.
-- **checkCanReturnFocus** `{(trigger: HTMLElement | SVGElement) => Promise<void>}`: Default: whatever you set for `createOptions.checkCanReturnFocus`. Not called if the `returnFocus` option is falsy. `trigger` is either the originally focused node prior to activation, or the result of the `setReturnFocus` configuration option.
+- **checkCanReturnFocus** `{(trigger: HTMLElement | SVGElement) => Promise<void>}`: Default: whatever you set for `createOptions.checkCanReturnFocus`. Not called if the `returnFocus` option is falsy. `trigger` is either the originally focused node prior to activation, or the result of the `setReturnFocus` configuration option. After this Promise settles, `createOptions.delayReturnFocus` determines whether return-focus and `onPostDeactivate` are immediate (`false`) or delayed by one frame (`true`, default).
 
 ### trap.pause()
 
@@ -589,7 +607,7 @@ In alphabetical order:
       <td align="center" valign="top" width="14.28%"><a href="http://davidtheclark.com/"><img src="https://avatars2.githubusercontent.com/u/628431?v=4?s=100" width="100px;" alt="David Clark"/><br /><sub><b>David Clark</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap/commits?author=davidtheclark" title="Code">💻</a> <a href="https://github.com/focus-trap/focus-trap/issues?q=author%3Adavidtheclark" title="Bug reports">🐛</a> <a href="#infra-davidtheclark" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a> <a href="https://github.com/focus-trap/focus-trap/commits?author=davidtheclark" title="Tests">⚠️</a> <a href="https://github.com/focus-trap/focus-trap/commits?author=davidtheclark" title="Documentation">📖</a> <a href="#maintenance-davidtheclark" title="Maintenance">🚧</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/features/security"><img src="https://avatars1.githubusercontent.com/u/27347476?v=4?s=100" width="100px;" alt="Dependabot"/><br /><sub><b>Dependabot</b></sub></a><br /><a href="#maintenance-dependabot" title="Maintenance">🚧</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/ShGKme"><img src="https://avatars.githubusercontent.com/u/25978914?v=4?s=100" width="100px;" alt="Grigorii K. Shartsev"/><br /><sub><b>Grigorii K. Shartsev</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap/issues?q=author%3AShGKme" title="Bug reports">🐛</a></td>
-      <td align="center" valign="top" width="14.28%"><a href="https://github.com/jcfranco"><img src="https://avatars.githubusercontent.com/u/197440?v=4?s=100" width="100px;" alt="JC Franco"/><br /><sub><b>JC Franco</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap/commits?author=jcfranco" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/jcfranco"><img src="https://avatars.githubusercontent.com/u/197440?v=4?s=100" width="100px;" alt="JC Franco"/><br /><sub><b>JC Franco</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap/commits?author=jcfranco" title="Code">💻</a> <a href="https://github.com/focus-trap/focus-trap/issues?q=author%3Ajcfranco" title="Bug reports">🐛</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://www.schilljs.com/"><img src="https://avatars.githubusercontent.com/u/213943?v=4?s=100" width="100px;" alt="Joas Schilling"/><br /><sub><b>Joas Schilling</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap/pulls?q=is%3Apr+reviewed-by%3Anickvergessen" title="Reviewed Pull Requests">👀</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/skjnldsv"><img src="https://avatars.githubusercontent.com/u/14975046?v=4?s=100" width="100px;" alt="John Molakvoæ"/><br /><sub><b>John Molakvoæ</b></sub></a><br /><a href="#ideas-skjnldsv" title="Ideas, Planning, & Feedback">🤔</a></td>
     </tr>

package/dist/focus-trap.esm.js

@@ -1,8 +1,8 @@
 /*!
-* focus-trap 8.1.0
+* focus-trap 8.2.1
 * @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE
 */
-import { isFocusable, tabbable, focusable, isTabbable, getTabIndex } from 'tabbable';
+import { tabbable, focusable, isTabbable, getTabIndex, isFocusable } from 'tabbable';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -12,31 +12,6 @@ function _arrayLikeToArray(r, a) {
 function _arrayWithoutHoles(r) {
   if (Array.isArray(r)) return _arrayLikeToArray(r);
 }
-function asyncGeneratorStep(n, t, e, r, o, a, c) {
-  try {
-    var i = n[a](c),
-      u = i.value;
-  } catch (n) {
-    return void e(n);
-  }
-  i.done ? t(u) : Promise.resolve(u).then(r, o);
-}
-function _asyncToGenerator(n) {
-  return function () {
-    var t = this,
-      e = arguments;
-    return new Promise(function (r, o) {
-      var a = n.apply(t, e);
-      function _next(n) {
-        asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
-      }
-      function _throw(n) {
-        asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
-      }
-      _next(void 0);
-    });
-  };
-}
 function _createForOfIteratorHelper(r, e) {
   var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
   if (!t) {
@@ -120,114 +95,6 @@ function _objectSpread2(e) {
   }
   return e;
 }
-function _regenerator() {
-  /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
-  var e,
-    t,
-    r = "function" == typeof Symbol ? Symbol : {},
-    n = r.iterator || "@@iterator",
-    o = r.toStringTag || "@@toStringTag";
-  function i(r, n, o, i) {
-    var c = n && n.prototype instanceof Generator ? n : Generator,
-      u = Object.create(c.prototype);
-    return _regeneratorDefine(u, "_invoke", function (r, n, o) {
-      var i,
-        c,
-        u,
-        f = 0,
-        p = o || [],
-        y = false,
-        G = {
-          p: 0,
-          n: 0,
-          v: e,
-          a: d,
-          f: d.bind(e, 4),
-          d: function (t, r) {
-            return i = t, c = 0, u = e, G.n = r, a;
-          }
-        };
-      function d(r, n) {
-        for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
-          var o,
-            i = p[t],
-            d = G.p,
-            l = i[2];
-          r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
-        }
-        if (o || r > 1) return a;
-        throw y = true, n;
-      }
-      return function (o, p, l) {
-        if (f > 1) throw TypeError("Generator is already running");
-        for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
-          i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
-          try {
-            if (f = 2, i) {
-              if (c || (o = "next"), t = i[o]) {
-                if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
-                if (!t.done) return t;
-                u = t.value, c < 2 && (c = 0);
-              } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
-              i = e;
-            } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
-          } catch (t) {
-            i = e, c = 1, u = t;
-          } finally {
-            f = 1;
-          }
-        }
-        return {
-          value: t,
-          done: y
-        };
-      };
-    }(r, o, i), true), u;
-  }
-  var a = {};
-  function Generator() {}
-  function GeneratorFunction() {}
-  function GeneratorFunctionPrototype() {}
-  t = Object.getPrototypeOf;
-  var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
-      return this;
-    }), t),
-    u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
-  function f(e) {
-    return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
-  }
-  return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
-    return this;
-  }), _regeneratorDefine(u, "toString", function () {
-    return "[object Generator]";
-  }), (_regenerator = function () {
-    return {
-      w: i,
-      m: f
-    };
-  })();
-}
-function _regeneratorDefine(e, r, n, t) {
-  var i = Object.defineProperty;
-  try {
-    i({}, "", {});
-  } catch (e) {
-    i = 0;
-  }
-  _regeneratorDefine = function (e, r, n, t) {
-    function o(r, n) {
-      _regeneratorDefine(e, r, function (e) {
-        return this._invoke(r, n, e);
-      });
-    }
-    r ? i ? i(e, r, {
-      value: n,
-      enumerable: !t,
-      configurable: !t,
-      writable: !t
-    }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
-  }, _regeneratorDefine(e, r, n, t);
-}
 function _toConsumableArray(r) {
   return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
 }
@@ -356,6 +223,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
     returnFocusOnDeactivate: true,
     escapeDeactivates: true,
     delayInitialFocus: true,
+    delayReturnFocus: true,
     isolateSubtrees: false,
     isKeyForward: isKeyForward,
     isKeyBackward: isKeyBackward
@@ -505,6 +373,25 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
     }
     return node;
   };
+
+  /**
+   * Gets the current activeElement. If it's a web-component and has open shadow-root
+   * it will recursively search inside shadow roots for the "true" activeElement.
+   *
+   * @param {Document | ShadowRoot} el
+   *
+   * @returns {HTMLElement|null} The element that currently has the focus. `null` if a focused element isn't found.
+   **/
+  var _getActiveElement = function getActiveElement(el) {
+    var activeElement = el.activeElement;
+    if (!activeElement) {
+      return null;
+    }
+    if (activeElement.shadowRoot && activeElement.shadowRoot.activeElement !== null) {
+      return _getActiveElement(activeElement.shadowRoot);
+    }
+    return activeElement;
+  };
   var getInitialFocusNode = function getInitialFocusNode() {
     var node = getNodeForOption('initialFocus', {
       hasFallback: true
@@ -515,9 +402,11 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
       return false;
     }
     if (node === undefined || node && !isFocusable(node, config.tabbableOptions)) {
+      var activeElement = _getActiveElement(doc);
+
       // option not specified nor focusable: use fallback options
-      if (findContainerIndex(doc.activeElement) >= 0) {
-        node = doc.activeElement;
+      if (findContainerIndex(activeElement) >= 0) {
+        node = activeElement;
       } else {
         var firstTabbableGroup = state.tabbableGroups[0];
         var firstTabbableNode = firstTabbableGroup && firstTabbableGroup.firstTabbableNode;
@@ -629,25 +518,6 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
       throw new Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.");
     }
   };
-
-  /**
-   * Gets the current activeElement. If it's a web-component and has open shadow-root
-   * it will recursively search inside shadow roots for the "true" activeElement.
-   *
-   * @param {Document | ShadowRoot} el
-   *
-   * @returns {HTMLElement} The element that currently has the focus
-   **/
-  var _getActiveElement = function getActiveElement(el) {
-    var activeElement = el.activeElement;
-    if (!activeElement) {
-      return;
-    }
-    if (activeElement.shadowRoot && activeElement.shadowRoot.activeElement !== null) {
-      return _getActiveElement(activeElement.shadowRoot);
-    }
-    return activeElement;
-  };
   var _tryFocus = function tryFocus(node) {
     if (node === false) {
       return;
@@ -968,12 +838,13 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
   /**
    * Adds listeners to the document necessary for trapping focus and attempts to set focus
    *  to the configured initial focus node. Does nothing if the trap isn't active.
-   * @returns {Promise<void>} Resolved (always) once the initial focus node has been focused.
-   *  Also resolved if the trap isn't active.
+   * @returns {Promise<void> | undefined} A promise resolved once the initial focus node has
+   *  been focused when `delayInitialFocus=true`; `undefined` when focus is set synchronously
+   *  or the trap isn't active.
    */
   var addListeners = function addListeners() {
     if (!state.active) {
-      return Promise.resolve();
+      return;
     }
 
     // There can be only one listening focus trap at a time
@@ -981,7 +852,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
 
     // Delay ensures that the focused element doesn't capture the event
     // that caused the focus trap activation.
-    /** @type {Promise<void>} */
+    /** @type {Promise<void> | undefined} */
     var promise;
     if (config.delayInitialFocus) {
       // NOTE: Promise constructor callback is called synchronously, which is what we want
@@ -993,7 +864,6 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
         });
       });
     } else {
-      promise = Promise.resolve();
       _tryFocus(getInitialFocusNode());
     }
     doc.addEventListener('focusin', checkFocusIn, true);
@@ -1102,17 +972,27 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
   //
 
   var checkDomRemoval = function checkDomRemoval(mutations) {
+    var focusedNode = state.mostRecentlyFocusedNode;
+    if (!focusedNode) {
+      return;
+    }
     var isFocusedNodeRemoved = mutations.some(function (mutation) {
       var removedNodes = Array.from(mutation.removedNodes);
       return removedNodes.some(function (node) {
-        return node === state.mostRecentlyFocusedNode;
+        return node === focusedNode || typeof node.contains === 'function' && node.contains(focusedNode);
       });
     });
 
-    // If the currently focused is removed then browsers will move focus to the
+    // If the currently focused node is removed then browsers will move focus to the
     // <body> element. If this happens, try to move focus back into the trap.
-    if (isFocusedNodeRemoved) {
-      _tryFocus(getInitialFocusNode());
+    if (isFocusedNodeRemoved && state.containers.some(function (container) {
+      return container === null || container === void 0 ? void 0 : container.isConnected;
+    })) {
+      // Refresh tabbable state before resolving initial focus because
+      // getInitialFocusNode() may fall back to the first tabbable node in the trap.
+      updateTabbableNodes();
+      var initialFocusNode = getInitialFocusNode();
+      _tryFocus(initialFocusNode);
     }
   };
 
@@ -1175,37 +1055,30 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
         onActivate === null || onActivate === void 0 || onActivate({
           trap: trap
         });
-        var finishActivation = /*#__PURE__*/function () {
-          var _ref6 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
-            return _regenerator().w(function (_context) {
-              while (1) switch (_context.n) {
-                case 0:
-                  if (checkCanFocusTrap) {
-                    updateTabbableNodes();
-                  }
-
-                  // NOTE: wait for initial focus node to get focused before we potentially isolate
-                  //  the subtrees with aria-hidden while focus is still in some other subtree and
-                  //  not yet in the trap, resulting in some browsers (e.g. Chrome) logging to the
-                  //  console that they, "Blocked aria-hidden on an element because its descendant
-                  //  retained focus..."
-                  _context.n = 1;
-                  return addListeners();
-                case 1:
-                  trap._setSubtreeIsolation(true);
-                  updateObservedNodes();
-                  onPostActivate === null || onPostActivate === void 0 || onPostActivate({
-                    trap: trap
-                  });
-                case 2:
-                  return _context.a(2);
-              }
-            }, _callee);
-          }));
-          return function finishActivation() {
-            return _ref6.apply(this, arguments);
+        var finishActivation = function finishActivation() {
+          if (checkCanFocusTrap) {
+            updateTabbableNodes();
+          }
+          var afterListeners = function afterListeners() {
+            trap._setSubtreeIsolation(true);
+            updateObservedNodes();
+            onPostActivate === null || onPostActivate === void 0 || onPostActivate({
+              trap: trap
+            });
           };
-        }();
+
+          // NOTE: wait for initial focus node to get focused (whether activation is fully,
+          //  partially, or not asynchronous) before we potentially isolate the subtrees
+          //  with aria-hidden while focus is still in some other subtree and not yet in
+          //  the trap, resulting in some browsers (e.g. Chrome) logging to the console that
+          //  they, "Blocked aria-hidden on an element because its descendant retained focus..."
+          var listenersPromise = addListeners();
+          if (listenersPromise) {
+            listenersPromise.then(afterListeners);
+          } else {
+            afterListeners();
+          }
+        };
         if (checkCanFocusTrap) {
           checkCanFocusTrap(state.containers.concat()).then(finishActivation, finishActivation);
           return this;
@@ -1253,20 +1126,26 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
       var onDeactivate = getOption(options, 'onDeactivate');
       var onPostDeactivate = getOption(options, 'onPostDeactivate');
       var checkCanReturnFocus = getOption(options, 'checkCanReturnFocus');
+      var delayReturnFocus = getOption(options, 'delayReturnFocus');
       var returnFocus = getOption(options, 'returnFocus', 'returnFocusOnDeactivate');
       onDeactivate === null || onDeactivate === void 0 || onDeactivate({
         trap: trap
       });
-      var finishDeactivation = function finishDeactivation() {
-        delay(function () {
-          if (returnFocus) {
-            _tryFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation));
-          }
-          onPostDeactivate === null || onPostDeactivate === void 0 || onPostDeactivate({
-            trap: trap
-          });
+      var completeDeactivation = function completeDeactivation() {
+        if (returnFocus) {
+          _tryFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation));
+        }
+        onPostDeactivate === null || onPostDeactivate === void 0 || onPostDeactivate({
+          trap: trap
         });
       };
+      var finishDeactivation = function finishDeactivation() {
+        if (delayReturnFocus && returnFocus) {
+          delay(completeDeactivation);
+        } else {
+          completeDeactivation();
+        }
+      };
       if (returnFocus && checkCanReturnFocus) {
         checkCanReturnFocus(getReturnFocusNode(state.nodeFocusedBeforeActivation)).then(finishDeactivation, finishDeactivation);
         return this;
@@ -1339,35 +1218,28 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
           onUnpause === null || onUnpause === void 0 || onUnpause({
             trap: trap
           });
-          var finishUnpause = /*#__PURE__*/function () {
-            var _ref7 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
-              return _regenerator().w(function (_context2) {
-                while (1) switch (_context2.n) {
-                  case 0:
-                    updateTabbableNodes();
-
-                    // NOTE: wait for initial focus node to get focused before we potentially isolate
-                    //  the subtrees with aria-hidden while focus is still in some other subtree and
-                    //  not yet in the trap, resulting in some browsers (e.g. Chrome) logging to the
-                    //  console that they, "Blocked aria-hidden on an element because its descendant
-                    //  retained focus..."
-                    _context2.n = 1;
-                    return addListeners();
-                  case 1:
-                    trap._setSubtreeIsolation(true);
-                    updateObservedNodes();
-                    onPostUnpause === null || onPostUnpause === void 0 || onPostUnpause({
-                      trap: trap
-                    });
-                  case 2:
-                    return _context2.a(2);
-                }
-              }, _callee2);
-            }));
-            return function finishUnpause() {
-              return _ref7.apply(this, arguments);
+          var finishUnpause = function finishUnpause() {
+            updateTabbableNodes();
+            var afterListeners = function afterListeners() {
+              trap._setSubtreeIsolation(true);
+              updateObservedNodes();
+              onPostUnpause === null || onPostUnpause === void 0 || onPostUnpause({
+                trap: trap
+              });
             };
-          }();
+
+            // NOTE: wait for initial focus node to get focused (whether activation is fully,
+            //  partially, or not asynchronous) before we potentially isolate the subtrees
+            //  with aria-hidden while focus is still in some other subtree and not yet in
+            //  the trap, resulting in some browsers (e.g. Chrome) logging to the console that
+            //  they, "Blocked aria-hidden on an element because its descendant retained focus..."
+            var listenersPromise = addListeners();
+            if (listenersPromise) {
+              listenersPromise.then(afterListeners);
+            } else {
+              afterListeners();
+            }
+          };
           finishUnpause();
         }
         return this;