@cssints/apg-specs 0.0.0-stage → 0.5.1

package/scenarios/apg/alert.base-ui.json

@@ -0,0 +1,81 @@
+{
+  "pattern": "alert",
+  "source": "base-ui",
+  "commit": "19511bb171f3b360b006c94cf6d07e53cb446505",
+  "license": "MIT",
+  "skipped": [
+    {
+      "reason": "Toast.Viewport > sets the measured frontmost toast height CSS variable"
+    },
+    { "reason": "Toast.Viewport > gets focused when F6 is pressed" },
+    {
+      "reason": "Toast.Viewport > focuses first toast upon tab after viewport is focused"
+    },
+    { "reason": "Toast.Root > sets the vertical offset CSS variable" },
+    { "reason": "Toast.Root > swipe behavior" },
+    { "reason": "Toast.Provider > timer and focus restoration suites" }
+  ],
+  "scenarios": [
+    {
+      "id": "alert.base-ui.high-priority-toast-is-alert",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/toast/useToastManager.test.tsx#L706",
+      "upstreamTest": "useToastManager > option: priority > applies correct ARIA attributes for high priority toasts",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        { "event": "click", "target": "add-high" },
+        {
+          "expect": {
+            "attrs": {
+              "root": { "role": "alertdialog", "aria-modal": "false" },
+              "alert": { "role": "alert", "aria-atomic": "true" }
+            }
+          }
+        },
+        { "event": "click", "target": "close" },
+        {
+          "expect": { "attrs": { "alert": { "role": null } } }
+        }
+      ]
+    },
+    {
+      "id": "alert.base-ui.default-toast-has-live-alert",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/toast/viewport/ToastViewport.tsx#L266",
+      "upstreamTest": "Toast.Viewport renders each toast in a role=alert, aria-atomic wrapper",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        { "event": "click", "target": "add" },
+        {
+          "expect": {
+            "attrs": { "alert": { "role": "alert", "aria-atomic": "true" } }
+          }
+        }
+      ],
+      "notes": "The alert wrapper is part of the viewport render and applies to every toast, not only priority ones."
+    },
+    {
+      "id": "alert.base-ui.toast-labelled-and-described-by-parts",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/toast/root/ToastRoot.test.tsx#L112",
+      "upstreamTest": "Toast.Root > keeps dynamic title and description ids synchronized with mounted label parts",
+      "apg": "aria",
+      "config": {
+        "titleId": "toast-title",
+        "descriptionId": "toast-description"
+      },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "root": {
+                "aria-labelledby": "toast-title",
+                "aria-describedby": "toast-description"
+              }
+            }
+          }
+        }
+      ],
+      "notes": "Upstream uses generated ids; pinned ids restate the same label association."
+    }
+  ]
+}

package/scenarios/apg/alert.react-aria.json

@@ -0,0 +1,98 @@
+{
+  "pattern": "alert",
+  "source": "react-aria",
+  "commit": "99e610236887da619ad9d54a1cd87983166c043d",
+  "license": "Apache-2.0",
+  "skipped": [
+    { "reason": "Toast > should render with default class" },
+    { "reason": "Toast > pauses timers when hovering" },
+    { "reason": "Toast > pauses timers when focusing" },
+    { "reason": "Toast > should restore focus when a toast exits" },
+    { "reason": "Toast > should restore focus when removing with the mouse" },
+    { "reason": "useToast > handles close button" },
+    { "reason": "useToast > passes through data attributes" },
+    {
+      "reason": "single toast at a time > moves focus to the next toast when it appears"
+    }
+  ],
+  "scenarios": [
+    {
+      "id": "alert.react-aria.toast-content-role-alert",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria/test/toast/useToast.test.js#L36",
+      "upstreamTest": "useToast > handles defaults",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "content": { "role": "alert" },
+              "toast": { "role": "alertdialog" },
+              "close": { "aria-label": "Close" }
+            }
+          }
+        }
+      ],
+      "notes": "The live announcement is role=alert on the toast content; the surrounding toast is an alertdialog so it can also hold focus."
+    },
+    {
+      "id": "alert.react-aria.live-toast-exposes-alert",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Toast.test.js#L72",
+      "upstreamTest": "Toast > should trigger a toast",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        {
+          "expect": {
+            "attrs": { "toast": { "role": null }, "content": { "role": null } }
+          }
+        },
+        { "event": "click", "target": "add" },
+        {
+          "expect": {
+            "attrs": {
+              "toast": { "role": "alertdialog", "aria-modal": "false" },
+              "content": { "role": "alert" }
+            }
+          }
+        },
+        { "event": "click", "target": "close" },
+        {
+          "expect": {
+            "attrs": { "toast": { "role": null }, "content": { "role": null } }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alert.react-aria.no-alert-before-message",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Toast.test.js#L77",
+      "upstreamTest": "Toast > should trigger a toast (no alertdialog or alert rendered before adding)",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        {
+          "expect": {
+            "attrs": { "toast": { "role": null }, "content": { "role": null } }
+          }
+        }
+      ],
+      "notes": "An empty queue renders no live region: the alert only exists with a message."
+    },
+    {
+      "id": "alert.react-aria.region-labelled-by-announcement-count",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Toast.test.js#L83",
+      "upstreamTest": "Toast > should trigger a toast (toast region aria-label describes the number of notifications)",
+      "apg": "announcements",
+      "config": {},
+      "steps": [
+        { "event": "click", "target": "add" },
+        {
+          "expect": {
+            "attrs": { "region": { "aria-label": "1 notification." } }
+          }
+        }
+      ]
+    }
+  ]
+}

