2026年2月26日の開発日記

朝、BlogCalendarの色がおかしいことに気づいて調査を始めた。そこからテスト整備、セキュリティレビューと続いて、mdx-playgroundの品質を一気に底上げした一日になった。

今日やったこと

1. BlogCalendar CSSバグ修正

カレンダー上で日記が黄色のはずなのに水色で表示される現象を追跡した。todo: "memo" のCSSクラスが category-diary を上書きしていた。

主な成果:

diary-*.md 6ファイルから todo: "memo" を削除
make-diaryスキルに「統合日記にtodo:memoを付けない」ルールを追記
詳細記事のcategory不統一も整理（"diary" → "dev" に統一）

詳細: BlogCalendarのCSS優先順位バグ修正

2. Vitest・Playwright テスト環境整備

36ファイル中29パスしかない状態から始めて、e2e分離、失敗テスト修正、カバレッジ導入、テスト追加を積み上げた。

主な成果:

e2eテストのVitest除外設定
@vitest/coverage-v8 導入（.tsファイルのみに絞って計測）
テスト容易な3ファイルのユニットテストを新規作成
Playwright e2eテスト 3ファイル・16ケース登録
最終結果: 全34ファイル / 14,817テスト全パス

詳細: Vitest・Playwright テスト環境整備

3. セキュリティレビューと脆弱性修正

セキュリティ・パフォーマンス・SREの3視点で並列レビューを実施。Critical/Highの脆弱性を全件解消した。

主な成果:

content-images.tsにパストラバーサル防御を追加
直接依存（devalue, h3）を最新版に更新
トランジティブ依存はpnpm overridesで強制更新（fast-xml-parser, rollup等）
Critical/High: 全て0件に（残りはmoderate 3件 + low 4件のみ）

詳細: セキュリティレビューと脆弱性修正

今日の学び

CSSの詳細度が同じとき、ソース順の後が勝つ。フィルタロジックとCSS適用順は別物
Vitestとcoverage-v8はバージョンを揃えないと動かない。package.jsonを確認してからインストール
pnpm overridesはトランジティブ依存の脆弱性修正に有効。ロックファイル再生成で即反映
パストラバーサル防御は resolve → startsWith の2ステップが基本

明日やること

Playwright e2eテストをdevサーバー起動で実行確認
カバレッジのModerate/Low残件をウォッチ（パッチリリース待ち）
Vue SFCのカバレッジ計測を検討

関連記事