リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: 合体ドロップ
ゲームオーバー画面のプレイヤー名入力でスペースキーが入力できない不具合
1. 不具合の内容
v1.23.0で追加されたキーボード操作(Arrow移動/Space・Enter落下/P・Escポーズ)により、ゲームオーバー画面のスコア登録フォーム(player_name のテキスト入力欄)にフォーカスした状態でスペースキーを押すと、名前に半角スペースを入力できない、または想定外にゲーム側の処理(ページスクロール防止のpreventDefault)が働いてしまう可能性がある。
2. 根拠・発生しそうな条件
release_notes(v1.23.0)には「キー入力時は Space によるページスクロールを防ぎ、ポーズ中・スタート画面・ゲームオーバー画面では落下と移動を無視する」とある。この記述から、キー入力ハンドラは document またはキャンバス全体を対象としたグローバルなkeydownリスナーで実装されており、「落下・移動の実行」はゲーム状態別に無視する一方、Spaceキーのデフォルト動作抑止(preventDefault)自体はフォーカス先の要素種別を判定せずに行われている可能性が高い。pages/play.php のゲームオーバー画面には <input name="player_name"> のテキスト入力欄が存在し、ユーザーが「山田 太郎」のようにスペースを含む名前を入力しようとした場合、テキスト欄にフォーカスがあってもグローバルハンドラがSpaceのpreventDefaultを実行してしまうと、実際の文字入力(半角スペース)がブラウザに渡らずスペースが入力できなくなる。同様に矢印キーでのテキストカーソル移動も、input内フォーカス判定がなければ意図せずゲーム側の処理に奪われる恐れがある。
3. 期待動作
player_name の input やその他のテキスト入力・textarea・select要素にフォーカスがある間は、Arrow移動・Space/Enter落下・P/Escポーズなどのゲーム用キーボードショートカットを一切発動させず、ブラウザ標準のテキスト編集動作(スペース入力・カーソル移動・Enterでのフォーム送信など)を優先させる。
4. 修正方針
keydownイベントハンドラの先頭で `const active = document.activeElement; if (active && ['INPUT','TEXTAREA','SELECT'].includes(active.tagName)) { return; }` のようなガード処理を追加し、テキスト入力系要素にフォーカスがある場合は以降のゲーム用キー処理(preventDefaultも含む)を一切実行しないようにする。ゲームキャンバス(tabindex=0)や通常時のグローバル操作には影響を与えず、スタート画面・プレイ中・ポーズ・ゲームオーバー各状態での既存のキー処理ロジックはそのまま維持する。
v1.23.0で追加されたキーボード操作(Arrow移動/Space・Enter落下/P・Escポーズ)により、ゲームオーバー画面のスコア登録フォーム(player_name のテキスト入力欄)にフォーカスした状態でスペースキーを押すと、名前に半角スペースを入力できない、または想定外にゲーム側の処理(ページスクロール防止のpreventDefault)が働いてしまう可能性がある。
2. 根拠・発生しそうな条件
release_notes(v1.23.0)には「キー入力時は Space によるページスクロールを防ぎ、ポーズ中・スタート画面・ゲームオーバー画面では落下と移動を無視する」とある。この記述から、キー入力ハンドラは document またはキャンバス全体を対象としたグローバルなkeydownリスナーで実装されており、「落下・移動の実行」はゲーム状態別に無視する一方、Spaceキーのデフォルト動作抑止(preventDefault)自体はフォーカス先の要素種別を判定せずに行われている可能性が高い。pages/play.php のゲームオーバー画面には <input name="player_name"> のテキスト入力欄が存在し、ユーザーが「山田 太郎」のようにスペースを含む名前を入力しようとした場合、テキスト欄にフォーカスがあってもグローバルハンドラがSpaceのpreventDefaultを実行してしまうと、実際の文字入力(半角スペース)がブラウザに渡らずスペースが入力できなくなる。同様に矢印キーでのテキストカーソル移動も、input内フォーカス判定がなければ意図せずゲーム側の処理に奪われる恐れがある。
3. 期待動作
player_name の input やその他のテキスト入力・textarea・select要素にフォーカスがある間は、Arrow移動・Space/Enter落下・P/Escポーズなどのゲーム用キーボードショートカットを一切発動させず、ブラウザ標準のテキスト編集動作(スペース入力・カーソル移動・Enterでのフォーム送信など)を優先させる。
4. 修正方針
keydownイベントハンドラの先頭で `const active = document.activeElement; if (active && ['INPUT','TEXTAREA','SELECT'].includes(active.tagName)) { return; }` のようなガード処理を追加し、テキスト入力系要素にフォーカスがある場合は以降のゲーム用キー処理(preventDefaultも含む)を一切実行しないようにする。ゲームキャンバス(tabindex=0)や通常時のグローバル操作には影響を与えず、スタート画面・プレイ中・ポーズ・ゲームオーバー各状態での既存のキー処理ロジックはそのまま維持する。
💬 返信 (3)
🛠 開発を開始しました (機能追加 (vegetable-drop))
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
✅ リリース完了のお知らせ
ご要望いただいた「合体ドロップ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=vegetable-drop
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/vegetable-drop/
ご利用ありがとうございます!
ご要望いただいた「合体ドロップ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=vegetable-drop
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/vegetable-drop/
ご利用ありがとうございます!
Echo
Iris