package/scenarios/apg/alertdialog.base-ui.json

@@ -0,0 +1,331 @@
+{
+  "pattern": "alertdialog",
+  "source": "base-ui",
+  "commit": "19511bb171f3b360b006c94cf6d07e53cb446505",
+  "license": "MIT",
+  "skipped": [
+    {
+      "reason": "styling / CSS-variable assertions and popup conformance (popupConformanceTests)"
+    },
+    {
+      "reason": "enter/exit transition timing and onOpen/onClose animation callbacks"
+    },
+    {
+      "reason": "detached-trigger hydration plumbing (payload, root/handle swapping, remount) that does not change observed behaviour"
+    },
+    { "reason": "imperative handle payload tests" },
+    {
+      "reason": "React-API-only: reuses the popup DOM node when switching triggers, manual unmount bookkeeping"
+    }
+  ],
+  "scenarios": [
+    {
+      "id": "alertdialog.base-ui.aria-labelledby-and-describedby",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L32",
+      "upstreamTest": "ARIA attributes",
+      "apg": "wai-aria",
+      "config": { "open": true, "modal": true },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "attrs": {
+              "dialog": {
+                "role": "alertdialog",
+                "aria-labelledby": "title",
+                "aria-describedby": "description"
+              }
+            }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.trigger-aria-expanded-controls-controlled",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L57",
+      "upstreamTest": "synchronizes trigger ARIA attributes in controlled mode",
+      "apg": "wai-aria",
+      "config": {
+        "open": true,
+        "triggerCount": 2,
+        "activeTrigger": "trigger:1"
+      },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "trigger:0": { "aria-expanded": "false", "aria-controls": null },
+              "trigger:1": {
+                "aria-expanded": "true",
+                "aria-controls": "dialog"
+              }
+            }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.trigger-aria-expanded-initially-open-handle",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L78",
+      "upstreamTest": "synchronizes trigger ARIA attributes when initially open with a handle",
+      "apg": "wai-aria",
+      "config": { "open": true, "handle": true },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "trigger": { "aria-expanded": "true", "aria-controls": "dialog" }
+            }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.detached-trigger-aria-expanded",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L97",
+      "upstreamTest": "synchronizes detached trigger ARIA attributes when initially open with a handle",
+      "apg": "wai-aria",
+      "config": { "open": true, "handle": true, "detachedTrigger": true },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "trigger": { "aria-expanded": "true", "aria-controls": "dialog" }
+            },
+            "events": { "handleIsOpen": [true] }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.onopenchange-new-state",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L136",
+      "upstreamTest": "calls onOpenChange with the new open state",
+      "apg": "extension",
+      "config": {},
+      "steps": [
+        { "event": "click", "target": "trigger" },
+        { "expect": { "events": { "onOpenChange": [true] } } },
+        { "event": "click", "target": "dismiss" },
+        { "expect": { "events": { "onOpenChange": [true, false] } } }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.onopenchange-reason-trigger-and-close",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L165",
+      "upstreamTest": "calls onOpenChange with the reason for change when clicked on trigger and close button",
+      "apg": "extension",
+      "config": {},
+      "steps": [
+        { "event": "click", "target": "trigger" },
+        {
+          "expect": {
+            "events": {
+              "onOpenChange": [{ "open": true, "reason": "triggerPress" }]
+            }
+          }
+        },
+        { "event": "click", "target": "dismiss" },
+        {
+          "expect": {
+            "events": {
+              "onOpenChange": [
+                { "open": true, "reason": "triggerPress" },
+                { "open": false, "reason": "closePress" }
+              ]
+            }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.escape-close-reason",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L196",
+      "upstreamTest": "calls onOpenChange with the reason for change when pressed Esc while the dialog is open",
+      "apg": "keyboard",
+      "config": { "open": true, "modal": true },
+      "steps": [
+        { "event": "key", "key": "Escape", "target": "dialog" },
+        {
+          "expect": {
+            "events": {
+              "onOpenChange": [{ "open": false, "reason": "escapeKey" }]
+            }
+          }
+        }
+      ],
+      "notes": "Escape closes by default; APG allows alertdialogs to require an explicit action by not handling Escape, which is an author choice upstream does not make."
+    },
+    {
+      "id": "alertdialog.base-ui.backdrop-click-does-not-close",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L216",
+      "upstreamTest": "does not close when the backdrop is clicked",
+      "apg": "keyboard",
+      "config": { "open": true, "modal": true },
+      "steps": [
+        { "event": "click", "target": "backdrop" },
+        {
+          "expect": { "visible": ["dialog"], "events": { "onOpenChange": [] } }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.controlled-vetoed-close-keeps-open",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L236",
+      "upstreamTest": "keeps the trigger data-popup-open attribute and handle.isOpen when a controlled close is vetoed",
+      "apg": "extension",
+      "config": { "controlled": true, "vetoClose": true, "handle": true },
+      "steps": [
+        { "event": "click", "target": "trigger" },
+        { "event": "click", "target": "dismiss" },
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "attrs": { "trigger": { "data-popup-open": "" } },
+            "events": { "handleIsOpen": [true] }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.handle-close-method",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L366",
+      "upstreamTest": "closes the alert dialog when the close method is called",
+      "apg": "extension",
+      "config": { "handle": true },
+      "steps": [
+        { "event": "click", "target": "trigger" },
+        { "expect": { "visible": ["dialog"] } },
+        { "event": "prop", "prop": "handle.close", "value": true },
+        { "expect": { "hidden": ["dialog"] } }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.opens-with-any-trigger",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L390",
+      "upstreamTest": "opens the alert dialog with any trigger",
+      "apg": "extension",
+      "config": { "triggerCount": 2 },
+      "steps": [
+        { "event": "click", "target": "trigger:0" },
+        { "expect": { "visible": ["dialog"] } },
+        { "event": "click", "target": "dismiss" },
+        { "event": "click", "target": "trigger:1" },
+        { "expect": { "visible": ["dialog"] } }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.active-trigger-aria-attributes",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L497",
+      "upstreamTest": "synchronizes ARIA attributes on the active trigger",
+      "apg": "wai-aria",
+      "config": { "triggerCount": 2 },
+      "steps": [
+        { "event": "click", "target": "trigger:0" },
+        {
+          "expect": {
+            "attrs": {
+              "trigger:0": {
+                "aria-expanded": "true",
+                "aria-controls": "dialog"
+              },
+              "trigger:1": { "aria-expanded": "false", "aria-controls": null }
+            }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.handle-backed-enforces-alert-state",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L868",
+      "upstreamTest": "enforces alert dialog state for handle-backed roots",
+      "apg": "wai-aria",
+      "config": { "handle": true },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "dialog": {
+                "data-modal": "true",
+                "data-disable-pointer-dismissal": "true",
+                "data-role": "alertdialog"
+              }
+            }
+          }
+        },
+        { "event": "click", "target": "trigger" },
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "events": { "handleIsOpen": [true] }
+          }
+        },
+        { "event": "click", "target": "backdrop" },
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "events": { "handleIsOpen": [true] }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.handle-backed-backdrop-click-keeps-open",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L902",
+      "upstreamTest": "keeps the alert dialog open when the backdrop is clicked",
+      "apg": "keyboard",
+      "config": { "handle": true },
+      "steps": [
+        { "event": "click", "target": "trigger" },
+        { "expect": { "visible": ["dialog"] } },
+        { "event": "click", "target": "backdrop" },
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "events": { "handleIsOpen": [true] }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.handle-open-and-close",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L931",
+      "upstreamTest": "opens and closes the dialog",
+      "apg": "extension",
+      "config": { "handle": true },
+      "steps": [
+        { "event": "prop", "prop": "handle.open", "value": true },
+        {
+          "expect": {
+            "visible": ["dialog"],
+            "attrs": { "trigger": { "aria-expanded": "true" } }
+          }
+        },
+        { "event": "prop", "prop": "handle.close", "value": true },
+        {
+          "expect": {
+            "hidden": ["dialog"],
+            "attrs": { "trigger": { "aria-expanded": "false" } }
+          }
+        }
+      ]
+    },
+    {
+      "id": "alertdialog.base-ui.modal-inerts-page",
+      "upstream": "https://github.com/mui/base-ui/blob/19511bb171f3b360b006c94cf6d07e53cb446505/packages/react/src/alert-dialog/root/AlertDialogRoot.test.tsx#L1047",
+      "upstreamTest": "makes other interactive elements on the page inert when a modal dialog is open",
+      "apg": "wai-aria",
+      "config": { "open": true, "modal": true },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["dialog", "backdrop"],
+            "attrs": {
+              "dialog": { "role": "alertdialog", "aria-modal": "true" }
+            }
+          }
+        }
+      ]
+    }
+  ]
+}