Fix padding when editing PR comments, and detection of non-root issue comment edits (#89)

nedtwigg · web-flow · commit 27ba43e144f0 · 2025-09-26T08:28:53.000-07:00
diff --git a/.claude/commands/corpus-loop.md b/.claude/commands/corpus-loop.md
@@ -52,7 +52,7 @@ If you see `"title": "TODO_TITLE"` or similar hardcoded `TODO` values in the JSO
 
 ## Extraction code style
 
-- Don't hedge your bets and write lots of fallback code or strings of `?.`. Have a specific piece of data you want to get, use non-null `!` assertions where necessary to be clear about getting.
+- Don't hedge your bets and write lots of fallback code or strings of `?.`. Have a specific piece of data you want to get, use non-null ! assertions where necessary to be clear about getting.
 - If a field is empty, represent it with an empty string. Don't use placeholders when extracting data.
 - The pages we are scraping are going to change over time, and it's easier to fix broken ones if we know exactly what used to work. If the code has lots of branching paths, it's harder to tell what it was doing.
 
diff --git a/src/lib/enhancers/github/GitHubEditEnhancer.tsx b/src/lib/enhancers/github/GitHubEditEnhancer.tsx
@@ -8,6 +8,7 @@ import { commonGitHubOptions, prepareGitHubHighlighter } from './github-common'
 const GH_EDIT = 'GH_EDIT' as const
 
 export interface GitHubEditSpot extends CommentSpot {
+  isIssue: boolean
   type: typeof GH_EDIT
 }
 
@@ -21,41 +22,45 @@ export class GitHubEditEnhancer implements CommentEnhancer<GitHubEditSpot> {
       return null
     }
 
-    // Only enhance textareas that are for editing issue/PR body
-    const isIssueBodyEdit = textarea.closest('.react-issue-body')
-    const isPRBodyEdit =
-      textarea.id?.match(/^issue-\d+-body$/) || textarea.name === 'pull_request[body]'
-
-    if (!isIssueBodyEdit && !isPRBodyEdit) {
-      return null
-    }
-
     // Parse GitHub URL structure: /owner/repo/issues/123 or /owner/repo/pull/456
     const match = location.pathname.match(/^\/([^/]+)\/([^/]+)\/(?:issues|pull)\/(\d+)/)
     if (!match) {
       return null
     }
-
     const [, owner, repo, numberStr] = match
     const number = parseInt(numberStr!, 10)
     const unique_key = `github.com:${owner}/${repo}:${number}:edit-body`
 
+    // Only enhance textareas that are for editing issue/PR body
+    const isIssueBodyRootEdit = textarea.closest('.react-issue-body')
+    const isIssueBodyCommentEdit = textarea.closest('[data-wrapper-timeline-id]')
+    const isPRBodyEdit =
+      textarea.name === 'pull_request[body]' || textarea.name === 'issue_comment[body]'
+    //                   ^this is the root pr comment              ^this is the other pr comments (surprising!)
+
+    if (!isIssueBodyRootEdit && !isIssueBodyCommentEdit && !isPRBodyEdit) {
+      return null
+    }
+
     logger.debug(`${this.constructor.name} enhanced issue/PR body textarea`, unique_key)
     return {
+      isIssue: !!(isIssueBodyRootEdit || isIssueBodyCommentEdit),
       type: GH_EDIT,
       unique_key,
     }
   }
 
