diff --git a/packages/react-components/react-toast/src/components/Toast/Toast.cy.tsx b/packages/react-components/react-toast/src/components/Toast/Toast.cy.tsx
index 0e4f6ae282ba7..1f6c4622b5c1e 100644
--- a/packages/react-components/react-toast/src/components/Toast/Toast.cy.tsx
+++ b/packages/react-components/react-toast/src/components/Toast/Toast.cy.tsx
@@ -279,4 +279,199 @@ describe('Toast', () => {
.eq(3)
.should('have.text', 'unmounted');
});
+
+ it('should focus most recent toast with shortcut', () => {
+ const Example = () => {
+ const { dispatchToast } = useToastController();
+ const makeToast = () => {
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 500 },
+ );
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 500, root: { id: 'most-recent' } },
+ );
+ };
+
+ return (
+ <>
+
+ e.ctrlKey && e.key === 'm' }} />
+ >
+ );
+ };
+
+ mount();
+ cy.get('#make')
+ .click()
+ .get('#most-recent')
+ .should('exist')
+ .get('body')
+ .type('{ctrl+m}')
+ .get('#most-recent')
+ .should('be.focused');
+ });
+
+ it('should pause all toasts when one is focused', () => {
+ const Example = () => {
+ const { dispatchToast } = useToastController();
+ const makeToast = () => {
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 200 },
+ );
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 200, root: { id: 'most-recent' } },
+ );
+ };
+
+ return (
+ <>
+
+ e.ctrlKey && e.key === 'm' }} />
+ >
+ );
+ };
+
+ mount();
+ cy.get('#make')
+ .click()
+ .get('#most-recent')
+ .should('exist')
+ .get('body')
+ .type('{ctrl+m}')
+ .get('#most-recent')
+ .should('be.focused')
+ .wait(500)
+ .get(`.${toastClassNames.root}`)
+ .should('have.length', 2);
+ });
+
+ it('should dismiss toast with escape and revert focus', () => {
+ const Example = () => {
+ const { dispatchToast } = useToastController();
+ const makeToast = () => {
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 200 },
+ );
+ };
+
+ return (
+ <>
+
+ e.ctrlKey && e.key === 'm' }} />
+ >
+ );
+ };
+
+ mount();
+ cy.get('#make')
+ .click()
+ .get(`.${toastClassNames.root}`)
+ .should('exist')
+ .get('body')
+ .type('{ctrl+m}')
+ .focused()
+ .type('{esc}')
+ .get(`.${toastClassNames.root}`)
+ .should('not.exist')
+ .get('#make')
+ .should('be.focused');
+ });
+
+ it('should dismiss toast and revert focus with escape', () => {
+ const Example = () => {
+ const { dispatchToast } = useToastController();
+ const makeToast = () => {
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 200 },
+ );
+ };
+
+ return (
+ <>
+
+ e.ctrlKey && e.key === 'm' }} />
+ >
+ );
+ };
+
+ mount();
+ cy.get('#make')
+ .click()
+ .get(`.${toastClassNames.root}`)
+ .should('exist')
+ .get('body')
+ .type('{ctrl+m}')
+ .focused()
+ .type('{esc}')
+ .get(`.${toastClassNames.root}`)
+ .should('not.exist')
+ .get('#make')
+ .should('be.focused');
+ });
+
+ it('should revert focus on tab out', () => {
+ const Example = () => {
+ const { dispatchToast } = useToastController();
+ const makeToast = () => {
+ dispatchToast(
+
+ This is a toast
+ ,
+ { timeout: 200, root: { id: 'toast' } },
+ );
+ };
+
+ return (
+ <>
+
+
+
+
+
+ e.ctrlKey && e.key === 'm' }} />
+ >
+ );
+ };
+
+ mount();
+ cy.get('#make')
+ .click()
+ .get('#toast')
+ .should('exist')
+ .get('body')
+ .type('{ctrl+m}')
+ .get('#toast')
+ .should('be.focused')
+ .realPress(['Shift', 'Tab']);
+
+ cy.get('#make').should('be.focused');
+ });
});
diff --git a/packages/react-components/react-toast/src/components/ToastContainer/useToastContainer.ts b/packages/react-components/react-toast/src/components/ToastContainer/useToastContainer.ts
index a5dea231ec4f5..2c13f79ebbb27 100644
--- a/packages/react-components/react-toast/src/components/ToastContainer/useToastContainer.ts
+++ b/packages/react-components/react-toast/src/components/ToastContainer/useToastContainer.ts
@@ -74,7 +74,6 @@ export const useToastContainer_unstable = (
return;
}
const containsActive = !!toastRef.current?.contains(targetDocument?.activeElement ?? null);
- // TODO test this
if (timerTimeout < 0) {
setRunning(true);
return;
diff --git a/packages/react-components/react-toast/src/components/ToastTrigger/ToastTrigger.tsx b/packages/react-components/react-toast/src/components/ToastTrigger/ToastTrigger.tsx
index 7dd94b4bd6550..3e32b2cc34601 100644
--- a/packages/react-components/react-toast/src/components/ToastTrigger/ToastTrigger.tsx
+++ b/packages/react-components/react-toast/src/components/ToastTrigger/ToastTrigger.tsx
@@ -4,7 +4,7 @@ import { renderToastTrigger_unstable } from './renderToastTrigger';
import type { ToastTriggerProps } from './ToastTrigger.types';
/**
- * ToastTrigger component - TODO: add more docs
+ * ToastTrigger component
*/
export const ToastTrigger: React.FC = props => {
const state = useToastTrigger_unstable(props);