ISTQB CTFL v4.0 関連ドキュメントの Next.js への移行、レイアウト・デザインの復元および最適化、そして Mermaid ダイアグラムのレンダリングバグの包括的修正#80
Merged
Conversation
…vironment in GEMINI.md
✅ Deploy Preview for quality-assurance-studies ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Contributor
|
Warning Review limit reached
Next review available in: 40 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (3)
📝 WalkthroughWalkthroughMermaid の SVG 後処理と運用手順を更新し、ISTQB CTFL v4.0 完全ガイドの Next.js ページ、ナビゲーション、学習文書、関連テスト、移行記録を追加・更新しました。 ChangesMermaid 後処理と運用ガイダンス
ISTQB CTFL v4.0 完全ガイドの追加
推定コードレビュー工数🎯 4 (Complex) | ⏱️ ~60 minutes 関連する可能性のある PR
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
- Migrated Mermaid diagrams to JS template literal format to prevent Prettier formatting corruption - Fixed typo in whitebox testing node (ブランクカバレッジ -> ブランチカバレッジ) - Expanded main content width to full screen and positioned sidebar to the left edge
- Added the markdown source for the CTFL v4.0 comprehensive guide - Formatted lists, blockquotes, and code fences for strict .markdownlint.json rules - Wrapped bare URLs with angle brackets to resolve MD034 lint errors
…s and v11 patterns
…d fix Mermaid diagrams using dynamic rendering
Owner
Author
|
@coderabbitai review |
Contributor
✅ Action performedReview finished.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 11
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@app/istqb-ctfl-complete-guide/istqb-ctfl-complete-guide.css`:
- Around line 80-85: The page still uses hardcoded 60px/84px offsets, so
`--disclaimer-height` is not being applied consistently. Update the
`istqb-ctfl-layout` spacing and the sticky sidebar/anchor styles in
`istqb-ctfl-complete-guide.css` to use the same `calc(60px +
var(--disclaimer-height, 0px))` expression for `margin-top`, `top`, `height`,
and `scroll-margin-top`, and ensure the sidebar sticky nav keeps the required
`z-index: 40`.
In `@app/istqb-ctfl-complete-guide/page.tsx`:
- Around line 874-876: The JSX text in the relevant paragraph contains an
unescaped apostrophe in the “Don't Care” phrase, which will trigger the
react/no-unescaped-entities check. Update the text in the affected paragraph
within the page component to use the escaped form `Don't Care` so the JSX
linter passes cleanly.
- Around line 1466-1675: The external links in this section use target="_blank"
without rel="noopener noreferrer", which leaves the opener tab exposed. Update
the anchor tags in the URL list and footer-note area so every target="_blank"
link also includes rel="noopener noreferrer"; use the repeated link markup in
page.tsx as the place to apply this consistently.
- Around line 26-37: The sidebar hash links jump to section/div IDs and the
target headings are hidden under the fixed header because the scroll offset is
only applied to h2/h3 styles. Update the anchor targets in page.tsx so
NavBar.tsx links land on visible content by either moving the IDs from
section/div wrappers onto the actual heading elements or applying a shared
scroll-margin-top to all elements that receive those IDs, and apply the same
pattern consistently across the other affected sections.
In `@CLAUDE.md`:
- Line 315: Update CLAUDE.md to remove the self-contradicting guidance: in the
“session end checklist” stop requiring autonomous execution of bun run build and
replace it with the Antigravity rule that build verification must be requested
from the user instead of run directly. Also refresh the restart prompt text so
it no longer points to the stale e80058b / 34 route and instead matches the
current repo state and the new build restriction, keeping the checklist and
resume instructions consistent with the CTFL entry already added.
In `@components/Mermaid.tsx`:
- Around line 89-93: `Mermaid.tsx` の `renderMermaid` で `mermaid.render()` を呼ぶ前に
Web フォントの読み込み完了を待つようにしてください。初回描画時に `Noto Sans JP`
が未読込でもレイアウト確定しないよう、`renderMermaid` 内でフォント準備を待機してから `mermaid.render(id, chart)`
を実行し、`setSvgStr` に渡す SVG が正しい文字幅で生成されるように修正してください。
In `@Ctfl-v4-chapter1-fundamentals.md`:
- Around line 447-449: Markdown テーブルの行頭インデントが不揃いで、`**ドメイン知識**`
の行だけ余分なスペースが入っています。`Ctfl-v4-chapter1-fundamentals.md` の該当テーブルで、`**テスト固有の知識**` や
`**分析的思考**` と同じ行頭位置に揃えるように、`**ドメイン知識**` の先頭の不要な空白を हटしてください。
In `@Ctfl-v4-chapter2-sdlc-and-testing.md`:
- Around line 184-194: The Gherkin example under the BDD section uses a fenced
code block without a language tag, which violates the Markdown guideline; update
the snippet to use the appropriate language tag for the content, specifically
the Gherkin example around the BDD heading, so the block is clearly identified
and consistent with the rest of the document.
- Line 5: Chapter 2 currently only shows the exam weighting near the top, so add
an optional end-of-file recap section that repeats the 試験配点 summary (7問 / K1: 2問
/ K2: 5問) similar to Chapter 1. Place it in the final confirmation area of
Ctfl-v4-chapter2-sdlc-and-testing.md so readers can quickly verify the
allocation without searching back to the beginning.
In `@docs/MIGRATION_PROGRESS.md`:
- Around line 18-31: The archive destination path is inconsistent in this
migration log, with references split between archive/html-archive/ and
html-archive/, so update the entries in MIGRATION_PROGRESS.md to use one
canonical path throughout. Keep the wording aligned with the existing migration
item that mentions Istqb-ctfl.html and the archive location, and make sure the
table/header references and the bullet text point to the same archive target.
In `@tests/lib/navigation.test.ts`:
- Around line 5-6: The navigation test currently only checks the total NAV_ITEMS
length, so it can miss misclassification or swapped entries. Update the
NAV_ITEMS assertions in navigation.test.ts to also pin the new CTFL entry by its
href and category, specifically verifying that /istqb-ctfl-complete-guide is
included under istqb-foundation-ext. Keep the length check, but add a direct
entry-level assertion using the NAV_ITEMS structure so this regression is caught
even if other items are rearranged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: a0c97891-c66d-4c45-ac3e-e120721e696d
📒 Files selected for processing (19)
.claude/skills/fix-mermaid/SKILL.mdCLAUDE.mdCtfl-v4-chapter1-fundamentals.htmlCtfl-v4-chapter1-fundamentals.mdCtfl-v4-chapter2-sdlc-and-testing.mdGEMINI.mdapp/globals.cssapp/istqb-ctfl-complete-guide/NavBar.tsxapp/istqb-ctfl-complete-guide/istqb-ctfl-complete-guide.cssapp/istqb-ctfl-complete-guide/page.tsxarchive/html-archive/Istqb-ctfl.htmlcomponents/Mermaid.tsxdocs/MIGRATION_PROGRESS.mddocs/coverage-dashboard.htmle2e/pages.tslib/navigation.tstests/components/Mermaid.test.tsxtests/istqb-ctfl-complete-guide/page.test.tsxtests/lib/navigation.test.ts
Owner
Author
|
@coderabbitai review |
Contributor
✅ Action performedReview finished.
|
Contributor
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
components/Mermaid.tsx (1)
85-88: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
chartが空になったときに既存 SVG をクリアしてください。Line 87 で早期 return すると、非空の
chartを描画した後にchart=""へ変わった場合、前回の SVG が残り続けます。chart変更時に一度svgStrを空にしておくと、古い図が新しいchartで後処理される一瞬の不整合も避けられます。修正案
useEffect(() => { let isMounted = true; - if (!chart) return; + setSvgStr(''); + if (!chart) { + return () => { + isMounted = false; + }; + }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@components/Mermaid.tsx` around lines 85 - 88, The Mermaid rendering effect in Mermaid.tsx leaves the previous SVG on screen when chart becomes empty because the early return skips cleanup. Update the useEffect logic so that when chart is falsy it clears the existing svgStr before returning, and make sure the Mermaid rendering path still uses the current chart value in the effect keyed on chart to avoid stale SVG being shown.app/istqb-ctfl-complete-guide/page.tsx (1)
173-176: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winCT-AI v1.0 の英語試験終了年が 1 年早く書かれています。
ここは「v1.0 は 2027年4月に英語試験終了」ではなく、実際には 2027年4月21日 まで英語版の training / exams が継続です。2026年終了と案内すると受験計画を誤らせるので、年号を修正してください。 (istqb.org)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/istqb-ctfl-complete-guide/page.tsx` around lines 173 - 176, The CT-AI timeline text in the page content is incorrect: the statement in the section that mentions CT-AI v2.0 and CT-AI v1.0 says the English exam ends in 2027-04, but the review notes the actual end date is 2027-04-21. Update the CT-AI v1.0 English training/exam end date in this block of the page.tsx content so the rendered guidance matches the official ISTQB schedule.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@app/istqb-ctfl-complete-guide/page.tsx`:
- Around line 173-176: The CT-AI timeline text in the page content is incorrect:
the statement in the section that mentions CT-AI v2.0 and CT-AI v1.0 says the
English exam ends in 2027-04, but the review notes the actual end date is
2027-04-21. Update the CT-AI v1.0 English training/exam end date in this block
of the page.tsx content so the rendered guidance matches the official ISTQB
schedule.
In `@components/Mermaid.tsx`:
- Around line 85-88: The Mermaid rendering effect in Mermaid.tsx leaves the
previous SVG on screen when chart becomes empty because the early return skips
cleanup. Update the useEffect logic so that when chart is falsy it clears the
existing svgStr before returning, and make sure the Mermaid rendering path still
uses the current chart value in the effect keyed on chart to avoid stale SVG
being shown.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: 4edf5ee6-12f9-4d40-adc5-1d5569e658a1
📒 Files selected for processing (9)
CLAUDE.mdCtfl-v4-chapter1-fundamentals.mdCtfl-v4-chapter2-sdlc-and-testing.htmlCtfl-v4-chapter2-sdlc-and-testing.mdapp/istqb-ctfl-complete-guide/istqb-ctfl-complete-guide.cssapp/istqb-ctfl-complete-guide/page.tsxcomponents/Mermaid.tsxdocs/MIGRATION_PROGRESS.mdtests/lib/navigation.test.ts
…o headings, and clear empty Mermaid SVG state
Owner
Author
|
@coderabbitai review |
Contributor
✅ Action performedReview finished.
|
myoshi2891
changed the title
Contributor
|
Note Docstrings generation - SUCCESS |
Docstrings generation was requested by @myoshi2891. * #80 (comment) The following files were modified: * `app/istqb-ctfl-complete-guide/NavBar.tsx` * `app/istqb-ctfl-complete-guide/page.tsx` * `components/Mermaid.tsx`
Merged
📝 Add docstrings to `dev`
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
主に ISTQB CTFL v4.0 関連ドキュメントの Next.js への移行、レイアウト・デザインの復元および最適化、そして Mermaid ダイアグラムのレンダリングバグの包括的修正 が行われました。
1. 開発ルールの明記と安全性強化
7803919)bun run buildなど）を実行することを禁止するルールを明記しました（メモリ過多によるクラッシュ防止のため）。2. ISTQB CTFL v4.0 ガイドの Next.js 移行とデザイン最適化
b8715d1〜83b5e49)Istqb-ctfl.htmlを Next.js App Router () に完全移行しました。page.tsx
専用のナビゲーションバー（
NavBar.tsx）やスタイルシート（istqb-ctfl-complete-guide.css）、コントラクトテストを新規追加しました。62de8b3〜f7b91c2)max-width）を拡張し、ワイド画面でも快適に閲覧できるように調整しました。3. Mermaid ダイアグラム描画ロジックの改善 (Canonical パターン)
884fb62〜b49288b,99d8700,607dd77)Mermaid.tsx コンポーネントをリファクタリングし、SVG 描画の諸問題を解決する
applySvgFixupsパターン を導入しました。\n）を適切に<br>タグへ変換し、HTML ラベルでの改行を可能に。この修正パターンと手順を に集約・ドキュメント化しました。
.claude/skills/fix-mermaid/SKILL.md
4. CTFL v4.0 各章（Chapter 1 & 2）の詳細化と整理
ドキュメントの分割再構成 (コミット:
03c8ab3〜9257915)これまで一つにまとまっていた
Istqb-ctfl.mdを削除し、章ごとに特化した と に分割・整理しました。Ctfl-v4-chapter1-fundamentals.md
Ctfl-v4-chapter2-sdlc-and-testing.md
Chapter 1 & 2 HTML の移行と微修正 (コミット:
03c8ab3〜607dd77)h1〜h3）タグへ直接配置する修正を加えました。変更された主なファイルと進捗
移行状況の記録:
MIGRATION_PROGRESS.md
追加されたページとテスト:
app/istqb-ctfl-complete-guide/,tests/istqb-ctfl-complete-guide/