-  enhance(textArea: HTMLTextAreaElement, _spot: GitHubEditSpot): OverTypeInstance {
+  enhance(textArea: HTMLTextAreaElement, spot: GitHubEditSpot): OverTypeInstance {
     prepareGitHubHighlighter()
     const overtypeContainer = modifyDOM(textArea)
-    return new OverType(overtypeContainer, {
+    const overtype = new OverType(overtypeContainer, {
       ...commonGitHubOptions,
-      minHeight: '102px',
-      padding: 'var(--base-size-8)',
-      placeholder: 'Add your comment here...',
+      padding: spot.isIssue ? 'var(--base-size-16)' : 'var(--base-size-8)',
     })[0]!
+    if (!spot.isIssue) {
+      // TODO: autoheight not working
+    }
+    return overtype
   }
 
   tableUpperDecoration(_spot: GitHubEditSpot): React.ReactNode {
diff --git a/tests/corpus/_corpus-index.ts b/tests/corpus/_corpus-index.ts
@@ -14,10 +14,15 @@ export const CORPUS: Record<string, CorpusEntry> = {
   },
   // HAR corpus (initial page loads)
   gh_issue_edit: {
-    description: 'editing an existing comment on an issue',
+    description: 'edit an existing comment on an issue',
     type: 'html',
     url: 'https://github.com/diffplug/gitcasso/issues/56',
   },
+  gh_issue_edit_multiple: {
+    description: 'edit an existing comment on an issue (root and appended)',
+    type: 'html',
+    url: 'https://github.com/diffplug/testing-deletable/issues/3',
+  },
   gh_issue_new: {
     description: 'a new issue wiht some fields filled out',
     type: 'html',
@@ -28,10 +33,15 @@ export const CORPUS: Record<string, CorpusEntry> = {
     url: 'https://github.com/diffplug/selfie/pull/517',
   },
   gh_pr_edit: {
-    description: 'editing an existing comment on a PR',
+    description: 'edit an existing comment on a PR',
     type: 'html',
     url: 'https://github.com/diffplug/gitcasso/pull/58',
   },
+  gh_pr_edit_multiple: {
+    description: 'edit an existing comment on a PR  (root and appended)',
+    type: 'html',
+    url: 'https://github.com/diffplug/testing-deletable/pull/5',
+  },
   gh_pr_new: {
     type: 'har',
     url: 'https://github.com/diffplug/selfie/compare/main...cavia-porcellus:selfie:main?expand=1',
diff --git a/tests/corpus/gh_issue_edit_multiple.html b/tests/corpus/gh_issue_edit_multiple.html
diff --git a/tests/corpus/gh_pr_edit_multiple.html b/tests/corpus/gh_pr_edit_multiple.html
diff --git a/tests/lib/enhancers/__snapshots__/gh-detection.test.ts.snap b/tests/lib/enhancers/__snapshots__/gh-detection.test.ts.snap
@@ -21,6 +21,7 @@ exports[`github detection > gh_issue_edit:should detect correct spots 1`] = `
   {
     "for": "id=:rc3: name=null className=prc-Textarea-TextArea-13q4j focus-visible overtype-input",
     "spot": {
+      "isIssue": true,
       "type": "GH_EDIT",
       "unique_key": "github.com:diffplug/gitcasso:56:edit-body",
     },
@@ -39,6 +40,38 @@ exports[`github detection > gh_issue_edit:should detect correct spots 1`] = `
 ]
 `;
 
+exports[`github detection > gh_issue_edit_multiple:should detect correct spots 1`] = `
+[
+  {
+    "for": "id=:r76: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
+    "spot": {
+      "isIssue": true,
+      "type": "GH_EDIT",
+      "unique_key": "github.com:diffplug/testing-deletable:3:edit-body",
+    },
+  },
+  {
+    "for": "id=:r8k: name=null className=prc-Textarea-TextArea-13q4j focus-visible overtype-input",
+    "spot": {
+      "isIssue": true,
+      "type": "GH_EDIT",
+      "unique_key": "github.com:diffplug/testing-deletable:3:edit-body",
+    },
+  },
+  {
+    "for": "id=:r5b: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
+    "spot": {
+      "domain": "github.com",
+      "number": 3,
+      "slug": "diffplug/testing-deletable",
+      "title": "Test 3",
+      "type": "GH_ISSUE_APPEND",
+      "unique_key": "github.com:diffplug/testing-deletable:3",
+    },
+  },
+]
+`;
+
 exports[`github detection > gh_issue_new:should detect correct spots 1`] = `
 [
   {
@@ -80,6 +113,7 @@ exports[`github detection > gh_pr_edit:should detect correct spots 1`] = `
   {
     "for": "id=issue-3429313834-body name=pull_request[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field focus-visible overtype-input",
     "spot": {
+      "isIssue": false,
       "type": "GH_EDIT",
       "unique_key": "github.com:diffplug/gitcasso:58:edit-body",
     },
@@ -100,6 +134,43 @@ exports[`github detection > gh_pr_edit:should detect correct spots 1`] = `
 ]
 `;
 
+exports[`github detection > gh_pr_edit_multiple:should detect correct spots 1`] = `
+[
+  {
+    "for": "id=issue-3454672384-body name=pull_request[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field overtype-input",
+    "spot": {
+      "isIssue": false,
+      "type": "GH_EDIT",
+      "unique_key": "github.com:diffplug/testing-deletable:5:edit-body",
+    },
+  },
+  {
+    "for": "id=convert-to-issue-body-3335416053 name=issue[body] className=form-control input-contrast comment-form-textarea js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable",
+    "spot": "NO_SPOT",
+  },
+  {
+    "for": "id=issuecomment-3335416053-body name=issue_comment[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field focus-visible overtype-input",
+    "spot": {
+      "isIssue": false,
+      "type": "GH_EDIT",
+      "unique_key": "github.com:diffplug/testing-deletable:5:edit-body",
+    },
+  },
+  {
+    "for": "id=new_comment_field name=comment[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit FormControl-textarea CommentBox-input js-size-to-fit size-to-fit js-session-resumable js-saved-reply-shortcut-comment-field overtype-input",
+    "spot": {
+      "domain": "github.com",
+      "number": 5,
+      "slug": "diffplug/testing-deletable",
+      "title": "Update README.md
+ #5",
+      "type": "GH_PR_APPEND",
+      "unique_key": "github.com:diffplug/testing-deletable:5",
+    },
+  },
+]
+`;
+
 exports[`github detection > gh_pr_new:should detect correct spots 1`] = `
 [
   {
diff --git a/tests/lib/enhancers/__snapshots__/gh-ui.test.ts.snap b/tests/lib/enhancers/__snapshots__/gh-ui.test.ts.snap
@@ -59,6 +59,46 @@ exports[`github ui > gh_issue_edit:should render correct UI elements 1`] = `
 ]
 `;
 
+exports[`github ui > gh_issue_edit_multiple:should render correct UI elements 1`] = `
+[
+  {
+    "for": "id=:r76: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
+    "title": "N/A",
+    "upperDecoration": <span>
+      N/A
+    </span>,
+  },
+  {
+    "for": "id=:r8k: name=null className=prc-Textarea-TextArea-13q4j focus-visible overtype-input",
+    "title": "N/A",
+    "upperDecoration": <span>
+      N/A
+    </span>,
+  },
+  {
+    "for": "id=:r5b: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
+    "title": "Test 3",
+    "upperDecoration": <React.Fragment>
+      <span
+        className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
+      >
+        <IssueOpenedIcon
+          size={16}
+        />
+      </span>
+      #
+      3
+      <a
+        className="truncate hover:underline"
+        href="https://github.com/diffplug/testing-deletable"
+      >
+        diffplug/testing-deletable
+      </a>
+    </React.Fragment>,
+  },
+]
+`;
+
 exports[`github ui > gh_issue_new:should render correct UI elements 1`] = `
 [
   {
@@ -134,6 +174,43 @@ exports[`github ui > gh_pr_edit:should render correct UI elements 1`] = `
 ]
 `;
 
+exports[`github ui > gh_pr_edit_multiple:should render correct UI elements 1`] = `
+[
+  {
+    "for": "id=issue-3454672384-body name=pull_request[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field overtype-input",
+    "title": "N/A",
+    "upperDecoration": <span>
+      N/A
+    </span>,
+  },
+  {
+    "for": "id=issuecomment-3335416053-body name=issue_comment[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field focus-visible overtype-input",
+    "title": "N/A",
+    "upperDecoration": <span>
+      N/A
+    </span>,
+  },
+  {
+    "for": "id=new_comment_field name=comment[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit FormControl-textarea CommentBox-input js-size-to-fit size-to-fit js-session-resumable js-saved-reply-shortcut-comment-field overtype-input",
+    "title": "Update README.md
+ #5",
+    "upperDecoration": <React.Fragment>
+      <span
+        className="font-mono text-muted-foreground text-sm"
+      >
+        diffplug/testing-deletable
+      </span>
+      <span
+        className="ml-2 font-medium"
+      >
+        PR #
+        5
+      </span>
+    </React.Fragment>,
+  },
+]
+`;
+
 exports[`github ui > gh_pr_new:should render correct UI elements 1`] = `
 [
   {
