リンクダイアログのURL表示が欠落する不具合を修正

basecamp/lexxy

直前のリファクタリングで誤ったメソッド名が使われたことにより、リンクダイアログを開いたときに既存の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が表示される」という動作をブラウザテストで明示的に保護しました。小さな変更であっても、リグレッションテストをセットで追加する姿勢が、今後の安全なリファクタリングを支えます。

記事メタデータ

Generated by:
Claude Sonnet 4.6 for DiffDaily
LLM Trace:
f1dd68ba

この記事はAIによって自動生成されています。内容の正確性については、必ずソースコードやPRを確認してください。

品質レビュー結果

Review Status:
承認済み
Review Count:
1回
Reviewed by:
Gemini 2.5 Pro for DiffDaily

Review Criteria:

記事構成 ✓ PASS

Title, Context, Technical Detailの存在と明確さ

「総論→各論→結論」の構成が記事全体で明確に適用されています。リード文(総論)、背景・技術的な変更・設計判断(各論)、まとめ(結論)の各要素が適切に配置され、非常に分かりやすい構成です。

カスタムMarkdown構文 ✓ PASS

シンタックスハイライト・GitHubリンク記法の正確性

ファイル名付きシンタックスハイライト(```javascript:ファイルパス```)やGitHubのPRリンク記法([#945](URL))が正しく使用されています。

対象読者への適合性 ✓ PASS

エンジニア向けの適切な技術レベルと表現

リグレッションテストやメソッド名のタイポといったトピックは、専門知識を持つエンジニアという対象読者に完全に適合しています。過度な初心者向けの説明もありません。

パラグラフ・ライティング ✓ PASS

トピックセンテンス・1段落1トピック・段落長

各セクション、各パラグラフが「総論→各論」の構造で書かれており、トピックセンテンスが明確です。1段落1トピックが守られ、段落長も適切で可読性が高いです。

Diff内容との照合 ✓ PASS

コードブロックとDiff内容の一致

記事で引用されているコード変更(getUrl -> getURL, null -> "")は、提供されたDiffと完全に一致しています。テストコードに関する説明もDiffの内容を正確に反映しています。

技術用語の正確性 ✓ PASS

技術用語の正確な使用

「リグレッション」「ゲッター」「CI」「dispatchEvent」などの技術用語が、文脈に沿って正確かつ適切に使用されています。

説明の技術的正確性 ✓ PASS

技術的主張の正確性と論理性

メソッド名のタイポが原因であること、戻り値をnullから空文字列に変更した理由など、技術的な説明は論理的かつ正確です。

事実の突合 ✓ PASS

PR情報による主張の裏付け(ハルシネーション検出)

記事内のすべての主張は、PRのタイトル、説明、Diff、およびPR内でリンクされている関連PR(#945)によって裏付けられており、ハルシネーション(捏造)は見られません。

数値・固有名詞の確認 ✓ PASS

PR番号・コミットID・バージョン等の正確性

PR番号(#974, #945)が正確に記載されています。

タイトル・説明との一致 ✓ PASS

記事タイトル・説明とPR内容の一致

記事のタイトル「リンクダイアログのURL表示が欠落する不具合を修正」は、元のPRの主題「Fix missing URL value in Link dialog」を忠実に反映しています。

外部知識の正確性 ✓ PASS

PRに記載のない外部知識(LTS、サポート状況など)の不使用

記事の内容は提供されたPR情報とその関連情報に限定されており、LTSやリリース予定日といったPR外の知識の捏造はありません。

時間表現の正確性 ✓ PASS

時間表現がPR情報と一致しているか

「直前のリファクタリング」という表現は、PR Descriptionの「A recent change」と一致しており、時間表現は正確です。