STD UI Testability
Scope
This document defines HTML attribute naming conventions and element identification patterns that support automated UI testing.
It does NOT describe:
- Algorithm test strategies
- Configuration validation test plans
- Rules regression testing approach
- Integration or end-to-end test architecture
HTML Attributes
Human-readable HTML attributes for automated testing (Rules/run file report focussed) + menu items PHASE 1
| Target release | https://arctichare.atlassian.net/projects/BT/versions/10067/tab/release-report-all-issues |
|---|---|
| Epic | BT-3658 - Human-readable HTML attributes for automated testing |
| Document status | requirements written |
| Document owner | aron |
| Technical writers | Tharaka Dilshan |
| Business Context | Functional requirement | Acceptance Criteria | Jira Task | Evidence | |
|---|---|---|---|---|---|
| 1 | Nomenclature needs to be clear to all for attribute names and easily used programatically | In UI we have Upper-Case items with Spaces. For attributes however: must be all lowercase, and with _ replacing ' ') kebab case | 1. All upper-case UI text to be lower case for these attributes 2. All spaces replaced by - for these attributes | BT-3673 - Fill Data attribute (Phase 1) | |
| 2 | This is for v2 not v3, so 'v3' Kit Configuration submenu items are out of scope | Do not do any of these reqs for 'kit configuration' submenu pages | N/A | BT-3673 - Fill Data attribute (Phase 1) | |
| 3 | As QA I want to have stable way to identify menu elements (for clicking) | For every menu item, have an attribute menu=[title] where [title] is the menu name. Where the menu is an icon, use hover text (like example 3 below) For example: 1. menu=run_files 2. menu=outcomes_report 3. menu=settings | Menu elements have readily identified attributes corresponding to their title | BT-3673 - Fill Data attribute (Phase 1) | |
| 4 | As QA I want to be able to find any element for a result in the run file report easily | For each table in run file identify by table=[name]_table eg 1. table=assay_summary_table 2. table=wells_table 3. table=quantification_table | Tables have readily identified attributes corresponding to their title | BT-3673 - Fill Data attribute (Phase 1) | |
| 5 | As QA I want to be able to find any element for a result in the run file report easily | For each cell in these tables, allow element to be identified by the table name and column header '=' row's unique identifier (either well_position or well_position.target) eg: 1. wells_table-outcome=A1 2. wells_table-class =A1.NCOV1 3. assay_summary_table-mix=PCOVID 4. assay_summary_table-target=NCOVID.NCOV3 5. assay_summary-pc-tick=NCOVID.NCOV3 6. assay_summary-pc-cross=NCOVID.NCOV3 | Cells have readily identifiable attributes to enable easy finding within tables for assertions etc | BT-3673 - Fill Data attribute (Phase 1) | |
| 6 | As QA I want to be able to identify each 'widget' element to select it easily | For each widget in run file report name it widget.[title] eg 1. widget=assay_summary 2. widget=westgards | Run file report widgets have readily identified attributes corresponding to their title | BT-3673 - Fill Data attribute (Phase 1) | |
| 7 | AS QA I want to be able to identify filters easily (then I can use text searches to select items that I want etc) | For each filter on every app page, identify by filter=[filter_title] eg 1. filter=mixes 2. filter=uploaded_date 3. filter=outcome | All filters have readily identified attributes corresponding to their UI title | BT-3673 - Fill Data attribute (Phase 1) |
Attribute Naming Conventions
| Pattern | Format | Example |
|---|---|---|
| Menu items | menu={title} | menu=run_files |
| Tables | table={name}_table | table=wells_table |
| Table cells | {table}-{column}={row_id} | wells_table-outcome=A1 |
| Widgets | widget={title} | widget=assay_summary |
| Filters | filter={title} | filter=mixes |
Naming Rules:
- All lowercase
- Spaces replaced with underscore (
_) - Kebab-case for compound identifiers
Related SRS Requirements
| Requirement | Domain | Description | Relevance |
|---|---|---|---|
| REQ-NFR-001 | Non-Functional Requirements | Page Load Time | AC-04 specifies "Load time shall be measurable via automated testing tools" - testability attributes enable this measurement |
| REQ-RUNRPT-002 | Runfile Report | Access Analytical Widgets | Widget attributes (widget=assay_summary, widget=westgards) enable automated identification and interaction with widgets |
| REQ-RUNRPT-009 | Runfile Report | Sort Well Table | Table and cell attributes (table=wells_table, wells_table-outcome=A1) enable automated verification of table sorting |
| REQ-RUNRPT-010 | Runfile Report | Filter Well Table | Filter attributes (filter=mixes, filter=outcome) enable automated filter interaction and verification |
| REQ-TABLES-001 | Tables | Display Data in Tabular Format | Table attributes (table=[name]_table) and cell identification attributes enable automated data extraction and verification |
| REQ-TABLES-003 | Tables | Select and Interact with Table Rows | Cell identification attributes enable automated row selection and interaction |
| REQ-FILTERS-001 | Filters | Filter Data by Criteria | Filter attributes (filter=[filter_title]) enable automated filter manipulation and state verification |
Relationship Summary
This STD defines the HTML attribute naming conventions and placement strategy that enables automated testing of the SRS requirements listed above. The testability design:
- Supports QA automation - All attributes follow consistent naming (lowercase, kebab-case) enabling predictable selector construction
- Enables data verification - Cell-level attributes (
wells_table-outcome=A1) allow precise data extraction for assertions - Facilitates UI interaction - Menu, filter, and widget attributes enable reliable element targeting without fragile CSS/XPath selectors
- Ensures test stability - Semantic attributes are decoupled from visual styling changes