Hacktoberfest 2026：维护者为十月标记出来的 issue，仍然开放、适合新手。 浏览 Hacktoberfest issue

[workshop-playwright-qa] README: 1 QA finding(s) — readability

已关闭 适合新手
  • 哪里不对？
#4,555 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
62/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
css
领域
frontend

调研方向

溢出来自 README 中「Other pages」的 side-quest 链接，其标签包含一个行内 code 元素（gh aw run），href 为 #side-quest-08-01-codespaces-actions-write。以 360×800 的视口加载 README，并检查 document.documentElement.scrollWidth 是否比 clientWidth 多出 2px。建议的选择器是 .markdown-body a code，也可以直接针对链接或列表项本身。完成的标准是：在 360px 下 scrollWidth 超出 clientWidth 不再超过 1px，并且其他视口仍能正确渲染。

由索引模型根据 Issue 内容生成。

描述

accessibility bug

QA findings for README

Tested at: 2026-10-13T19:53:00Z
Viewports: small (360×800), medium (768×1024), desktop (1280×800), wide (1440×900), full-hd (1920×1080)

Automated QA covered 98 workshop pages × 5 viewports (490 page/viewport combinations), checking navigation, readability, accessibility, and brand alignment per /github-brand. This was the only finding produced.

# Viewport Category Description
1 small readability Horizontal document overflow of 2px detected on the README page ((127.0.0.1/redacted) document.documentElement.scrollWidthis362pxvsclientWidth 360px. Root cause: the link Fix Codespaces actions:write Errors When Running gh aw run(href#side-quest-08-01-codespaces-actions-write) contains an inline gh aw runelement that does not wrap, pushing its right edge tox=361.875px, just past the 360px` viewport boundary.
Reproduction
  1. Load (127.0.0.1/redacted) (workshop READMEpage) at a360×800` viewport.
  2. Observe document.documentElement.scrollWidth (362px) exceeds clientWidth (360px), producing a 2px horizontal scrollbar — fails the brand skill's hard requirement of "no horizontal document overflow greater than 1px".
  3. The offending element is a list-item link containing an inline <code> span (gh aw run) that doesn't break, in the "Other pages" / side-quest links section of the README.
Suggested fix

Allow the inline <code> elements inside these link labels to wrap (e.g. overflow-wrap: anywhere or word-break: break-word on .markdown-body a code, or on the link/list-item itself) so long link labels with inline code don't force a fixed-width overflow at narrow viewports.

Screenshots

README small viewport horizontal overflow near the "Fix Codespaces actions:write Errors" link

[!WARNING]

Firewall blocked 7 domains

The following domains were blocked by the firewall during workflow execution:

  • accounts.google.com
  • android.clients.google.com
  • clients2.google.com
  • registry.npmjs.org
  • update.googleapis.com
  • www.google.com
  • www.gstatic.com

To allow these domains, add them to the network.allowed list in your workflow frontmatter:

network:
  allowed:
    - defaults
    - "accounts.google.com"
    - "android.clients.google.com"
    - "clients2.google.com"
    - "registry.npmjs.org"
    - "update.googleapis.com"
    - "www.google.com"
    - "www.gstatic.com"

See Network Configuration for more information.

Generated by 🎭 Workshop Playwright QA · copilot · auto · 169.1 AIC · ⌖ 5.02 AIC · ⊞ 9.5K · ◷

  • expires on Oct 14, 2026, 7:56 PM UTC
主要语言
JavaScript
星标
53
派生
35
平均合并
13 小时 50 分钟
30 天内合并 PR
14

环境准备

在 Codespaces 中打开

在浏览器里用你自己的 GitHub 账号启动这个项目的开发容器。

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 没有贡献指南

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

githubnext/gh-aw-workshop 的其他 Issue

查看 githubnext/gh-aw-workshop 的全部 Issue

相似的 Issue

更多 JavaScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。