From 717ccc0bdbdfc3257ab31de23b1688d537ace99b Mon Sep 17 00:00:00 2001
From: Simon Willison <swillison@gmail.com>
Date: Mon, 1 Jun 2026 15:17:59 -0700
Subject: [PATCH] Use form submit for HN username input

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 hn-comments-for-user.html | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/hn-comments-for-user.html b/hn-comments-for-user.html
index c630fd33..be372c4f 100644
--- a/hn-comments-for-user.html
+++ b/hn-comments-for-user.html
@@ -18,17 +18,18 @@
 </head>
 <body>
   <h1>Hacker News comments for a user</h1>
-  <div class="controls">
+  <form id="user-form" class="controls">
     <label for="hn-user">Hacker News handle:</label>
     <input id="hn-user" type="text" placeholder="e.g., pg" />
-    <button id="fetchBtn">Fetch comments</button>
-    <button id="copyBtn" disabled>Copy Output</button>
-  </div>
+    <button id="fetchBtn" type="submit">Fetch comments</button>
+    <button id="copyBtn" type="button" disabled>Copy Output</button>
+  </form>
   <p>Fetches up to 1,000 recent comments.</p>
   <textarea id="output" placeholder="Comments will appear here..."></textarea>
   <div id="note"></div>
 
   <script>
+    const form = document.getElementById('user-form');
     const username = document.getElementById('hn-user');
     const fetchBtn = document.getElementById('fetchBtn');
     const copyBtn = document.getElementById('copyBtn');
@@ -83,7 +84,11 @@ <h1>Hacker News comments for a user</h1>
       note.textContent = `Fetched ${all.length} comment(s).`;
     }
 
-    fetchBtn.addEventListener('click', () => fetchComments(username.value.trim()));
+    const submitUsername = () => fetchComments(username.value.trim());
+    form.addEventListener('submit', (event) => {
+      event.preventDefault();
+      submitUsername();
+    });
     copyBtn.addEventListener('click', async () => {
       await navigator.clipboard.writeText(output.value);
       const originalText = copyBtn.textContent;
