Cannot access button in a tooltip via keyboard navigation

[teresamonahan]

When a button is the first focusable element in a tooltip, the button never gets focus when the tooltip is opened via keyboard navigation. If there are other interactive elements in the tooltip after the button, there is no way to put focus on them either using just the keyboard.

Environment

Operating system - MacOS 10.15.5
Browser - Chrome

Detailed description

Sandbox example: https://codesandbox.io/s/wizardly-easley-gqs06?file=/src/index.js
When I click on the tooltip with the mouse, it opens and focus goes to the button. However when I tab to the tooltip, it opens but focus does not go to the button and I cannot see a way to get focus on the button with the keyboard.

I am also seeing this issue in the storybook when I specify the button as the selectorPrimaryFocus element.

What version of the Carbon Design System are you using?

"carbon-components": "10.16.0",
"carbon-components-react": "7.16.0",

What did you expect to happen?
Focus should go directly to the button when the user tabs to the tooltip and it opens

What happened instead?
Focus doesn't go to the button and there is no way to put focus on the button with just the keyboard

Steps to reproduce the issue

1. Go to https://codesandbox.io/s/wizardly-easley-gqs06?file=/src/index.js
2. Tab to the tooltip
   Note focus does not go to the button

Alternatively add '.bx--tooltip__footer Button' as the selectorPrimaryFocus in the storybook example at https://react.carbondesignsystem.com/?path=/story/tooltip--default-bottom and tab to the tooltip.