Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .changeset/remove-transparent-background-helper.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
---
---
14 changes: 11 additions & 3 deletions src/ui/diff/pierre.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import { renderCodeOnlyPlannedRowText, renderDecoratedPlannedRowText } from "./r
import { stackCellPalette } from "./rowStyle";
import { buildReviewRenderPlan } from "./reviewRenderPlan";
import { measureTextWidth } from "../lib/text";
import { TRANSPARENT_BACKGROUND, resolveTheme, withTransparentBackground } from "../themes";
import { TRANSPARENT_BACKGROUND, resolveTheme } from "../themes";

function createDiffFile(): DiffFile {
const metadata = parseDiffFromFile(
Expand Down Expand Up @@ -147,9 +147,17 @@ describe("Pierre diff rows", () => {
).toBe(true);
});

test("keeps word-diff highlight backgrounds transparent in transparent mode", async () => {
test("keeps word-diff highlight backgrounds transparent when a theme uses transparent tints", async () => {
const file = createDiffFile();
const theme = withTransparentBackground(resolveTheme("github-dark-default", null));
// Custom themes may declare "transparent" row/content tints; the renderer must not feed
// them into blend math and turn them into black backgrounds.
const theme = {
...resolveTheme("github-dark-default", null),
addedBg: TRANSPARENT_BACKGROUND,
removedBg: TRANSPARENT_BACKGROUND,
addedContentBg: TRANSPARENT_BACKGROUND,
removedContentBg: TRANSPARENT_BACKGROUND,
};
const highlighted = await loadHighlightedDiff(file);
const rows = buildSplitRows(file, highlighted, theme);
const changedRow = rows.find(
Expand Down
30 changes: 0 additions & 30 deletions src/ui/themes.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import {
DEFAULT_LIGHT_THEME_ID,
resolveTheme,
TRANSPARENT_BACKGROUND,
withTransparentBackground,
withTransparentSurfaces,
} from "./themes";

Expand Down Expand Up @@ -247,35 +246,6 @@ describe("themes", () => {
expect(custom.syntaxColors.keyword).toBe("#ff00ff");
});

test("withTransparentBackground only swaps painted background fields", () => {
const theme = resolveTheme("github-dark-default", null);
const transparent = withTransparentBackground(theme);

expect(transparent).toMatchObject({
background: TRANSPARENT_BACKGROUND,
panel: TRANSPARENT_BACKGROUND,
panelAlt: TRANSPARENT_BACKGROUND,
addedBg: TRANSPARENT_BACKGROUND,
removedBg: TRANSPARENT_BACKGROUND,
contextBg: TRANSPARENT_BACKGROUND,
addedContentBg: TRANSPARENT_BACKGROUND,
removedContentBg: TRANSPARENT_BACKGROUND,
contextContentBg: TRANSPARENT_BACKGROUND,
lineNumberBg: TRANSPARENT_BACKGROUND,
selectedHunk: TRANSPARENT_BACKGROUND,
noteBackground: TRANSPARENT_BACKGROUND,
noteTitleBackground: TRANSPARENT_BACKGROUND,
});
expect(transparent.id).toBe(theme.id);
expect(transparent.label).toBe(theme.label);
expect(transparent.text).toBe(theme.text);
expect(transparent.muted).toBe(theme.muted);
expect(transparent.addedSignColor).toBe(theme.addedSignColor);
expect(transparent.removedSignColor).toBe(theme.removedSignColor);
expect(transparent.syntaxColors).toBe(theme.syntaxColors);
expect(theme.background).not.toBe(TRANSPARENT_BACKGROUND);
});

test("withTransparentSurfaces keeps added/removed row tints", () => {
const theme = resolveTheme("github-dark-default", null);
const transparent = withTransparentSurfaces(theme);
Expand Down
24 changes: 2 additions & 22 deletions src/ui/themes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -352,30 +352,10 @@ export function bundledThemeDiffColors(themeId: string): BundledShikiThemeDiffCo
return getBundledShikiThemeDiffColors(themeId);
}

/** Return a copy of a theme whose painted surfaces allow the terminal background through. */
export function withTransparentBackground(theme: AppTheme): AppTheme {
return {
...theme,
background: TRANSPARENT_BACKGROUND,
panel: TRANSPARENT_BACKGROUND,
panelAlt: TRANSPARENT_BACKGROUND,
addedBg: TRANSPARENT_BACKGROUND,
removedBg: TRANSPARENT_BACKGROUND,
contextBg: TRANSPARENT_BACKGROUND,
addedContentBg: TRANSPARENT_BACKGROUND,
removedContentBg: TRANSPARENT_BACKGROUND,
contextContentBg: TRANSPARENT_BACKGROUND,
lineNumberBg: TRANSPARENT_BACKGROUND,
selectedHunk: TRANSPARENT_BACKGROUND,
noteBackground: TRANSPARENT_BACKGROUND,
noteTitleBackground: TRANSPARENT_BACKGROUND,
};
}

/**
* Return a copy of a theme whose neutral surfaces allow the terminal background through while
* added/removed row tints stay painted. Static pager hosts use this so diff rows keep their
* semantic backgrounds on translucent terminals.
* added/removed row tints stay painted. Both the interactive TUI and static pager hosts use
* this so diff rows keep their semantic backgrounds on translucent terminals.
*/
export function withTransparentSurfaces(theme: AppTheme): AppTheme {
return {
Expand Down