Use js-beautify for formatting HTML #1089
1 Participants
Due Date
No due date set.
Dependencies
No dependencies set.
Reference: privacyguides/privacytools.io#1089
Reference in New Issue
Block a user
Delete Branch "add-beautify"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Description
Related: https://github.com/privacytoolsIO/privacytools.io/pull/900
This PR introduces "js-beautify" for auto-formatting the HTML code on code commits and git pushes based on specified rules in
.jsbeautifyrc(here's a larger example). The rule I added for now includes using tabs over spaces. Overall, this tooling will increase style consistency and maintainability for contributors 😄Example of trying to commit unformatted code:
Example of committing unformatted code and Travis failing the build:
Alternatively, @dawidpotocki mentioned Prettier which could also do this job. I also have a working, local branch for that but felt Beautify to be more tailored and simpler for our needs at the moment. I also ran into some weird HTML formatting issues (such as https://github.com/prettier/prettier-vscode/issues/646) when using Prettier.
Deploy preview for privacytools-io ready!
Built with commit
c9f9cf255bhttps://deploy-preview-1089--privacytools-io.netlify.com
Deploy preview for privacytools-io ready!
Built with commit
c7937a241ahttps://deploy-preview-1089--privacytools-io.netlify.com
Okay
Still okay
@@ -2,3 +2,3 @@<div class="alert alert-success" role="alert"><strong>All providers listed here are operating outside the US and support <a data-toggle="tooltip" data-placement="bottom" data-original-title="When sending or receiving emails, if both the sending and receiving servers support TLS encryption, the email is sent between servers using an encrypted connection.">SMTP TLS.</a> The table is sortable.</strong><strong>All providers listed here are operating outside the US and support <a data-toggle="tooltip" data-placement="bottom" data-original-title="When sending or receiving emails, if both the sending and receiving servers support TLS encryption, the email is sent between servers using an encrypted connection.">SMTP TLS.</a> The table is sortable.</strong>This doesn't seem right
@@ -2,3 +2,3 @@<div class="alert alert-success" role="alert"><strong>All providers listed here are operating outside the US and support <a data-toggle="tooltip" data-placement="bottom" data-original-title="When sending or receiving emails, if both the sending and receiving servers support TLS encryption, the email is sent between servers using an encrypted connection.">SMTP TLS.</a> The table is sortable.</strong><strong>All providers listed here are operating outside the US and support <a data-toggle="tooltip" data-placement="bottom" data-original-title="When sending or receiving emails, if both the sending and receiving servers support TLS encryption, the email is sent between servers using an encrypted connection.">SMTP TLS.</a> The table is sortable.</strong>Good catch! Fixed.
What... hmm
Okay, fixed.
This looks scarily big to me, but there are conflicting files so I won't read deeper right now.
Yeah, I'm unsure what direction we want to take with this at the moment. It should be fairly straightforward to get auto-formatting tooling integrated, but for the proposed solutions (Prettier and JS-Beautify) both will introduce NodeJS to the project which will add some complexity and increase maintainability a bit (making sure packages are up-to-date)...
Going to close this until the right formatter tool is decided 👍