rtfpessoa / diff2html

Pretty diff to html javascript library (diff2html)
https://diff2html.xyz
MIT License
2.79k stars 272 forks source link

when execute git diff --word-diff-regex=. ,diff2html is not work #522

Closed panda0120 closed 7 months ago

panda0120 commented 7 months ago

Step 0: Describe your environment

Step 1: Describe the problem:

my git commans is like this: git diff --word-diff-regex=. --unified=10000 --no-index a.txt b.txt

then,when i use the output data in the diff2html,it did't work at all

Steps to reproduce:

diff example:

diff --git a/c b/c1
index 7780fe8..4bf0235 100644
--- a/c
+++ b/c1
@@ -1 +1 @@
aaaaa {+1.+}ssss

Observed Results:

image

Expected Results:

Relevant Code:

<!doctype html>
<html lang="en-us">
  <head>
    <meta charset="utf-8" />
    <!-- Make sure to load the highlight.js CSS file before the Diff2Html CSS file -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.1/styles/github.min.css" />
    <link
      rel="stylesheet"
      type="text/css"
      href="https://cdn.jsdelivr.net/npm/diff2html/bundles/css/diff2html.min.css"
    />
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/diff2html/bundles/js/diff2html-ui.min.js"></script>
  </head>
  <script>
    const diffString = `
diff --git a/c b/c1
index 7780fe8..4bf0235 100644
--- a/c
+++ b/c1
@@ -1 +1 @@
aaaaa {+1.+}ssss
`;

    document.addEventListener('DOMContentLoaded', function () {
      var targetElement = document.getElementById('myDiffElement');
      var configuration = {
        drawFileList: true,
        fileListToggle: false,
        fileListStartVisible: false,
        fileContentToggle: false,
        matching: 'words',
        outputFormat: 'side-by-side',
        synchronisedScroll: true,
        highlight: true,
        renderNothingWhenEmpty: false,
        maxLineSizeInBlockForComparison: 1000
      };
      var diff2htmlUi = new Diff2HtmlUI(targetElement, diffString, configuration);
      diff2htmlUi.draw();
      diff2htmlUi.highlightCode();
    });
  </script>
  <body>
    <div id="myDiffElement"></div>
  </body>
</html>
panda0120 commented 7 months ago

diffStyle: 'char' ,this config can do it.