Add continuePropagation to focus events

Author: trueadm

packages/react-interactions/accessibility/src/FocusManager.js

@@ -62,6 +62,9 @@ const FocusManager = React.forwardRef(
     });
     const focusWithin = useFocusWithin({
       onBlurWithin: function(event) {
+        if (!containFocus) {
+          event.continuePropagation();
+        }
         const lastNode = event.target;
         if (lastNode) {
           requestAnimationFrame(() => {

packages/react-interactions/accessibility/src/__tests__/FocusManager-test.internal.js

@@ -141,8 +141,8 @@ describe('FocusManager', () => {
       expect(document.activeElement).toBe(button2Ref.current);
       // Focus should be restored to the contained area
       const rAF = window.requestAnimationFrame;
-      window.requestAnimationFrame = (x) => setTimeout(x);
-      input3Ref.current.focus();      
+      window.requestAnimationFrame = x => setTimeout(x);
+      input3Ref.current.focus();
       jest.advanceTimersByTime(1);
       window.requestAnimationFrame = rAF;
       expect(document.activeElement).toBe(button2Ref.current);

packages/react-interactions/events/src/dom/Focus.js

@@ -26,6 +26,7 @@ type FocusEvent = {|
   type: FocusEventType | FocusWithinEventType,
   pointerType: PointerType,
   timeStamp: number,
+  continuePropagation: () => void,
 |};
 
 type FocusState = {
@@ -93,6 +94,14 @@ function createFocusEvent(
     type,
     pointerType,
     timeStamp: context.getTimeStamp(),
+    // We don't use stopPropagation, as the default behavior
+    // is to not propagate. Plus, there might be confusion
+    // using stopPropagation as we don't actually stop
+    // native propagation from working, but instead only
+    // allow propagation to the others keyboard responders.
+    continuePropagation() {
+      context.continuePropagation();
+    },
   };
 }