リンクダイアログのURL表示が欠落する不具合を修正
直前のリファクタリングで誤ったメソッド名が使われたことにより、リンクダイアログを開いたときに既存のURLが表示されなくなっていました。本PRはその1行修正と、リグレッション防止のためのブラウザテスト2件を追加します。
背景
#945 によって、リンクダイアログ内部の <form> 要素が除去されました。Lexxy はページ上の <form> 要素内に配置されることが多く、ネストしたフォームは無効なHTMLとなって予期しない挙動を引き起こすためです。このリファクタリングの中で、URLを取得するメソッド呼び出しが誤ったものに書き換えられました。
その結果、既存のリンクを選択してダイアログを開いても、URLの入力欄が空のまま表示される状態になっていました。
技術的な変更
src/elements/dropdown/link.js 内の #selectedLinkUrl ゲッターで、getUrl() が getURL() に修正されました。あわせて、リンクが存在しない場合の戻り値が null から空文字列 "" に変更されています。
変更前:
get #selectedLinkUrl() {
return this.editor.getEditorState().read(() => {
const linkNode = this.editorElement.selection.nearestNodeOfType(LinkNode)
return linkNode?.getUrl() ?? null
})
}
変更後:
get #selectedLinkUrl() {
return this.editor.getEditorState().read(() => {
const linkNode = this.editorElement.selection.nearestNodeOfType(LinkNode)
return linkNode?.getURL() ?? ""
})
}
getURL() は LinkNode が提供する正しいメソッド名であり、getUrl() は存在しないためURLが取得できず undefined が返っていました。戻り値の変更(null → "")は、URLの入力欄に null がそのまま渡されることで起こりうる表示上の問題を防ぐための対応です。
テスト側では、test/browser/tests/formatting/block_formatting.test.js に2件のブラウザテストが追加されました。1件目は <a href="https://37signals.com"> を含むコンテンツでリンクテキストを選択してダイアログを開き、URLの入力欄に https://37signals.com が表示されることを検証します。2件目はリンクなしのテキストを選択した場合にURLの入力欄が空であることを確認します。どちらのテストも、details 要素の toggle イベントをプログラムから発火させてダイアログを開くアプローチを取っています。
設計判断
戻り値を null から "" に変えた判断が注目されます。フォールバック値として null を使うと、呼び出し元でnullチェックが必要になり、HTMLの <input type="url"> に渡したときに文字列 "null" が表示されるリスクがあります。空文字列を返すことでURL入力欄の値とそのまま対応し、余分な変換処理を不要にしています。
またリグレッションテストを同一PRに含めることで、同じ誤りが将来のリファクタリングで再発した場合にCIで検出できるようになっています。ダイアログの開閉をUIから操作するのではなく dispatchEvent で再現している点は、テストの安定性を優先した選択です。
まとめ
本PRはメソッド名の誤りという1文字レベルのバグを修正するとともに、「リンク選択時にURLが表示される」という動作をブラウザテストで明示的に保護しました。小さな変更であっても、リグレッションテストをセットで追加する姿勢が、今後の安全なリファクタリングを支えます。