生成AI
Reactのエラー表示がスクリーンリーダーで読まれない問題を、永続コンテナとaria-pressedで直す新着!!

Reactの条件付きエラー表示は、スクリーンリーダーに読まれないことがあります。常時DOMに置く永続コンテナと、固定ラベル+aria-pressedのトグルボタン、冪等なa11yスナップショットで直す方法をコード付きで解説します。

続きを読む
生成AI
設定画面の文字サイズ切り替えが画面に反映されない原因と直し方:永続化とルート属性で全画面に効かせる新着!!

設定画面で文字サイズのトグルを切り替えても画面の見た目が変わらない、またリロードすると元に戻ってしまう原因は、値の永続化不足とスタイルの適用範囲の狭さにあります。保存処理の切り出しと`html`要素へのdata属性付与で全画面に反映させる修正方法と、E2Eテストでの検証方法を解説します。

続きを読む
生成AI
CIのsupabase startが即死する原因はdocker contextのズレ。リトライ前にprobeで防ぐ方法

self-hostedランナーで複数のDocker実装が同居すると、Supabase CLIが死んだdefault contextへ直行してE2Eが即失敗します。起動前にdocker contextをprobeしてDOCKER_HOSTを固定する対策を、コード付きで解説します。

続きを読む
生成AI
CIでローカルDBがポート競合で落ちる原因はephemeral portだった:ハングも拾うリトライ設計

CI でローカル DB(Docker ベースのバックエンドスタック)を起動すると、ごくまれに「ポートが既に使用されています」というエラーで落ちることがあります。

続きを読む
生成AI
未発売プランの仮の料金が画面に出てしまう問題を、キーの有無と型で防ぐ

月額課金のSaaSで、まだ発売していないプランの料金が画面に表示されてしまう不具合に遭遇しました。

続きを読む
生成AI
複数Webhookが同じ列を書くと保護期間が壊れる:短縮方向だけを止めるクランプ設計

課金システムで、既存ユーザー向けに「90日間は権限を保護する」といった猶予期間を設けることがあります。

続きを読む
生成AI
Playwrightでwebkitだけ落ちるE2Eを直す: cold-load nav-stallをin-contextで復帰させる

Playwrightのnightly E2Eでwebkitだけ失敗する「wedge」状態を、about:blank遷移で復帰させる方法と、flakyと実装バグを機械的に分類しCIノイズを減らす設計を解説します。

続きを読む
生成AI
Next.js 16 Cache Componentsで踏んだ2つの罠——キャッシュの反映遅延とE2Eの多重ヒット

Next.js 16のCache Componentsで、revalidateTagの反映遅延とPlaywrightのstrict mode違反という2つの不具合に遭遇。原因と対処法(expire:0指定・ロケータのスコープ変更)を整理しました。

続きを読む
E2Eテスト
E2Eテストの「検疫タグ」運用を形骸化させない設計

E2Eの検疫タグ運用は、隔離した瞬間より隔離し続ける間の設計が重要です。追跡Issueの定数化や実測値ベースの剥奪判定で、隔離の形骸化を防ぐ方法を解説します。

続きを読む
生成AI
CLIの起動判定がCIでだけ失敗する謎—TTY検出で出力形式が変わる罠

CLIはTTY接続の有無で出力形式を変えることがあり、これがE2EテストのCI環境でのみ起動判定が失敗する原因に。この謎を解き明かし、起動待ち判定の切り分け方と、原因の見えにくい不具合を解決するアプローチを解説します。

続きを読む