Skip to content

Commit

Permalink
Merge pull request #307 from rtfpessoa/fix-selection-empty-lines-side
Browse files Browse the repository at this point in the history
fix: Skip selection of structural lines in side diff
  • Loading branch information
rtfpessoa authored Feb 9, 2020
2 parents 90d3760 + 05c7741 commit 884b95b
Show file tree
Hide file tree
Showing 4 changed files with 132 additions and 128 deletions.
250 changes: 125 additions & 125 deletions src/__tests__/side-by-side-printer-tests.ts
Original file line number Diff line number Diff line change
Expand Up @@ -78,81 +78,81 @@ describe('SideBySideRenderer', () => {
const fileHtml = sideBySideRenderer.generateFileHtml(file);

expect(fileHtml).toMatchInlineSnapshot(`
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-info\\"></td>
<td class=\\"d2h-info\\">
<div class=\\"d2h-code-side-line d2h-info\\">@@ -19,7 +19,7 @@</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-cntx\\">
19
</td>
<td class=\\"d2h-cntx\\">
<div class=\\"d2h-code-side-line d2h-cntx\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">context</span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-del d2h-change\\">
20
</td>
<td class=\\"d2h-del d2h-change\\">
<div class=\\"d2h-code-side-line d2h-del d2h-change\\">
<span class=\\"d2h-code-line-prefix\\">-</span>
<span class=\\"d2h-code-line-ctn\\"><del>removed</del></span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">&nbsp;</span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-info\\"></td>
<td class=\\"d2h-info\\">
<div class=\\"d2h-code-side-line d2h-info\\"></div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-cntx\\">
19
</td>
<td class=\\"d2h-cntx\\">
<div class=\\"d2h-code-side-line d2h-cntx\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">context</span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-ins d2h-change\\">
20
</td>
<td class=\\"d2h-ins d2h-change\\">
<div class=\\"d2h-code-side-line d2h-ins d2h-change\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\"><ins>added</ins></span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-ins\\">
21
</td>
<td class=\\"d2h-ins\\">
<div class=\\"d2h-code-side-line d2h-ins\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\">another added</span>
</div>
</td>
</tr>",
}
`);
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-info\\"></td>
<td class=\\"d2h-info\\">
<div class=\\"d2h-code-side-line d2h-info\\">@@ -19,7 +19,7 @@</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-cntx\\">
19
</td>
<td class=\\"d2h-cntx\\">
<div class=\\"d2h-code-side-line d2h-cntx\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">context</span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-del d2h-change\\">
20
</td>
<td class=\\"d2h-del d2h-change\\">
<div class=\\"d2h-code-side-line d2h-del d2h-change\\">
<span class=\\"d2h-code-line-prefix\\">-</span>
<span class=\\"d2h-code-line-ctn\\"><del>removed</del></span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\"><br></span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-info\\"></td>
<td class=\\"d2h-info\\">
<div class=\\"d2h-code-side-line d2h-info\\"></div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-cntx\\">
19
</td>
<td class=\\"d2h-cntx\\">
<div class=\\"d2h-code-side-line d2h-cntx\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">context</span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-ins d2h-change\\">
20
</td>
<td class=\\"d2h-ins d2h-change\\">
<div class=\\"d2h-code-side-line d2h-ins d2h-change\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\"><ins>added</ins></span>
</div>
</td>
</tr><tr>
<td class=\\"d2h-code-side-linenumber d2h-ins\\">
21
</td>
<td class=\\"d2h-ins\\">
<div class=\\"d2h-code-side-line d2h-ins\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\">another added</span>
</div>
</td>
</tr>",
}
`);
});
});

Expand All @@ -168,31 +168,31 @@ describe('SideBySideRenderer', () => {
});

expect(fileHtml).toMatchInlineSnapshot(`
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">&nbsp;</span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-ins\\">
30
</td>
<td class=\\"d2h-ins\\">
<div class=\\"d2h-code-side-line d2h-ins\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\">test</span>
</div>
</td>
</tr>",
}
`);
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\"><br></span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-ins\\">
30
</td>
<td class=\\"d2h-ins\\">
<div class=\\"d2h-code-side-line d2h-ins\\">
<span class=\\"d2h-code-line-prefix\\">+</span>
<span class=\\"d2h-code-line-ctn\\">test</span>
</div>
</td>
</tr>",
}
`);
});
it('should work for deletions', () => {
const hoganUtils = new HoganJsUtils({});
Expand All @@ -208,31 +208,31 @@ describe('SideBySideRenderer', () => {
);

expect(fileHtml).toMatchInlineSnapshot(`
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-del\\">
30
</td>
<td class=\\"d2h-del\\">
<div class=\\"d2h-code-side-line d2h-del\\">
<span class=\\"d2h-code-line-prefix\\">-</span>
<span class=\\"d2h-code-line-ctn\\">test</span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\">&nbsp;</span>
</div>
</td>
</tr>",
}
`);
Object {
"left": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-del\\">
30
</td>
<td class=\\"d2h-del\\">
<div class=\\"d2h-code-side-line d2h-del\\">
<span class=\\"d2h-code-line-prefix\\">-</span>
<span class=\\"d2h-code-line-ctn\\">test</span>
</div>
</td>
</tr>",
"right": "<tr>
<td class=\\"d2h-code-side-linenumber d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
</td>
<td class=\\"d2h-cntx d2h-emptyplaceholder\\">
<div class=\\"d2h-code-side-line d2h-code-side-emptyplaceholder d2h-cntx d2h-emptyplaceholder\\">
<span class=\\"d2h-code-line-prefix\\">&nbsp;</span>
<span class=\\"d2h-code-line-ctn\\"><br></span>
</div>
</td>
</tr>",
}
`);
});
});

Expand Down
4 changes: 2 additions & 2 deletions src/side-by-side-renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -285,8 +285,8 @@ export default class SideBySideRenderer {
type: line?.type || `${renderUtils.CSSLineClass.CONTEXT} d2h-emptyplaceholder`,
lineClass: line !== undefined ? lineClass : `${lineClass} d2h-code-side-emptyplaceholder`,
contentClass: line !== undefined ? contentClass : `${contentClass} d2h-code-side-emptyplaceholder`,
prefix: line?.prefix === ' ' ? '&nbsp;' : line?.prefix || '&nbsp;',
content: line?.content || '&nbsp;',
prefix: line?.prefix === ' ' ? '&nbsp;' : line?.prefix,
content: line?.content,
lineNumber: line?.number,
});
}
Expand Down
3 changes: 3 additions & 0 deletions src/templates/generic-line.mustache
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,9 @@
{{#prefix}}
<span class="d2h-code-line-prefix">{{{prefix}}}</span>
{{/prefix}}
{{^prefix}}
<span class="d2h-code-line-prefix">&nbsp;</span>
{{/prefix}}
{{#content}}
<span class="d2h-code-line-ctn">{{{content}}}</span>
{{/content}}
Expand Down
3 changes: 2 additions & 1 deletion src/ui/css/diff2html.css
Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,8 @@

.d2h-code-linenumber,
.d2h-code-side-linenumber,
.d2h-code-line-prefix {
.d2h-code-line-prefix,
.d2h-emptyplaceholder {
user-select: none;
}

Expand Down

0 comments on commit 884b95b

Please sign in to comment.