[Bug]: Embedded number/range inputs contribute their `value` attribute, not their current value, to accessible names

Đang mở
  • Có gì không ổn?
#43,984 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@lazerg đang làm issue này rồi.

Từ ngày 7/11/2026.

  • #43985 của @lazerg — đang mở

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
35/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
playwright, typescript
Lĩnh vực
accessibility, testing

Hướng nghiên cứu

Start in packages/injected/src/roleUtils.ts at the progressbar/scrollbar/slider/spinbutton/meter branch of getTextAlternativeInternal; compare its value handling with the textbox branch above. Reproduce with the supplied test and check existing accessible-name tests for the right place to add coverage. Done means embedded number and range inputs contribute their current values to the containing checkbox names; an open linked pull request (#43985) is already addressing this issue.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Version

1.65.0 (also 1.66.0-alpha-1793916328000)

Steps to reproduce
  1. Clone https://github.com/trackoor/playwright-accname-range-number-repro
  2. npm install && npx playwright install chromium
  3. npm test

The test:

import { test, expect } from '@playwright/test';

test('embedded number/range inputs use their current value in accessible names', async ({ page }) => {
  await page.setContent(`
    <input type="checkbox" id="cb"><label for="cb">Remind me <input type="number" value="3" aria-label="count"> times</label>
    <input type="checkbox" id="v"><label for="v">Volume <input type="range" aria-label="vol"> percent</label>
    <input type="checkbox" id="w"><label for="w">Level <input type="range" max="10" value="70" aria-label="lvl"> of 10</label>
  `);
  await page.getByLabel('count').fill('5');

  const boxes = page.getByRole('checkbox');
  await expect(boxes.nth(0)).toHaveAccessibleName('Remind me 5 times');
  await expect(boxes.nth(1)).toHaveAccessibleName('Volume 50 percent');
  await expect(boxes.nth(2)).toHaveAccessibleName('Level 10 of 10');
});
Expected behavior

The checkbox names are Remind me 5 times, Volume 50 percent and Level 10 of 10. That is what Chromium itself computes (Accessibility.getFullAXTree over CDP), and the embedded spinbutton/slider in ariaSnapshot() already shows "5", "50" and "10".

Actual behavior
Expected: "Remind me 5 times"
Received: "Remind me 3 times"

page.locator('body').ariaSnapshot() shows all three:

- checkbox "Remind me 3 times"
- text: Remind me
- spinbutton "count": "5"
- text: times
- checkbox "Volume percent"
- text: Volume
- slider "vol": "50"
- text: percent
- checkbox "Level 70 of 10"
- text: Level
- slider "lvl": "10"
- text: of 10
Additional context

In packages/injected/src/roleUtils.ts, the progressbar/scrollbar/slider/spinbutton/meter branch of getTextAlternativeInternal falls back to element.getAttribute('value'). For <input> it should use the .value property, like the textbox branch just above it does. Same line on main at 07c7069.

Environment
System:
  OS: Linux (x64)
Binaries:
  Node: 26.13.0
npmPackages:
  @playwright/test: 1.65.0

Credit: https://ucsbplse.github.io/

Ngôn ngữ chính
TypeScript
Star
99.1k
Fork
6.8k
Merge trung bình
17 giờ 6 phút
Pull request đã merge (30 ngày)
306

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của microsoft/playwright

Tất cả issue của microsoft/playwright

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.