Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

The three help walkthroughs each have their own copy of shot()

オープン
  • 何か問題がありますか？
#651 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

@nahuel007ng がすでに取り組んでいます。

2026年10月26日 から。

  • #667 @nahuel007ng による — オープン

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
72/100
issue の種類
リファクタリング
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
playwright, typescript
領域
developer-experience, testing

調査の方向性

Read the three specs under tests/e2e/help/, especially close-or-reopen-a-signup.spec.ts, and the template in .claude/skills/help-pages/scripts/new-article.mjs. Extract the shared clip behavior into tests/e2e/helpers/help-shots.ts, preserve the two screenshot styles, then update the skill's SKILL.md. Run the screenshot command and confirm public/help/ stays byte-identical; the issue lists the lint, typecheck, knip, and test commands as completion checks.

索引モデルが issue の本文から書いたものです。

説明

enhancement good first issue pipeline:ready

What happens

Each walkthrough under tests/e2e/help/ has its own shot() for taking the article's pictures when HELP_SCREENSHOTS=1. Each also has its own CAPTURE and SHOT_DIR constants:

  • close-or-reopen-a-signup.spec.ts: clips the page round one or more targets, with padding on each side (16px by default), in whole pixels.
  • take-someone-off-a-slot.spec.ts: the same clip, for one target with 16px of padding.
  • create-and-publish-a-signup.spec.ts: target.screenshot() of the element itself, with no padding.

new-article.mjs in the help-pages skill (.claude/skills/help-pages/scripts/) writes a fourth copy into every new walkthrough. So a fix to one, such as the 300 ms settle wait or the rounding, has to be made in each.

Fix, in outline

  • Move the clip version from close-or-reopen-a-signup.spec.ts to a new tests/e2e/helpers/help-shots.ts. It takes the article's slug, for example helpShot(page, slug, targets, name, pad).
  • Use it in close-or-reopen-a-signup and take-someone-off-a-slot. It makes the same pictures both of them make today.
  • Give create-and-publish-a-signup a second export that shoots the whole element (target.screenshot()), so its pictures don't change either.
  • Have new-article.mjs's template import the helper instead of writing its own.
  • Update the help-pages skill's SKILL.md, which mentions "its shot() helper".

Watch for

  • The pictures must not change. src/help/articles.test.tsx checks each picture's real size against the article, so a 1px change fails it.
  • knip fails on an unused export, so export only what the specs use.
  • Overlap: the follow-up that re-takes what-people-see.png at phone width edits the same spec. Whichever lands second has a small merge.

Done when

  • No spec under tests/e2e/help/ defines its own shot(), and neither does new-article.mjs's template.
  • pnpm help:screenshots leaves every file under public/help/ byte-identical: git status shows no change.
  • The help walkthroughs pass.
  • pnpm lint && pnpm typecheck && pnpm knip && pnpm test pass.

From the reviews of #610 (the help page on closing and reopening, merged as #650). Checked against the three specs and new-article.mjs on main at 1d4ff3a. https://claude.ai/code/session_01LrYa57fvbqWjZj89iH975K

主要言語
TypeScript
スター
19
フォーク
4
平均マージ
20時間 9分
マージ済み PR（30日）
156

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

richshaw/OpenSignup のほかの issue

richshaw/OpenSignup の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。