@cssints/apg-specs 0.0.0-stage → 0.5.1

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

@@ -0,0 +1,303 @@
+{
+  "pattern": "switch",
+  "source": "react-aria",
+  "commit": "99e610236887da619ad9d54a1cd87983166c043d",
+  "license": "Apache-2.0",
+  "skipped": [
+    {
+      "reason": "class-name / data-* style-hook rendering (default class, custom class, className functions)"
+    },
+    { "reason": "custom render-function plumbing and context slots" },
+    {
+      "reason": "React refs, inputRef, callback refs and context inputRef merging"
+    },
+    {
+      "reason": "form submission, form reset, required validation and aria-describedby description wiring"
+    },
+    {
+      "reason": "S1 (react-spectrum) theme/provider wrappers, isEmphasized styling and form reset"
+    },
+    {
+      "reason": "aria-labelledby / aria-describedby passthrough prop assertions that only forward a literal prop"
+    },
+    { "reason": "SwitchField-only description update tests" }
+  ],
+  "scenarios": [
+    {
+      "id": "switch.react-aria.hover-state-and-callbacks",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L121",
+      "upstreamTest": "Switch > should support hover",
+      "apg": "extension",
+      "config": { "part": "switch" },
+      "steps": [
+        { "event": "prop", "set": {} },
+        { "expect": { "attrs": { "label": { "data-hovered": null } } } },
+        { "event": "hover", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "label": { "data-hovered": "true" } },
+            "events": { "onHoverStart": [1], "onHoverChange": [1] }
+          }
+        },
+        { "event": "unhover", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "label": { "data-hovered": null } },
+            "events": { "onHoverEnd": [1], "onHoverChange": [2] }
+          }
+        }
+      ],
+      "notes": "Hover state lives on the wrapping label element."
+    },
+    {
+      "id": "switch.react-aria.focus-visible-on-tab",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L152",
+      "upstreamTest": "Switch > should support focus ring",
+      "apg": "extension",
+      "config": { "part": "switch" },
+      "steps": [
+        { "event": "prop", "set": {} },
+        { "expect": { "attrs": { "label": { "data-focus-visible": null } } } },
+        { "event": "key", "key": "Tab" },
+        {
+          "expect": {
+            "focus": "switch",
+            "attrs": { "label": { "data-focus-visible": "true" } }
+          }
+        },
+        { "event": "key", "key": "Tab" },
+        { "expect": { "attrs": { "label": { "data-focus-visible": null } } } }
+      ],
+      "notes": "Keyboard focus marks the label data-focus-visible."
+    },
+    {
+      "id": "switch.react-aria.focus-events",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L172",
+      "upstreamTest": "Switch > should support focus events",
+      "apg": "focus",
+      "config": { "part": "switch" },
+      "steps": [
+        { "event": "key", "key": "Tab" },
+        {
+          "expect": {
+            "focus": "switch",
+            "events": { "onFocus": [1], "onFocusChange": [true] }
+          }
+        },
+        { "event": "key", "key": "Tab" },
+        {
+          "expect": {
+            "focus": "button:steal",
+            "events": { "onBlur": [1], "onFocusChange": [false] }
+          }
+        }
+      ],
+      "notes": "onFocusChange mirrors focus/blur transitions."
+    },
+    {
+      "id": "switch.react-aria.press-state-pointer",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L204",
+      "upstreamTest": "Switch > should support press state",
+      "apg": "extension",
+      "config": { "part": "switch" },
+      "steps": [
+        { "event": "pointerdown", "target": "label" },
+        { "expect": { "attrs": { "label": { "data-pressed": "true" } } } },
+        { "event": "pointerup", "target": "label" },
+        {
+          "expect": {
+            "attrs": { "label": { "data-pressed": null } },
+            "events": { "onPress": [1], "onClick": [1], "onClickCapture": [1] }
+          }
+        }
+      ],
+      "notes": "Press feedback sits on the label while the toggle fires on release."
+    },
+    {
+      "id": "switch.react-aria.press-state-keyboard-space",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L235",
+      "upstreamTest": "Switch > should support press state with keyboard",
+      "apg": "keyboard",
+      "config": { "part": "switch" },
+      "steps": [
+        { "event": "key", "key": "Tab" },
+        { "expect": { "focus": "switch" } },
+        { "event": "key", "key": " ", "phase": "down", "target": "switch" },
+        { "expect": { "attrs": { "label": { "data-pressed": "true" } } } },
+        { "event": "key", "key": " ", "phase": "up", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "label": { "data-pressed": null } },
+            "events": { "onPress": [1], "onClick": [1] }
+          }
+        }
+      ],
+      "notes": "Space held down keeps data-pressed until keyup."
+    },
+    {
+      "id": "switch.react-aria.disabled-state",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L264",
+      "upstreamTest": "Switch > should support disabled state",
+      "apg": "states",
+      "config": { "part": "switch", "isDisabled": true },
+      "steps": [
+        { "event": "prop", "set": {} },
+        {
+          "expect": {
+            "attrs": {
+              "switch": { "disabled": "" },
+              "label": { "data-disabled": "true" }
+            }
+          }
+        }
+      ],
+      "notes": "Disabled switch is natively disabled and marks the label data-disabled."
+    },
+    {
+      "id": "switch.react-aria.selected-state-onchange",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L279",
+      "upstreamTest": "Switch > should support selected state",
+      "apg": "states",
+      "config": { "part": "switch", "checked": false },
+      "steps": [
+        { "event": "prop", "set": {} },
+        {
+          "expect": {
+            "attrs": {
+              "switch": { "checked": "false" },
+              "label": { "data-selected": null }
+            }
+          }
+        },
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": {
+              "switch": { "checked": "true" },
+              "label": { "data-selected": "true" }
+            },
+            "events": { "onChange": [true] }
+          }
+        },
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": {
+              "switch": { "checked": "false" },
+              "label": { "data-selected": null }
+            },
+            "events": { "onChange": [false] }
+          }
+        }
+      ],
+      "notes": "Checked state is the native input's checked property; onChange reports the new value."
+    },
+    {
+      "id": "switch.react-aria.read-only-state",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Switch.test.js#L311",
+      "upstreamTest": "Switch > should support read only state",
+      "apg": "states",
+      "config": { "part": "switch", "isReadOnly": true },
+      "steps": [
+        { "event": "prop", "set": {} },
+        {
+          "expect": {
+            "attrs": {
+              "switch": { "aria-readonly": "true" },
+              "label": { "data-readonly": "" }
+            }
+          }
+        }
+      ],
+      "notes": "Read-only switch exposes aria-readonly and data-readonly."
+    },
+    {
+      "id": "switch.react-aria.s1-switch-unchecked-click",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/switch/Switch.test.js#L30",
+      "upstreamTest": "Switch > Switch default unchecked can be checked",
+      "apg": "states",
+      "config": { "part": "switch", "nativelyWrapped": true },
+      "steps": [
+        { "event": "prop", "set": {} },
+        {
+          "expect": {
+            "attrs": { "switch": { "value": "on", "checked": "false" } }
+          }
+        },
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "switch": { "checked": "true" } },
+            "events": { "onChange": [true] }
+          }
+        },
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "switch": { "checked": "false" } },
+            "events": { "onChange": [false] }
+          }
+        }
+      ],
+      "notes": "S1 switch is a labelled checkbox input with role switch; default value is 'on'."
+    },
+    {
+      "id": "switch.react-aria.s1-switch-disabled",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/switch/Switch.test.js#L98",
+      "upstreamTest": "Switch > Switch can be disabled",
+      "apg": "states",
+      "config": { "part": "switch", "isDisabled": true },
+      "steps": [
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "switch": { "checked": "false" } },
+            "events": { "onChange": [0] }
+          }
+        }
+      ],
+      "notes": "Disabled switch ignores clicks and fires no onChange."
+    },
+    {
+      "id": "switch.react-aria.s1-switch-read-only",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/switch/Switch.test.js#L174",
+      "upstreamTest": "Switch > Switch supports readOnly",
+      "apg": "states",
+      "config": { "part": "switch", "isReadOnly": true, "isSelected": true },
+      "steps": [
+        { "event": "click", "target": "switch" },
+        {
+          "expect": {
+            "attrs": { "switch": { "checked": "true" } },
+            "events": { "onChange": [0] }
+          }
+        }
+      ],
+      "notes": "Read-only keeps the current checked state and fires no onChange."
+    },
+    {
+      "id": "switch.react-aria.s1-switch-aria-label",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/switch/Switch.test.js#L113",
+      "upstreamTest": "Switch > Switch can have a non-visible label",
+      "apg": "aria",
+      "config": { "part": "switch", "aria-label": "not visible" },
+      "steps": [
+        { "event": "prop", "set": {} },
+        { "expect": { "attrs": { "switch": { "aria-label": "not visible" } } } }
+      ],
+      "notes": "Accessible name can come from aria-label with no visible label."
+    },
+    {
+      "id": "switch.react-aria.s1-switch-exclude-from-tab-order",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/switch/Switch.test.js#L164",
+      "upstreamTest": "Switch > Switch supports excludeFromTabOrder",
+      "apg": "keyboard",
+      "config": { "part": "switch", "excludeFromTabOrder": true },
+      "steps": [
+        { "event": "prop", "set": {} },
+        { "expect": { "attrs": { "switch": { "tabIndex": "-1" } } } }
+      ],
+      "notes": "excludeFromTabOrder sets tabIndex=-1."
+    }
+  ]
+}

