fix(loader-website): the loading page is titled Title and gives screen readers no status

未關閉
#142 0 則留言 0 個 reaction 已指派 0 人 在 GitHub 檢視

維護者通常 1 天內回覆

@arpanjot-coding 已經在處理了。

開始於 2026年11月11日。

  • #148 來自 @arpanjot-coding —— 未關閉

評估

難度
2/5
預估耗時
1-3 小時
新手友好度
25/100
Issue 類型
缺陷
描述清晰度
描述清楚
活躍度
停滯
技術堆疊
html, typescript

研究方向

Start with apps/website/src/index.html, especially the loading shell at lines 8–25, then inspect window.ts for loading bar updates. Add the suggested title, screen reader announcements, progress values, and meaningful logo text; done when loading and error states are announced and the progress bar exposes its current value. An open pull request already addresses this issue.

由索引模型根據 Issue 內容生成。

描述

app:website bug good first issue
Which app is this bug report for?

website

Issue description

Accessibility of the loading shell (index.html#L8-L25):

  • The document title is <title>Title</title>.
  • The loading step and the error message are plain <div>s: no role="status"/aria-live, no role="alert". Screen-reader users get no feedback on loading or on errors.
  • The loading bar has no role="progressbar" / aria-valuenow.
  • The logo's alt="logo" says nothing useful.

Expected: a meaningful title, and loading and error states announced to assistive technologies.

Suggested fix: title "NanoForge" (or the game name); role="status" aria-live="polite" on #loading-step; role="alert" on #loader-error; role="progressbar" with aria-valuemin/max/now on #loading-bar (updated in window.ts); alt="NanoForge".

Found during a read-only audit of main @ 044c766 (2026-11-11).

Code sample

No response

Versions
  • @nanoforge-dev/loader-client / @nanoforge-dev/loader-server / @nanoforge-dev/loader-website 1.7.0 (main @ 044c766)
  • Bun 1.3.14
  • Linux x86_64
Issue priority

Low (slightly annoying)

I have tested this issue on a development release

044c766

主要語言
TypeScript
星號
1
分支
0
平均合併
17 小時 25 分鐘
30 天內合併 PR
11

環境準備

從這裡開始

  1. 先讀完整個 Issue,再讀專案的貢獻指南。
  2. 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
  3. Fork 儲存庫,在一個分支上完成修改。
  4. 送出 Pull Request,並在描述裡引用這個 Issue 編號。

NanoForge-dev/Loader 的其他 Issue

查看 NanoForge-dev/Loader 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。