Skip to content

Commit 9f8d6bd

Browse files
JHWelchJHWelch
committed
Pass config to file list renderer
1 parent 669ee2b commit 9f8d6bd

2 files changed

Lines changed: 165 additions & 2 deletions

File tree

‎src/__tests__/diff2html-tests.ts‎

Lines changed: 161 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1260,7 +1260,7 @@ describe('Diff2Html', () => {
12601260
});
12611261

12621262
describe('with auto colorScheme', () => {
1263-
it('should return a html diff with dark mode', () => {
1263+
it('should return a html diff with auto color scheme', () => {
12641264
const result = html(diffExample1, {
12651265
drawFileList: false,
12661266
colorScheme: ColorSchemeType.AUTO,
@@ -1319,6 +1319,86 @@ describe('Diff2Html', () => {
13191319
</div>"
13201320
`);
13211321
});
1322+
1323+
it('should include auto mode on file list', () => {
1324+
const result = html(diffExample1, {
1325+
drawFileList: true,
1326+
colorScheme: ColorSchemeType.AUTO,
1327+
});
1328+
expect(result).toMatchInlineSnapshot(`
1329+
"<div class="d2h-file-list-wrapper d2h-auto-color-scheme">
1330+
<div class="d2h-file-list-header">
1331+
<span class="d2h-file-list-title">Files changed (1)</span>
1332+
<a class="d2h-file-switch d2h-hide">hide</a>
1333+
<a class="d2h-file-switch d2h-show">show</a>
1334+
</div>
1335+
<ol class="d2h-file-list">
1336+
<li class="d2h-file-list-line">
1337+
<span class="d2h-file-name-wrapper">
1338+
<svg aria-hidden="true" class="d2h-icon d2h-changed" height="16" title="modified" version="1.1"
1339+
viewBox="0 0 14 16" width="14">
1340+
<path d="M13 1H1C0.45 1 0 1.45 0 2v12c0 0.55 0.45 1 1 1h12c0.55 0 1-0.45 1-1V2c0-0.55-0.45-1-1-1z m0 13H1V2h12v12zM4 8c0-1.66 1.34-3 3-3s3 1.34 3 3-1.34 3-3 3-3-1.34-3-3z"></path>
1341+
</svg> <a href="#d2h-675094" class="d2h-file-name">sample</a>
1342+
<span class="d2h-file-stats">
1343+
<span class="d2h-lines-added">+1</span>
1344+
<span class="d2h-lines-deleted">-1</span>
1345+
</span>
1346+
</span>
1347+
</li>
1348+
</ol>
1349+
</div><div class="d2h-wrapper d2h-auto-color-scheme">
1350+
<div id="d2h-675094" class="d2h-file-wrapper" data-lang="">
1351+
<div class="d2h-file-header">
1352+
<span class="d2h-file-name-wrapper">
1353+
<svg aria-hidden="true" class="d2h-icon" height="16" version="1.1" viewBox="0 0 12 16" width="12">
1354+
<path d="M6 5H2v-1h4v1zM2 8h7v-1H2v1z m0 2h7v-1H2v1z m0 2h7v-1H2v1z m10-7.5v9.5c0 0.55-0.45 1-1 1H1c-0.55 0-1-0.45-1-1V2c0-0.55 0.45-1 1-1h7.5l3.5 3.5z m-1 0.5L8 2H1v12h10V5z"></path>
1355+
</svg> <span class="d2h-file-name">sample</span>
1356+
<span class="d2h-tag d2h-changed d2h-changed-tag">CHANGED</span></span>
1357+
<label class="d2h-file-collapse">
1358+
<input class="d2h-file-collapse-input" type="checkbox" name="viewed" value="viewed">
1359+
Viewed
1360+
</label>
1361+
</div>
1362+
<div class="d2h-file-diff">
1363+
<div class="d2h-code-wrapper">
1364+
<table class="d2h-diff-table">
1365+
<tbody class="d2h-diff-tbody">
1366+
<tr>
1367+
<td class="d2h-code-linenumber d2h-info"></td>
1368+
<td class="d2h-info">
1369+
<div class="d2h-code-line">@@ -1 +1 @@</div>
1370+
</td>
1371+
</tr><tr>
1372+
<td class="d2h-code-linenumber d2h-del d2h-change">
1373+
<div class="line-num1">1</div>
1374+
<div class="line-num2"></div>
1375+
</td>
1376+
<td class="d2h-del d2h-change">
1377+
<div class="d2h-code-line">
1378+
<span class="d2h-code-line-prefix">-</span>
1379+
<span class="d2h-code-line-ctn"><del>test</del></span>
1380+
</div>
1381+
</td>
1382+
</tr><tr>
1383+
<td class="d2h-code-linenumber d2h-ins d2h-change">
1384+
<div class="line-num1"></div>
1385+
<div class="line-num2">1</div>
1386+
</td>
1387+
<td class="d2h-ins d2h-change">
1388+
<div class="d2h-code-line">
1389+
<span class="d2h-code-line-prefix">+</span>
1390+
<span class="d2h-code-line-ctn"><ins>test1</ins></span>
1391+
</div>
1392+
</td>
1393+
</tr>
1394+
</tbody>
1395+
</table>
1396+
</div>
1397+
</div>
1398+
</div>
1399+
</div>"
1400+
`);
1401+
});
13221402
});
13231403

13241404
describe('with dark colorScheme', () => {
@@ -1381,6 +1461,86 @@ describe('Diff2Html', () => {
13811461
</div>"
13821462
`);
13831463
});
1464+
1465+
it('should include dark mode on file list', () => {
1466+
const result = html(diffExample1, {
1467+
drawFileList: true,
1468+
colorScheme: ColorSchemeType.DARK,
1469+
});
1470+
expect(result).toMatchInlineSnapshot(`
1471+
"<div class="d2h-file-list-wrapper d2h-dark-color-scheme">
1472+
<div class="d2h-file-list-header">
1473+
<span class="d2h-file-list-title">Files changed (1)</span>
1474+
<a class="d2h-file-switch d2h-hide">hide</a>
1475+
<a class="d2h-file-switch d2h-show">show</a>
1476+
</div>
1477+
<ol class="d2h-file-list">
1478+
<li class="d2h-file-list-line">
1479+
<span class="d2h-file-name-wrapper">
1480+
<svg aria-hidden="true" class="d2h-icon d2h-changed" height="16" title="modified" version="1.1"
1481+
viewBox="0 0 14 16" width="14">
1482+
<path d="M13 1H1C0.45 1 0 1.45 0 2v12c0 0.55 0.45 1 1 1h12c0.55 0 1-0.45 1-1V2c0-0.55-0.45-1-1-1z m0 13H1V2h12v12zM4 8c0-1.66 1.34-3 3-3s3 1.34 3 3-1.34 3-3 3-3-1.34-3-3z"></path>
1483+
</svg> <a href="#d2h-675094" class="d2h-file-name">sample</a>
1484+
<span class="d2h-file-stats">
1485+
<span class="d2h-lines-added">+1</span>
1486+
<span class="d2h-lines-deleted">-1</span>
1487+
</span>
1488+
</span>
1489+
</li>
1490+
</ol>
1491+
</div><div class="d2h-wrapper d2h-dark-color-scheme">
1492+
<div id="d2h-675094" class="d2h-file-wrapper" data-lang="">
1493+
<div class="d2h-file-header">
1494+
<span class="d2h-file-name-wrapper">
1495+
<svg aria-hidden="true" class="d2h-icon" height="16" version="1.1" viewBox="0 0 12 16" width="12">
1496+
<path d="M6 5H2v-1h4v1zM2 8h7v-1H2v1z m0 2h7v-1H2v1z m0 2h7v-1H2v1z m10-7.5v9.5c0 0.55-0.45 1-1 1H1c-0.55 0-1-0.45-1-1V2c0-0.55 0.45-1 1-1h7.5l3.5 3.5z m-1 0.5L8 2H1v12h10V5z"></path>
1497+
</svg> <span class="d2h-file-name">sample</span>
1498+
<span class="d2h-tag d2h-changed d2h-changed-tag">CHANGED</span></span>
1499+
<label class="d2h-file-collapse">
1500+
<input class="d2h-file-collapse-input" type="checkbox" name="viewed" value="viewed">
1501+
Viewed
1502+
</label>
1503+
</div>
1504+
<div class="d2h-file-diff">
1505+
<div class="d2h-code-wrapper">
1506+
<table class="d2h-diff-table">
1507+
<tbody class="d2h-diff-tbody">
1508+
<tr>
1509+
<td class="d2h-code-linenumber d2h-info"></td>
1510+
<td class="d2h-info">
1511+
<div class="d2h-code-line">@@ -1 +1 @@</div>
1512+
</td>
1513+
</tr><tr>
1514+
<td class="d2h-code-linenumber d2h-del d2h-change">
1515+
<div class="line-num1">1</div>
1516+
<div class="line-num2"></div>
1517+
</td>
1518+
<td class="d2h-del d2h-change">
1519+
<div class="d2h-code-line">
1520+
<span class="d2h-code-line-prefix">-</span>
1521+
<span class="d2h-code-line-ctn"><del>test</del></span>
1522+
</div>
1523+
</td>
1524+
</tr><tr>
1525+
<td class="d2h-code-linenumber d2h-ins d2h-change">
1526+
<div class="line-num1"></div>
1527+
<div class="line-num2">1</div>
1528+
</td>
1529+
<td class="d2h-ins d2h-change">
1530+
<div class="d2h-code-line">
1531+
<span class="d2h-code-line-prefix">+</span>
1532+
<span class="d2h-code-line-ctn"><ins>test1</ins></span>
1533+
</div>
1534+
</td>
1535+
</tr>
1536+
</tbody>
1537+
</table>
1538+
</div>
1539+
</div>
1540+
</div>
1541+
</div>"
1542+
`);
1543+
});
13841544
});
13851545
});
13861546
});

‎src/diff2html.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,10 @@ export function html(diffInput: string | DiffFile[], configuration: Diff2HtmlCon
3232

3333
const hoganUtils = new HoganJsUtils(config);
3434

35-
const fileList = config.drawFileList ? new FileListRenderer(hoganUtils).render(diffJson) : '';
35+
const { colorScheme } = config;
36+
const fileListRendererConfig = { colorScheme };
37+
38+
const fileList = config.drawFileList ? new FileListRenderer(hoganUtils, fileListRendererConfig).render(diffJson) : '';
3639

3740
const diffOutput =
3841
config.outputFormat === 'side-by-side'

0 commit comments

Comments
 (0)