ウェルカムバナーの検索入力、結果を選択するとフォーカスが外れる

UX
,
1

ウェルカムバナーで検索を入力すると、候補結果を選択した後にフォーカスが失われます。クリアボタンを使用した場合にも、この問題が発生します。

代わりに、コンソールに次のエラーがスローされます。

The image shows an error message stack trace indicating a "TypeError: Cannot read properties of null" due to a scenario where a focus search input fails to provide a value. (Captioned by AI)
The image shows an error message stack trace indicating a "TypeError: Cannot read properties of null" due to a scenario where a focus search input fails to provide a value. (Captioned by AI)592×176 6.66 KB

s[/s] EDIT: Martinがすでに修正のためのPRを用意しています。

「いいね！」 1
2

これが関連しているかどうかわかりませんが、複数の検索メニューが利用可能な場合にいくつかの不整合があるようです。たとえば、キーボードショートカット / を検索に使用すると、検索バナーがレンダリングされている場合でも、ヘッダー検索が開いてフォーカスされます。これは、検索アイコンが実際にはヘッダーに非表示になっている場合でも発生します。

「いいね！」 3
3

最近再構築しましたか？これを修正する関連PRを確認しました：UX: Fix various search shortcut UX issues (#31903) · discourse/discourse@832ed8c · GitHub

「いいね！」 2
4

おお、見ていませんでした…これはちゃんとした修正のようですね！:grinning_face_with_smiling_eyes:

しかし、動作が完全に一致していないようです…コアで有効になっている新しい検索バナーでは機能します。その場合、検索バナーのみがフォーカスされます。

しかし、コンポーネント（現在は高度な検索バナー）のバナーはフォーカスされず、ヘッダーの検索アイコンがフォーカスされます。

そして、ヘッダー検索をインストールしてコアバナーを有効にすると、両方が同時にフォーカスされます。

The image shows a webpage with a search bar and a message that says "Welcome back, nolo!" with placesholders "filters by category or tag" and "filters by topic status" beneath it, along with a circular profile picture and a speech bubble on the right side. (Captioned by AI)
The image shows a webpage with a search bar and a message that says "Welcome back, nolo!" with placesholders "filters by category or tag" and "filters by topic status" beneath it, along with a circular profile picture and a speech bubble on the right side. (Captioned by AI)1125×291 17.2 KB

そのため、多くの組み合わせがあるようで、明確なフォーカス階層を定義するのは少し難しいかもしれません。

「いいね！」 1
5

ええ、難しいですね！:sweat_smile:

ちなみに、Martinが私の問題を修正するPRに取り組んでおり、いくつかの改善も行われています。あなたのコンテキストにも役立つかもしれません。

「いいね！」 4