Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Copy buttons in the URL encoder and JWT decoder are all named just "Copy"

Đang mở
#335 2 bình luận 0 reaction 1 người được giao Xem trên GitHub

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

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

Từ ngày 24/10/2026.

  • #339 của @bhushan4work — đang mở

Đánh giá

Issue này chưa được đánh giá.

Mô tả

accessibility bug good first issue hacktoberfest

#334 gave CopyButton an ariaLabel prop and used it in the case and number base converters. The URL encoder and the JWT decoder still have copy buttons that a screen reader only hears as "Copy":

  • URL encoder: the output (app/(tools)/url-encoder/UrlEncoderClient.tsx, line 174) and the button next to each query parameter (line 214)
  • JWT decoder: the header and payload cards (components/DecodedCard.tsx, line 65), the cURL snippet (JwtDecoderClient.tsx, line 290), the signature (line 502) and the encoder's token (components/EncoderTab.tsx, line 208)

What to do

  • Pass an ariaLabel that says what each button copies, like "Copy encoded output", "Copy value of page" (for a query parameter called page), "Copy header", "Copy payload", "Copy cURL command", "Copy signature" and "Copy token". The visible text stays "Copy".

Where to look

  • The lines above, and components/shared/CopyButton.tsx for the prop
  • The tests next to them: UrlEncoderClient.test.tsx, JwtDecoderClient.test.tsx, DecodedCard.test.tsx and EncoderTab.test.tsx

Acceptance criteria

  • Every copy button in both tools has a name that says what it copies, and still shows "Copy"
  • Tests that fail on the current code
  • npm run lint, npm run test and npm run build pass

Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off develop, and open your PR against develop with Closes #335 in the description.

Ngôn ngữ chính
TypeScript
Star
1
Fork
9
Merge trung bình
7 giờ 30 phút
Pull request đã merge (30 ngày)
151

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 codercops/toolbelt

Tất cả issue của codercops/toolbelt

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.