test: #3621204 Name the colour contrast and top-level heading accessibility rules in the home page regression scenarios
Adds three scenarios to tests/features/15-quality/15-02-accessibility.feature, one rule per scenario in the file's existing style: color-contrast, page-has-heading-one, and an explicit single-h1 assertion on the home page. No other feature is touched and nothing is restructured.
Both rules regressed on a Varbase site template (color-contrast fixed in #3621197, the missing front-page h1 addressed in #3621201 and #3621200). This suite gates on impact level, so a regression in either rule was reported as a count rather than by name, and one of them was not reported at all.
Closes #3621204.
What the new scenarios genuinely cover
page-has-heading-one and exactly one h1 are real gates. Measured against a Varbase 11 site built from Varbase Starter (drupal/varbase_starter 1.0.x-dev of 29 August 2026, drupal/vartheme_bs5 5.0.0-rc4), the home page renders zero h1 elements; its first heading is an h2 ("Varbase, better than ever"). axe reports page-has-heading-one [moderate] as the only violation on that page. Both new assertions fail on that build and pass once the heading fix lands, which is exactly what a regression guard should do.
color-contrast gates the rendered text of the page. It does not cover the footer social icons, and that is why the existing "no serious accessibility violations" scenario never reported the 4.27:1 defect. The links carry font-size: 0 on their label text and draw a Bootstrap Icons glyph from a ::before pseudo-element, so axe-core's color-contrast rule never evaluates them. Verified by forcing the pre-fix colour back on in the browser:
.block-system-menu-blocksocial-media-menu a { color: #0d6efd !important; }
=> axe color-contrast violations: 0 (2 nodes reported "incomplete")#0d6efd on the #f8f9fa footer background is 4.27:1, the exact figure in the report, and axe still says nothing. Any axe-based color-contrast scenario is therefore vacuous with respect to those icons. Real coverage needs an assertion on the icon colour itself rather than an axe rule; that is left for a follow-up rather than implied here.
AI policy
AI-Generated: Yes — authored with Claude, per the Policy on the use of AI when contributing to Drupal.
CI result: the new gate went red on the defect and green on the fix, inside one pipeline
Pipeline 950325 is green overall, and how it got there is the best evidence these scenarios work.
🧪 varbase-e2e: [15-quality] ran three times. Attempts 1 and 2 (jobs 12016754, 12017320) failed on exactly the two new heading scenarios, both times:
1) Scenario: The homepage carries a top-level heading (attempt 2) # tests/features/15-quality/15-02-accessibility.feature:95
✖ Then the page should not violate the accessibility rule "page-has-heading-one" # node_modules/@vardot/varbase-e2e/tests/step-definitions/a11y.steps.js:745
AssertionError [ERR_ASSERTION]: Rule "page-has-heading-one" violated by 1 node(s):
2) Scenario: The homepage carries exactly one top-level heading (attempt 2) # tests/features/15-quality/15-02-accessibility.feature:104
✖ Then the page should have exactly one h1 # node_modules/@vardot/varbase-e2e/tests/step-definitions/a11y.steps.js:201
AssertionError [ERR_ASSERTION]: Expected 1 <h1>, found 0.
26 scenarios (2 failed, 24 passed)Those attempts ran against the site built by 📦 Install Varbase job 12016742, which installed drupal/varbase_starter 1.0.x-dev b1ef432.
Attempt 3 (job 12017495) passed 26 of 26. It ran against install job 12017397, which installed drupal/varbase_starter 1.0.x-dev 33da4c5 — that is fix: #3621200 Add a site name level 1 heading to the Varbase Starter home Canvas page, merged at 13:40 UTC while this pipeline was still running.
So the same scenario was red on the pre-fix Starter and green on the post-fix Starter, in one pipeline, with no change to the test. Colour contrast holds on the homepage passed on every attempt.
Checkpoints:
- File an issue
- Addition/Change/Update/Fix
- Testing to ensure no regression
- Automated unit testing coverage
- Automated functional testing coverage
- UX/UI designer responsibilities
- Readability
- Accessibility
- Performance
- Security
- Developer Documentation
- User Guide Documentation
- Reviewed by human
- Code review by maintainers
- Full testing and approval
- Credit contributors
- Review with the product owner
- Release notes snippet
- Release