From 024049d480ab218cea8b9b983f62e3c9ac574e00 Mon Sep 17 00:00:00 2001
From: Je Xia <i@jex.me>
Date: Mon, 20 Jul 2026 19:20:10 +0800
Subject: [PATCH 1/2] [diffs/edit] fix selection rounded corner rendering

---
 packages/diffs/src/editor/editor.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/diffs/src/editor/editor.ts b/packages/diffs/src/editor/editor.ts
index 20e3cbd1c..4c2882d44 100644
--- a/packages/diffs/src/editor/editor.ts
+++ b/packages/diffs/src/editor/editor.ts
@@ -3943,7 +3943,11 @@ export class Editor<LAnnotation> implements DiffsEditor<LAnnotation> {
       // absent (context lines) the CSS falls back to the editor base bg.
       const lineElement = this.#getLineElement(line);
       let cornerBg = 'initial';
-      if (this.#isDiff && lineElement?.dataset.lineType === 'change-addition') {
+      if (
+        lineElement !== undefined &&
+        (lineElement.dataset.lineType === 'change-addition' ||
+          lineElement.dataset.selectedLine !== undefined)
+      ) {
         cornerBg =
           getComputedStyle(lineElement).getPropertyValue('--diffs-line-bg');
       }

From f0b19efcedb0e695418c3cde025de43469aebf31 Mon Sep 17 00:00:00 2001
From: Je Xia <i@jex.me>
Date: Mon, 20 Jul 2026 19:39:45 +0800
Subject: [PATCH 2/2] add e2e testing

---
 packages/diffs/test/e2e/theme.pw.ts | 51 +++++++++++++++++++++++++++++
 1 file changed, 51 insertions(+)

diff --git a/packages/diffs/test/e2e/theme.pw.ts b/packages/diffs/test/e2e/theme.pw.ts
index 64e82f30a..1c900c5fd 100644
--- a/packages/diffs/test/e2e/theme.pw.ts
+++ b/packages/diffs/test/e2e/theme.pw.ts
@@ -249,6 +249,57 @@ test.describe('theme line highlights', () => {
     expect(both.painted).not.toEqual(selected.painted);
   });
 
+  test('rounded selection corners match a selected line background', async ({
+    page,
+  }) => {
+    await openFixture(page, { name: 'pierre-light', type: 'light' });
+    await setLineHighlightState(page, 'selected');
+    await page.evaluate(() => {
+      window.__editor?.setSelections([
+        {
+          start: { line: 0, character: 10 },
+          end: { line: 2, character: 10 },
+          direction: 'forward',
+        },
+      ]);
+    });
+    await expect(page.locator('[data-selection-corner]')).not.toHaveCount(0);
+
+    const colors = await page.evaluate(() => {
+      const root = document.querySelector('diffs-container')?.shadowRoot;
+      const row = root?.querySelector<HTMLElement>(
+        '[data-content] > [data-line="2"]'
+      );
+      const corner = [
+        ...(root?.querySelectorAll<HTMLElement>('[data-selection-corner]') ??
+          []),
+      ].find(
+        (element) =>
+          Math.abs(
+            element.getBoundingClientRect().top -
+              (row?.getBoundingClientRect().top ?? Number.NaN)
+          ) < 0.5
+      );
+      if (row == null || corner == null) {
+        throw new Error('Missing selected row corner.');
+      }
+
+      const probe = document.createElement('span');
+      probe.style.backgroundColor = 'var(--diffs-bg)';
+      row.append(probe);
+      const base = getComputedStyle(probe).backgroundColor;
+      probe.remove();
+      return {
+        base,
+        corner: getComputedStyle(corner).backgroundColor,
+        line: getComputedStyle(row, '::after').backgroundColor,
+      };
+    });
+
+    expect(colors.line).not.toBe(colors.base);
+    expect(colors.corner).toBe(colors.line);
+  });
+
   test('a missing active background preserves the resolved line color', async ({
     page,
   }) => {