package/scenarios/apg/table.ariakit.json

@@ -0,0 +1,65 @@
+{
+  "pattern": "table",
+  "source": "ariakit",
+  "commit": "404c72257b879569feb08465da4ff9915fd873da",
+  "license": "MIT",
+  "skipped": [
+    {
+      "reason": "ariakit-ui-table > test-chrome selection / row-click suites (grid ticket)"
+    },
+    {
+      "reason": "names declarative and composed tables with native captions (firstElementChild styling assertion)"
+    }
+  ],
+  "scenarios": [
+    {
+      "id": "table.ariakit.native-table-named-by-caption",
+      "upstream": "https://github.com/ariakit/ariakit/blob/404c72257b879569feb08465da4ff9915fd873da/app/src/sandbox/ariakit-ui-table/test.ts#L5",
+      "upstreamTest": "names declarative and composed tables with native captions",
+      "apg": "aria",
+      "config": { "caption": "Component inventory", "rows": 2 },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["table", "caption", "rowgroup", "row:0", "row:1"]
+          }
+        }
+      ],
+      "notes": "A native table takes its accessible name from the visible caption; both declarative and composed tables expose it."
+    },
+    {
+      "id": "table.ariakit.caption-is-optional",
+      "upstream": "https://github.com/ariakit/ariakit/blob/404c72257b879569feb08465da4ff9915fd873da/app/src/sandbox/ariakit-ui-table/test.ts#L16",
+      "upstreamTest": "supports optional caption parts before declarative and appended rows",
+      "apg": "aria",
+      "config": { "caption": null, "rows": 2 },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["table", "rowgroup", "row:0", "row:1"]
+          }
+        }
+      ],
+      "notes": "When the caption is hidden the caption element is not rendered and the table keeps its rows and cells (Button, Covered, Tabs, Expanded)."
+    },
+    {
+      "id": "table.ariakit.explicit-caption-element",
+      "upstream": "https://github.com/ariakit/ariakit/blob/404c72257b879569feb08465da4ff9915fd873da/app/src/sandbox/ariakit-ui-table/test.ts#L16",
+      "upstreamTest": "supports optional caption parts before declarative and appended rows (Caption element format)",
+      "apg": "aria",
+      "config": {
+        "caption": "Component inventory",
+        "captionAsElement": true,
+        "rows": 2
+      },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["table", "caption", "rowgroup", "row:0", "row:1"]
+          }
+        }
+      ],
+      "notes": "A caption supplied as an element is rendered as the table's caption just like the text and props forms."
+    }
+  ]
+}

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

