Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Spaces Added to Escaped Characters #385

Open
guitargeek534 opened this issue Apr 8, 2021 · 0 comments
Open

Spaces Added to Escaped Characters #385

guitargeek534 opened this issue Apr 8, 2021 · 0 comments

Comments

@guitargeek534
Copy link

  • Operating System (+Version): Windows 10.0.19042
  • VS Code Version: 1.55.0
  • beautify Version: 1.5.0

NOTE: Please provide code snippets instead of screen shots. Your issue needs to be replicated, and we need the failing code (text) to do this.

Provide the settings you use:
(VS Code workspace and user settings, .jsbeautifyrc, .editorconfig)
VS Code Workspace Settings:

{
}

VS Code User Settings:

{
    "workbench.colorTheme": "Material Theme High Contrast",
    "liveSassCompile.settings.formats,": [
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": "~\\..\\css"
        }
    ],
    "liveSassCompile.settings.generateMap": false,
    // "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.defaultFormatter": "HookyQR.beautify",
    "[html]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "window.zoomLevel": 0,
    "bookmarks.wrapNavigation": false,
    "html.format.wrapLineLength": 0,
    "html.format.wrapAttributes": "preserve-aligned",
    "terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\cmd.exe",
    "prettier.printWidth": 0,
    "prettier.stylelintIntegration": true,
    "[markdown]": {

        "editor.wordWrap": "off",
        "editor.quickSuggestions": false
    },
    "editor.wordWrapColumn": 2000,
    "html.format.indentInnerHtml": true,
    "editor.formatOnPaste": true,
    "editor.formatOnType": true,
    "editor.tabSize": 2,
    "diffEditor.renderSideBySide": true,
    "diffEditor.wordWrap": "off",
    // "beautify.language": {
    //     "html": ["html", "php", "erb"],
    //     "css": [],
    //     "js": []
    // }

}

Action performed

Format html file with HookyQR.beautifyFile command. Software I code in requires && , < , and > characters to be escaped &amp;&amp; , &lt; and &gt;. When I format my code, spaces are added to the escaped characters.
example code

<script>
$(document).ready(function () {

/* darkmode */
var darkSwitch = document.getElementById("darkSwitch");
var jswitch = $("#darkSwitch");
console.log(jswitch);
console.log(darkSwitch);
if (darkSwitch) {
function initTheme() {
var darkThemeSelected = localStorage.getItem("darkSwitch") !== null &amp;&amp;
localStorage.getItem("darkSwitch") === "dark";
darkSwitch.checked = darkThemeSelected;
darkThemeSelected ? (
document.body.setAttribute("data-theme", "dark"),
$('table.table').addClass('table-dark'),
$('nav.navbar').removeClass('navbar-light'),
$('nav.navbar').addClass('navbar-dark')
) : (
document.body.removeAttribute("data-theme"),
$('table.table').removeClass('table-dark'),
$('nav.navbar').removeClass('navbar-dark'),
$('nav.navbar').addClass('navbar-light')
);
}

function resetTheme() {
if (darkSwitch.checked) {
$('table.table').addClass('table-dark');
$('nav.navbar').toggleClass('navbar-light navbar-dark');
document.body.setAttribute("data-theme", "dark");
localStorage.setItem("darkSwitch", "dark");
} else {
$('table.table').removeClass('table-dark');
$('nav.navbar').toggleClass('navbar-light navbar-dark');
document.body.removeAttribute("data-theme");
localStorage.removeItem("darkSwitch");
}
}

initTheme();

darkSwitch.addEventListener("click", function (event) {
resetTheme();
});
}
});
/* end darkmode */
</script>

Expected results

Expected to format code normally

<script>
      $(document).ready(function () {

        /* darkmode */
        var darkSwitch = document.getElementById("darkSwitch");
        var jswitch = $("#darkSwitch");
        console.log(jswitch);
        console.log(darkSwitch);
        if (darkSwitch) {
          function initTheme() {
            var darkThemeSelected = localStorage.getItem("darkSwitch") !== null &amp;&amp;
            localStorage.getItem("darkSwitch") === "dark";
            darkSwitch.checked = darkThemeSelected;
            darkThemeSelected ? (
              document.body.setAttribute("data-theme", "dark"),
              $('table.table').addClass('table-dark'),
              $('nav.navbar').removeClass('navbar-light'),
              $('nav.navbar').addClass('navbar-dark')
            ) : (
              document.body.removeAttribute("data-theme"),
              $('table.table').removeClass('table-dark'),
              $('nav.navbar').removeClass('navbar-dark'),
              $('nav.navbar').addClass('navbar-light')
            );
          }

          function resetTheme() {
            if (darkSwitch.checked) {
              $('table.table').addClass('table-dark');
              $('nav.navbar').toggleClass('navbar-light navbar-dark');
              document.body.setAttribute("data-theme", "dark");
              localStorage.setItem("darkSwitch", "dark");
            } else {
              $('table.table').removeClass('table-dark');
              $('nav.navbar').toggleClass('navbar-light navbar-dark');
              document.body.removeAttribute("data-theme");
              localStorage.removeItem("darkSwitch");
            }
          }

          initTheme();

          darkSwitch.addEventListener("click", function (event) {
            resetTheme();
          });
        }
      });
      /* end darkmode */
</script>

Actual results

Beautify does a wonderful job of formatting the code but adds spaces to the escaped characters which causes an error in the software I work with. Is there a way to create an exception for these characters in the settings? Every time I format my code I always have to do a find and replace for the escaped characters which takes a lot of time.

<script>
      $(document).ready(function () {

        /* darkmode */
        var darkSwitch = document.getElementById("darkSwitch");
        var jswitch = $("#darkSwitch");
        console.log(jswitch);
        console.log(darkSwitch);
        if (darkSwitch) {
          function initTheme() {
            var darkThemeSelected = localStorage.getItem("darkSwitch") !== null & amp; & amp;
            localStorage.getItem("darkSwitch") === "dark";
            darkSwitch.checked = darkThemeSelected;
            darkThemeSelected ? (
              document.body.setAttribute("data-theme", "dark"),
              $('table.table').addClass('table-dark'),
              $('nav.navbar').removeClass('navbar-light'),
              $('nav.navbar').addClass('navbar-dark')
            ) : (
              document.body.removeAttribute("data-theme"),
              $('table.table').removeClass('table-dark'),
              $('nav.navbar').removeClass('navbar-dark'),
              $('nav.navbar').addClass('navbar-light')
            );
          }

          function resetTheme() {
            if (darkSwitch.checked) {
              $('table.table').addClass('table-dark');
              $('nav.navbar').toggleClass('navbar-light navbar-dark');
              document.body.setAttribute("data-theme", "dark");
              localStorage.setItem("darkSwitch", "dark");
            } else {
              $('table.table').removeClass('table-dark');
              $('nav.navbar').toggleClass('navbar-light navbar-dark');
              document.body.removeAttribute("data-theme");
              localStorage.removeItem("darkSwitch");
            }
          }

          initTheme();

          darkSwitch.addEventListener("click", function (event) {
            resetTheme();
          });
        }
      });
      /* end darkmode */
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant