@cronn/element-snapshot 0.7.0 → 0.8.0

package/dist/index.d.ts

@@ -18,6 +18,10 @@ interface ButtonAttributes extends DisableableAttributes {
 }
 type PressedValue = true | "mixed";
 
+interface DiscribableAttributes {
+    description?: string;
+}
+
 interface InputSnapshot extends GenericElementSnapshot<CommonInputRole, InputAttributes> {
 }
 type InputRole = "button" | "combobox" | CommonInputRole;
@@ -26,8 +30,7 @@ interface InputAttributes extends CommonInputAttributes {
     value?: string;
     checked?: boolean;
 }
-interface CommonInputAttributes extends InputStateAttributes {
-    description?: string;
+interface CommonInputAttributes extends InputStateAttributes, DiscribableAttributes {
     placeholder?: string;
 }
 
@@ -46,13 +49,16 @@ interface OptionAttributes {
 interface DialogSnapshot extends GenericElementSnapshot<DialogRole, DialogAttributes> {
 }
 type DialogRole = "dialog" | "alertdialog";
-interface DialogAttributes {
-    description?: string;
+interface DialogAttributes extends DiscribableAttributes {
     modal?: boolean;
 }
 
 interface GroupSnapshot extends GenericElementSnapshot<"group"> {
 }
+interface RadiogroupSnapshot extends GenericElementSnapshot<"radiogroup", RadiogroupAttributes> {
+}
+interface RadiogroupAttributes extends DiscribableAttributes {
+}
 
 interface HeadingSnapshot extends GenericElementSnapshot<"heading", HeadingAttributes> {
 }
@@ -97,9 +103,9 @@ interface TextSnapshot {
 
 type SnapshotTargetElement = HTMLElement | SVGElement;
 type NodeRole = ElementRole | "text";
-type ElementRole = "heading" | "link" | "button" | "option" | "tab" | "menuitem" | "columnheader" | "group" | "progressbar" | ContainerRole | InputRole | DialogRole;
+type ElementRole = "heading" | "link" | "button" | "option" | "tab" | "menuitem" | "columnheader" | "group" | "radiogroup" | "progressbar" | ContainerRole | InputRole | DialogRole;
 type NodeSnapshot = ElementSnapshot | TextSnapshot;
-type ElementSnapshot = ContainerSnapshot | HeadingSnapshot | LinkSnapshot | ButtonSnapshot | InputSnapshot | ComboboxSnapshot | OptionSnapshot | DialogSnapshot | TabSnapshot | MenuitemSnapshot | ColumnheaderSnapshot | GroupSnapshot | ProgressbarSnapshot;
+type ElementSnapshot = ContainerSnapshot | HeadingSnapshot | LinkSnapshot | ButtonSnapshot | InputSnapshot | ComboboxSnapshot | OptionSnapshot | DialogSnapshot | TabSnapshot | MenuitemSnapshot | ColumnheaderSnapshot | GroupSnapshot | RadiogroupSnapshot | ProgressbarSnapshot;
 interface GenericElementSnapshot<TRole extends NodeRole = NodeRole, TAttributes = unknown> {
     role: TRole;
     name?: string;

package/dist/index.global.js

@@ -126,6 +126,11 @@
   }
 
   // src/snapshots/description.ts
+  function discribableAttributes(element) {
+    return {
+      description: resolveDescription(element)
+    };
+  }
   function resolveDescription(element) {
     const describedByElement = resolveElementReference(
       element,
@@ -428,13 +433,14 @@
   }
   function snapshotCommonInputAttributes(element, isEmpty) {
     return {
-      description: resolveDescription(element),
+      ...discribableAttributes(element),
       placeholder: isEmpty ? resolvePlaceholder(element) : void 0,
       ...inputStateAttributes(element)
     };
   }
+  var CHECKED_INPUT_TYPES = /* @__PURE__ */ new Set(["checkbox", "radio"]);
   function resolveInputValue(element) {
-    if (element instanceof HTMLInputElement && element.type === "checkbox") {
+    if (element instanceof HTMLInputElement && CHECKED_INPUT_TYPES.has(element.type)) {
       return void 0;
     }
     return stringAttribute(element.value);
@@ -477,7 +483,7 @@
       return null;
     }
     const options = snapshotOptions(element);
-    const value = resolveValue(element, options);
+    const value = resolveValue(element);
     return {
       role: "combobox",
       name: resolveInputLabel(element),
@@ -497,15 +503,23 @@
     }
     return false;
   }
-  function resolveValue(element, options) {
-    const selectedOptions = options.filter((option) => option.attributes?.selected === true).map((option) => option.name).filter((optionName) => optionName !== void 0);
-    if (selectedOptions.length === 0) {
-      return element instanceof HTMLInputElement ? resolveInputValue(element) : void 0;
+  function resolveValue(element) {
+    if (element instanceof HTMLButtonElement) {
+      return snapshotTextContent(element);
+    }
+    if (element instanceof HTMLInputElement) {
+      return resolveInputValue(element);
+    }
+    const selectedLabels = Array.from(element.selectedOptions).map(
+      (option) => option.label
+    );
+    if (selectedLabels.length === 0) {
+      return void 0;
     }
-    if (selectedOptions.length === 1) {
-      return selectedOptions.at(0);
+    if (selectedLabels.length === 1) {
+      return selectedLabels.at(0);
     }
-    return selectedOptions;
+    return selectedLabels;
   }
   function snapshotOptions(element) {
     return resolveOptions(element).map(snapshotOption).filter((childSnapshot) => childSnapshot !== null);
@@ -514,10 +528,6 @@
     if (element instanceof HTMLSelectElement) {
       return Array.from(element.options);
     }
-    const ariaExpanded = element.ariaExpanded === "true";
-    if (!ariaExpanded) {
-      return [];
-    }
     const controlledElement = resolveElementReference(element, "aria-controls");
     if (controlledElement === null) {
       return [];
@@ -545,7 +555,7 @@
       role,
       name: resolveAccessibleName(element, false),
       attributes: {
-        description: resolveDescription(element),
+        ...discribableAttributes(element),
         modal: booleanAttribute(element.ariaModal)
       },
       children: snapshotChildren(element)
@@ -567,6 +577,14 @@
     }
     return resolveAccessibleName(element, false);
   }
+  function snapshotRadiogroup(element) {
+    return {
+      role: "radiogroup",
+      name: resolveAccessibleName(element, false),
+      attributes: discribableAttributes(element),
+      children: snapshotChildren(element)
+    };
+  }
 
   // src/snapshots/heading.ts
   var LEVEL_REGEXP = /^H([1-6])$/;
@@ -677,6 +695,7 @@
     menuitem: snapshotMenuitem,
     columnheader: snapshotColumnheader,
     group: snapshotGroup,
+    radiogroup: snapshotRadiogroup,
     progressbar: snapshotProgressbar
   };
   function snapshotElement(element) {

package/dist/types.d.ts

@@ -18,6 +18,10 @@ interface ButtonAttributes extends DisableableAttributes {
 }
 type PressedValue = true | "mixed";
 
+interface DiscribableAttributes {
+    description?: string;
+}
+
 interface InputSnapshot extends GenericElementSnapshot<CommonInputRole, InputAttributes> {
 }
 type InputRole = "button" | "combobox" | CommonInputRole;
@@ -26,8 +30,7 @@ interface InputAttributes extends CommonInputAttributes {
     value?: string;
     checked?: boolean;
 }
-interface CommonInputAttributes extends InputStateAttributes {
-    description?: string;
+interface CommonInputAttributes extends InputStateAttributes, DiscribableAttributes {
     placeholder?: string;
 }
 
@@ -51,13 +54,16 @@ type ContainerRole = SetValues<typeof CONTAINER_ROLES>;
 interface DialogSnapshot extends GenericElementSnapshot<DialogRole, DialogAttributes> {
 }
 type DialogRole = "dialog" | "alertdialog";
-interface DialogAttributes {
-    description?: string;
+interface DialogAttributes extends DiscribableAttributes {
     modal?: boolean;
 }
 
 interface GroupSnapshot extends GenericElementSnapshot<"group"> {
 }
+interface RadiogroupSnapshot extends GenericElementSnapshot<"radiogroup", RadiogroupAttributes> {
+}
+interface RadiogroupAttributes extends DiscribableAttributes {
+}
 
 interface HeadingSnapshot extends GenericElementSnapshot<"heading", HeadingAttributes> {
 }
@@ -101,9 +107,9 @@ interface TextSnapshot {
 }
 
 type NodeRole = ElementRole | "text";
-type ElementRole = "heading" | "link" | "button" | "option" | "tab" | "menuitem" | "columnheader" | "group" | "progressbar" | ContainerRole | InputRole | DialogRole;
+type ElementRole = "heading" | "link" | "button" | "option" | "tab" | "menuitem" | "columnheader" | "group" | "radiogroup" | "progressbar" | ContainerRole | InputRole | DialogRole;
 type NodeSnapshot = ElementSnapshot | TextSnapshot;
-type ElementSnapshot = ContainerSnapshot | HeadingSnapshot | LinkSnapshot | ButtonSnapshot | InputSnapshot | ComboboxSnapshot | OptionSnapshot | DialogSnapshot | TabSnapshot | MenuitemSnapshot | ColumnheaderSnapshot | GroupSnapshot | ProgressbarSnapshot;
+type ElementSnapshot = ContainerSnapshot | HeadingSnapshot | LinkSnapshot | ButtonSnapshot | InputSnapshot | ComboboxSnapshot | OptionSnapshot | DialogSnapshot | TabSnapshot | MenuitemSnapshot | ColumnheaderSnapshot | GroupSnapshot | RadiogroupSnapshot | ProgressbarSnapshot;
 interface GenericElementSnapshot<TRole extends NodeRole = NodeRole, TAttributes = unknown> {
     role: TRole;
     name?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cronn/element-snapshot",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Element snapshots for Playwright",
   "author": "cronn",
   "license": "Apache-2.0",