@@ -0,0 +1,221 @@
+{
+  "pattern": "table",
+  "source": "react-aria",
+  "commit": "99e610236887da619ad9d54a1cd87983166c043d",
+  "license": "Apache-2.0",
+  "skipped": [
+    { "reason": "Table > should render with default classes" },
+    { "reason": "Table > should render with custom classes" },
+    { "reason": "Table > should support DOM props" },
+    { "reason": "Table > should support custom render function" },
+    { "reason": "Table > custom cell renderer and index rows" },
+    { "reason": "Table > should support column hover when sorting is allowed" },
+    { "reason": "Table > supports removing rows" },
+    {
+      "reason": "Table > does not hang restoring focus when no focusable row remains"
+    },
+    {
+      "reason": "Table > should support virtualizer (scroll re-window and End keyboard)"
+    },
+    {
+      "reason": "Table > colSpan > should focus to the same colIndex when moving focus up or down"
+    },
+    {
+      "reason": "Table > keyboard navigation, selection checkboxes, row actions (grid ticket)"
+    },
+    { "reason": "useTable > calls onAction" },
+    { "reason": "useTable > sets the passed id" }
+  ],
+  "scenarios": [
+    {
+      "id": "table.react-aria.structural-roles",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L549",
+      "upstreamTest": "Table > should render with custom classes (role structure)",
+      "apg": "aria",
+      "config": { "columns": 3, "rows": 2, "rowHeaderColumn": 0 },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "table": { "role": "grid" },
+              "rowgroup:0": { "role": "rowgroup" },
+              "rowgroup:1": { "role": "rowgroup" },
+              "columnheader:0": { "role": "columnheader" },
+              "rowheader:0": { "role": "rowheader" },
+              "gridcell:0": { "role": "gridcell" }
+            }
+          }
+        }
+      ],
+      "notes": "Header cells are columnheaders, the first column is rowheaders, the rest are gridcells."
+    },
+    {
+      "id": "table.react-aria.grid-accessible-name",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L558",
+      "upstreamTest": "Table > should render with custom classes (aria-label on the grid)",
+      "apg": "aria",
+      "config": { "aria-label": "Files" },
+      "steps": [
+        {
+          "expect": {
+            "attrs": { "table": { "aria-label": "Files" } }
+          }
+        }
+      ]
+    },
+    {
+      "id": "table.react-aria.sort-descriptor",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L1105",
+      "upstreamTest": "Table > should support sorting",
+      "apg": "states",
+      "config": {
+        "sortColumn": "name",
+        "sortDirection": "ascending",
+        "sortable": true
+      },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "columnheader:0": { "aria-sort": "ascending" },
+              "columnheader:1": { "aria-sort": "none" }
+            }
+          }
+        }
+      ],
+      "notes": "Only sortable columns expose aria-sort; the unsorted ones report none."
+    },
+    {
+      "id": "table.react-aria.selection-replace-aria-selected",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L736",
+      "upstreamTest": "Table > should not render checkboxes for selection with selectionBehavior=replace",
+      "apg": "states",
+      "config": { "selectionMode": "multiple", "selectionBehavior": "replace" },
+      "steps": [
+        { "event": "click", "target": "row:1" },
+        { "expect": { "attrs": { "row:1": { "aria-selected": "true" } } } }
+      ],
+      "notes": "With replace behavior there are no checkboxes; selection is reported on the row."
+    },
+    {
+      "id": "table.react-aria.static-counts-and-indices",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/table/TableTests.js#L274",
+      "upstreamTest": "TableView > renders a static table (row/column counts and indices)",
+      "apg": "states",
+      "config": { "columns": 3, "rows": 2, "rowHeaderColumn": 0 },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "table": {
+                "role": "grid",
+                "aria-rowcount": "3",
+                "aria-colcount": "3"
+              },
+              "rowgroup:0": { "role": "rowgroup" },
+              "rowgroup:1": { "role": "rowgroup" },
+              "row:0": { "aria-rowindex": "1" },
+              "columnheader:0": { "aria-colindex": "1", "aria-sort": null },
+              "columnheader:1": { "aria-colindex": "2" },
+              "columnheader:2": { "aria-colindex": "3" },
+              "rowheader:0": { "aria-colindex": "1" },
+              "gridcell:0": { "aria-colindex": "2" }
+            }
+          }
+        }
+      ],
+      "notes": "The header counts as row 1; a static table with no sort descriptor has no aria-sort on any column."
+    },
+    {
+      "id": "table.react-aria.static-selection-structure",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/@adobe/react-spectrum/test/table/TableTests.js#L333",
+      "upstreamTest": "TableView > renders a static table with selection",
+      "apg": "states",
+      "config": { "columns": 3, "rows": 2, "selectionMode": "multiple" },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "table": {
+                "role": "grid",
+                "aria-multiselectable": "true",
+                "aria-rowcount": "3",
+                "aria-colcount": "4"
+              },
+              "row:0": { "aria-selected": null },
+              "row:1": { "aria-selected": "false" },
+              "rowheader:0": { "aria-colindex": "2" }
+            }
+          }
+        }
+      ],
+      "notes": "A selection column adds one column, shifting the row header to column 2; unselected rows report aria-selected=false."
+    },
+    {
+      "id": "table.react-aria.virtualizer-row-index",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L1503",
+      "upstreamTest": "Table > should support virtualizer (aria-rowindex on every row)",
+      "apg": "states",
+      "config": { "virtualized": true, "items": 50 },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "row:0": { "aria-rowindex": "1" },
+              "row:1": { "aria-rowindex": "2" }
+            }
+          }
+        }
+      ],
+      "notes": "Every visible row, header included, exposes its position via aria-rowindex."
+    },
+    {
+      "id": "table.react-aria.colspan-colindex",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L1596",
+      "upstreamTest": "Table > colSpan > should render table with colSpans",
+      "apg": "states",
+      "config": { "columns": 4, "colspans": true, "colspanRow": 1 },
+      "steps": [
+        {
+          "expect": {
+            "attrs": {
+              "colspan-cell": { "colspan": "2", "aria-colindex": null },
+              "colindex-cell": { "aria-colindex": "4" }
+            }
+          }
+        }
+      ],
+      "notes": "A spanned cell omits aria-colindex; the next cell reports the advanced index."
+    },
+    {
+      "id": "table.react-aria.empty-state-rowgroup",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.test.js#L1127",
+      "upstreamTest": "Table > should support empty state",
+      "apg": "states",
+      "config": { "empty": true },
+      "steps": [
+        {
+          "expect": {
+            "attrs": { "rowgroup:1": { "data-empty": "true" } }
+          }
+        }
+      ],
+      "notes": "The empty body keeps its rowgroup and renders the fallback content in a rowheader."
+    },
+    {
+      "id": "table.react-aria.ssr-row-order",
+      "upstream": "https://github.com/adobe/react-spectrum/blob/99e610236887da619ad9d54a1cd87983166c043d/packages/react-aria-components/test/Table.ssr.test.js#L20",
+      "upstreamTest": "Table SSR > should render without errors",
+      "apg": "aria",
+      "config": { "items": 4, "insertedAfter": 2 },
+      "steps": [
+        {
+          "expect": {
+            "visible": ["table", "row:0", "row:1", "row:2", "row:3", "row:4"]
+          }
+        }
+      ],
+      "notes": "Server-rendered and hydrated rows keep order with the late-inserted row before the final one."
+    }
+  ]
+}