{
  "doc": {
    "id": "ui-coverage/configuration/significantattributes",
    "title": "significantAttributes: identify elements by your attributes in UI Coverage",
    "description": "Make Cypress UI Coverage identify, name, and group elements using your own HTML attributes, such as data-component, data-analytics-id, or aria-label, by adding them to the priority list of significant attributes.",
    "section": "ui-coverage",
    "source_path": "/llm/markdown/ui-coverage/configuration/significantattributes.md",
    "version": "fbc9225067c51c52ee13224e3b702cf8a025ec12",
    "updated_at": "2026-08-14T12:36:26.878Z",
    "headings": [
      {
        "id": "ui-coverage/configuration/significantattributes#prioritize-identifying-attributes-significantattributes",
        "text": "Prioritize identifying attributes - significantAttributes",
        "level": 1
      },
      {
        "id": "ui-coverage/configuration/significantattributes#why-use-significantattributes",
        "text": "Why use significantAttributes?",
        "level": 2
      },
      {
        "id": "ui-coverage/configuration/significantattributes#scope",
        "text": "Scope",
        "level": 2
      },
      {
        "id": "ui-coverage/configuration/significantattributes#setting-significantattributes",
        "text": "Setting significantAttributes",
        "level": 2
      },
      {
        "id": "ui-coverage/configuration/significantattributes#syntax",
        "text": "Syntax",
        "level": 2
      },
      {
        "id": "ui-coverage/configuration/significantattributes#how-are-significant-attributes-applied",
        "text": "How are significant attributes applied?",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#validation-rules",
        "text": "Validation rules",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#examples",
        "text": "Examples",
        "level": 2
      },
      {
        "id": "ui-coverage/configuration/significantattributes#identify-elements-by-a-component-attribute",
        "text": "Identify elements by a component attribute",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#config",
        "text": "Config",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#html",
        "text": "HTML",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#elements-shown-in-ui",
        "text": "Elements shown in UI",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#list-several-attributes-in-priority-order",
        "text": "List several attributes in priority order",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#config",
        "text": "Config",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#html",
        "text": "HTML",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#elements-shown-in-ui",
        "text": "Elements shown in UI",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#identify-elements-by-their-aria-label",
        "text": "Identify elements by their aria-label",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#config",
        "text": "Config",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#html",
        "text": "HTML",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#elements-shown-in-ui",
        "text": "Elements shown in UI",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#promote-a-default-attribute",
        "text": "Promote a default attribute",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#config",
        "text": "Config",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#html",
        "text": "HTML",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#elements-shown-in-ui",
        "text": "Elements shown in UI",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#deduplicate-repeated-elements-by-a-shared-attribute",
        "text": "Deduplicate repeated elements by a shared attribute",
        "level": 3
      },
      {
        "id": "ui-coverage/configuration/significantattributes#config",
        "text": "Config",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#html",
        "text": "HTML",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#elements-shown-in-ui",
        "text": "Elements shown in UI",
        "level": 4
      },
      {
        "id": "ui-coverage/configuration/significantattributes#see-also",
        "text": "See also",
        "level": 2
      }
    ]
  },
  "content": {
    "type": "root",
    "children": [
      {
        "type": "heading",
        "depth": 1,
        "children": [
          {
            "type": "text",
            "value": "Prioritize identifying attributes - `significantAttributes`"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "The `significantAttributes` configuration adds your own HTML attributes to the priority list UI Coverage uses to identify elements. Attributes you list are checked before the default test attributes, in the order you list them."
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "To count each element once across the many "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/core-concepts/element-identification.md#Snapshots",
            "children": [
              {
                "type": "text",
                "value": "snapshots"
              }
            ]
          },
          {
            "type": "text",
            "value": " captured in a run, UI Coverage identifies elements by a "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/core-concepts/element-identification.md",
            "children": [
              {
                "type": "text",
                "value": "prioritized list of attributes"
              }
            ]
          },
          {
            "type": "text",
            "value": ": test attributes like `data-cy` and `data-testid` first, then fallbacks like `id` and `name`. Your application may already have attributes that describe elements better than anything in that list, such as a `data-component` attribute from your design system or a `data-analytics-id` your team maintains for tracking. Listing them in `significantAttributes` makes UI Coverage prefer them, so elements are named by the attributes your team recognizes, deduplicated by values that stay stable across snapshots, and grouped by the structure your markup already expresses."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Why use significantAttributes?"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Use attributes your application already has: If your components render an attribute like `data-component`, UI Coverage can identify and name elements by it. No new markup required."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Make reports read in your team's vocabulary: Elements appear in reports under selectors built from their identifying attribute, so `[data-component=\"SearchInput\"]` is easier to recognize and act on than a generated selector."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Promote one of the default attributes: The defaults are checked in a fixed order (`data-cy` before `data-qa`, for example). If your application uses `data-qa` but another tool populates `data-cy` with less useful values, listing `data-qa` moves it to the front of the line."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "`significantAttributes` changes which attributes are preferred. If your goal is different, such as stopping a dynamic attribute from being used at all, or fixing a single element's identity, see "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/configuration/overview.md#Which-option-do-I-need",
            "children": [
              {
                "type": "text",
                "value": "Which option do I need?"
              }
            ]
          },
          {
            "type": "text",
            "value": " in the configuration overview."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Scope"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Note: setting `significantAttributes` at the root of your configuration impacts both UI Coverage and Cypress Accessibility reports. To configure the products separately, nest the property under a `uiCoverage` or `accessibility` key. A nested `significantAttributes` completely replaces a root-level one for that product; the two lists are not merged."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Setting significantAttributes"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "To add or edit `significantAttributes`, open the App Quality tab in your project settings in Cypress Cloud. See "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/configuration/overview.md#Setting-configuration",
            "children": [
              {
                "type": "text",
                "value": "Setting configuration"
              }
            ]
          },
          {
            "type": "text",
            "value": " for details, including how to regenerate past reports with a new configuration without rerunning your tests."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Syntax"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [string]}"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "To apply the list to UI Coverage only, nest the property under the `uiCoverage` key:"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"uiCoverage\": {    \"significantAttributes\": [string]  }}"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Each entry is the name of an HTML attribute, such as `\"data-component\"` or `\"aria-label\"`. Any valid HTML attribute qualifies, not only `data-*` attributes. Entries are attribute names only: not CSS selectors, not regular expressions, and not attribute values."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "How are significant attributes applied?"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "For each "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/core-concepts/interactivity.md",
            "children": [
              {
                "type": "text",
                "value": "interactive element"
              }
            ]
          },
          {
            "type": "text",
            "value": " it tracks, UI Coverage checks one combined list of attributes, in priority order:"
          }
        ]
      },
      {
        "type": "list",
        "ordered": true,
        "start": 1,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "The "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/core-concepts/element-grouping.md#Grouping-with-markup-attributes",
                    "children": [
                      {
                        "type": "text",
                        "value": "markup attributes"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": " `data-cy-ui-id` and `data-cy-ui-group`"
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Your `significantAttributes`, in the order you list them"
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "The default significant attributes, in order: `data-cy`, `data-test`, `data-testid`, `data-test-id`, `data-qa`, and `row-id`"
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "`id` and `name`, as fallbacks when no attribute above produced an identifier"
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "The first attribute in this list that is present on the element, with a value that isn't excluded by your "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/configuration/attributefilters.md",
            "children": [
              {
                "type": "text",
                "value": "`attributeFilters`"
              }
            ]
          },
          {
            "type": "text",
            "value": ", becomes the element's identifying attribute. That single attribute-value pair drives how the element is named in reports, deduplicated across snapshots, and "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/core-concepts/element-grouping.md",
            "children": [
              {
                "type": "text",
                "value": "grouped"
              }
            ]
          },
          {
            "type": "text",
            "value": " with repeated elements that share the same value."
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Keep these behaviors in mind when building your list:"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Your list is added to the defaults, not a replacement for them. An element that has none of your attributes is still identified by `data-testid`, `id`, or whatever else it has, exactly as it would be without configuration. To stop an attribute from being used entirely, use "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/attributefilters.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`attributeFilters`"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": "; listing other attributes in `significantAttributes` doesn't disable it."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "To reorder the defaults, list them. Your entries outrank every default, so `\"significantAttributes\": [\"data-qa\"]` is all it takes to check `data-qa` before `data-cy`."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "One attribute is chosen per element. Higher-priority attributes aren't combined with lower ones; once a match is found, the rest of the list is ignored for that element."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Filtered values are skipped, not final. When an "
                  },
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/attributefilters.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`attributeFilters`"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": " rule excludes the value of a higher-priority attribute, UI Coverage moves on to the next attribute in the list. The two properties work together: `significantAttributes` sets the preference order, and `attributeFilters` removes unusable values from consideration."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "Labels can lend their attributes. A form control linked to a `<label>` can be identified by the label's significant attribute when the control itself has none, with the control's own attributes preferred."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Validation rules"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Cypress Cloud rejects a configuration when:"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "An entry isn't a valid HTML attribute name. Names can't contain spaces, quotes, or the characters `>`, `/`, and `=`."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "The same attribute name appears twice in the list."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "text",
                    "value": "An entry isn't a plain string, for example an object."
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "Examples"
          }
        ]
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Identify elements by a component attribute"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Your configured attribute outranks the defaults, so the button is identified by `data-component` even though `data-testid` is also present. The second button has no `data-component`, so it falls back to the default behavior and is identified by `data-testid`."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Config"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [\"data-component\"]}"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "HTML"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "<body>  <button data-component=\"SignupSubmit\" data-testid=\"submit\">    Submit  </button>  <button data-testid=\"cancel\">Cancel</button></body>"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Elements shown in UI"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "[data-component=\"SignupSubmit\"][data-testid=\"cancel\"]"
      },
      {
        "type": "thematicBreak"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "List several attributes in priority order"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "`significantAttributes` is a list, so you can prioritize more than one attribute. They're checked in the order you write them, and each element is identified by the first attribute it has. This helps when different parts of your application use different conventions."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Config"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [\"data-qa\", \"data-component\"]}"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "HTML"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "<body>  <button data-qa=\"save\" data-component=\"SaveButton\">Save</button>  <button data-component=\"CancelButton\">Cancel</button></body>"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Elements shown in UI"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "The Save button has both attributes, so `data-qa`, listed first, identifies it. The Cancel button has only `data-component`, so that identifies it instead:"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "[data-qa=\"save\"][data-component=\"CancelButton\"]"
      },
      {
        "type": "thematicBreak"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Identify elements by their `aria-label`"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Significant attributes aren't limited to `data-*` attributes; any HTML attribute qualifies, including semantic ones like `aria-label`. Icon-only controls often carry no test attribute, so listing `aria-label` gives them a readable identity in reports instead of a generated selector."
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "This does double duty. Automated accessibility tools confirm only that a control has an accessible name, not that the name is clear, so `aria-label=\"button\"` passes the same check as `aria-label=\"Close dialog\"`. Because UI Coverage lists every interactive element, identifying elements by `aria-label` turns the report into an inventory of your label text, where a person can catch a vague label that passes automated checks but wouldn't help someone relying on it."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Config"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [\"aria-label\"]}"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "HTML"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "<body>  <button aria-label=\"Close dialog\"><i class=\"icon-x\"></i></button>  <button aria-label=\"button\"><i class=\"icon-x\"></i></button></body>"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Elements shown in UI"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Each button is listed by its label, where the vague second one stands out:"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "[aria-label=\"Close dialog\"][aria-label=\"button\"]"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Because the label text becomes the identifier, `aria-label` values that are localized or include dynamic content, such as an unread count, change between snapshots and split one element into several. Choose it when the labels you want to track are stable."
          }
        ]
      },
      {
        "type": "thematicBreak"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Promote a default attribute"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Both defaults are present, and by default `data-cy` would win. Listing `data-qa` moves it above every default, so it identifies the element instead."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Config"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [\"data-qa\"]}"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "HTML"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "<body>  <button data-cy=\"widget-4172\" data-qa=\"save-button\">Save</button></body>"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Elements shown in UI"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "[data-qa=\"save-button\"]"
      },
      {
        "type": "thematicBreak"
      },
      {
        "type": "heading",
        "depth": 3,
        "children": [
          {
            "type": "text",
            "value": "Deduplicate repeated elements by a shared attribute"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "Elements that share the same identifying attribute and value are recognized as instances of the same control and "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/core-concepts/element-grouping.md",
            "children": [
              {
                "type": "text",
                "value": "grouped together"
              }
            ]
          },
          {
            "type": "text",
            "value": " in reports. Here, every product card tags its button with the same `data-analytics-id`, so the report shows one entry instead of three, and an interaction with any card's button counts the whole group as tested."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Config"
          }
        ]
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "App Quality Config"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "{  \"significantAttributes\": [\"data-analytics-id\"]}"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "HTML"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "<body>  <button data-analytics-id=\"add-to-cart\" id=\"cart-btn-1\">Add</button>  <button data-analytics-id=\"add-to-cart\" id=\"cart-btn-2\">Add</button>  <button data-analytics-id=\"add-to-cart\" id=\"cart-btn-3\">Add</button></body>"
      },
      {
        "type": "heading",
        "depth": 4,
        "children": [
          {
            "type": "text",
            "value": "Elements shown in UI"
          }
        ]
      },
      {
        "type": "code",
        "lang": null,
        "meta": null,
        "value": "[data-analytics-id=\"add-to-cart\"] (3 instances)"
      },
      {
        "type": "paragraph",
        "children": [
          {
            "type": "text",
            "value": "After saving configuration changes, regenerate a recent run to preview the effect of your rules without rerunning your tests. See "
          },
          {
            "type": "link",
            "title": null,
            "url": "/llm/markdown/ui-coverage/configuration/overview.md#Setting-configuration",
            "children": [
              {
                "type": "text",
                "value": "Setting configuration"
              }
            ]
          },
          {
            "type": "text",
            "value": " for how to regenerate a report."
          }
        ]
      },
      {
        "type": "heading",
        "depth": 2,
        "children": [
          {
            "type": "text",
            "value": "See also"
          }
        ]
      },
      {
        "type": "list",
        "ordered": false,
        "start": null,
        "spread": false,
        "children": [
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/core-concepts/element-identification.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "Element Identification"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": how elements are identified across snapshots."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/attributefilters.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`attributeFilters`"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": stop dynamic or generated attribute values from identifying elements."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/elements.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`elements`"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": rename a single element or stabilize its identity with a selector."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/elementgroups.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "`elementGroups`"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": combine related elements into one group by selector."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/configuration/overview.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "Configuration overview"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": where to set configuration and regenerate reports."
                  }
                ]
              }
            ]
          },
          {
            "type": "listItem",
            "spread": false,
            "checked": null,
            "children": [
              {
                "type": "paragraph",
                "children": [
                  {
                    "type": "link",
                    "title": null,
                    "url": "/llm/markdown/ui-coverage/faq.md",
                    "children": [
                      {
                        "type": "text",
                        "value": "UI Coverage FAQ"
                      }
                    ]
                  },
                  {
                    "type": "text",
                    "value": ": common questions and troubleshooting."
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  },
  "token_estimate": 1937
}