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

dev: Add email preview tool #10381

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

dev: Add email preview tool #10381

wants to merge 1 commit into from

Conversation

Betree
Copy link
Member

@Betree Betree commented Oct 15, 2024

A minimalist tool to work on email templates styles and content. Start it with:

npm run mail:preview

List emails

Screenshot from 2024-10-15 09-31-58

Preview template

Screenshot from 2024-10-15 09-31-54

@Betree Betree self-assigned this Oct 15, 2024
scripts/dev/dev-email-preview.ts Fixed Show fixed Hide fixed
scripts/dev/dev-email-preview.ts Fixed Show fixed Hide fixed
scripts/dev/dev-email-preview.ts Dismissed Show dismissed Hide dismissed
scripts/dev/dev-email-preview.ts Dismissed Show dismissed Hide dismissed
@Betree Betree force-pushed the dev/email-preview branch 2 times, most recently from 65687f3 to 2034a3a Compare December 6, 2024 10:09
@Betree Betree marked this pull request as ready for review December 6, 2024 10:21
@Betree Betree force-pushed the dev/email-preview branch from 2034a3a to 70c385c Compare December 6, 2024 10:36

const renderResult = renderEmail(templateName);
const attributes = getTemplateAttributes(renderResult.html);
res.send(attributes.body);

Check warning

Code scanning / CodeQL

Exception text reinterpreted as HTML Medium

Exception text
is reinterpreted as HTML without escaping meta-characters.

Copilot Autofix AI 10 days ago

To fix the problem, we need to ensure that any user-controlled data is properly sanitized or escaped before being included in the HTML response. This can be achieved by using a library like he (HTML entities) to escape the content before sending it in the response.

  1. Install the he library to handle HTML escaping.
  2. Use the he library to escape attributes.body and error.message before including them in the HTML response.
Suggested changeset 2
scripts/dev/dev-email-preview.ts

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/scripts/dev/dev-email-preview.ts b/scripts/dev/dev-email-preview.ts
--- a/scripts/dev/dev-email-preview.ts
+++ b/scripts/dev/dev-email-preview.ts
@@ -10,2 +10,3 @@
 import { stripHTML } from '../../server/lib/sanitize-html';
+import he from 'he';
 import MOCKS from '../../test/mocks/data';
@@ -184,3 +185,3 @@
     const attributes = getTemplateAttributes(renderResult.html);
-    res.send(attributes.body);
+    res.send(he.escape(attributes.body));
   } catch (error) {
@@ -195,4 +196,4 @@
           <h1>Error while rendering template</h1>
-          <p>${error.message}. Details:</p>
-          <pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${error.stack}</pre>
+          <p>${he.escape(error.message)}. Details:</p>
+          <pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${he.escape(error.stack)}</pre>
         </body>
EOF
@@ -10,2 +10,3 @@
import { stripHTML } from '../../server/lib/sanitize-html';
import he from 'he';
import MOCKS from '../../test/mocks/data';
@@ -184,3 +185,3 @@
const attributes = getTemplateAttributes(renderResult.html);
res.send(attributes.body);
res.send(he.escape(attributes.body));
} catch (error) {
@@ -195,4 +196,4 @@
<h1>Error while rendering template</h1>
<p>${error.message}. Details:</p>
<pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${error.stack}</pre>
<p>${he.escape(error.message)}. Details:</p>
<pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${he.escape(error.stack)}</pre>
</body>
package.json
Outside changed files

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/package.json b/package.json
--- a/package.json
+++ b/package.json
@@ -136,3 +136,4 @@
     "winston": "3.17.0",
-    "zod": "3.23.8"
+    "zod": "3.23.8",
+    "he": "^1.2.0"
   },
EOF
@@ -136,3 +136,4 @@
"winston": "3.17.0",
"zod": "3.23.8"
"zod": "3.23.8",
"he": "^1.2.0"
},
This fix introduces these dependencies
Package Version Security advisories
he (npm) 1.2.0 None
Copilot is powered by AI and may make mistakes. Always verify output.
Positive Feedback
Negative Feedback

Provide additional feedback

Please help us improve GitHub Copilot by sharing more details about this comment.

Please select one or more of the options
try {
const renderResult = renderEmail(templateName);
const attributes = getTemplateAttributes(renderResult.html);
res.send(attributes.subject);

Check warning

Code scanning / CodeQL

Exception text reinterpreted as HTML Medium

Exception text
is reinterpreted as HTML without escaping meta-characters.

Copilot Autofix AI 10 days ago

To fix the problem, we need to ensure that any user input included in the response is properly sanitized to prevent XSS attacks. This can be achieved by using a library like escape-html to escape any potentially dangerous characters in the error message before sending it to the client.

Suggested changeset 2
scripts/dev/dev-email-preview.ts

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/scripts/dev/dev-email-preview.ts b/scripts/dev/dev-email-preview.ts
--- a/scripts/dev/dev-email-preview.ts
+++ b/scripts/dev/dev-email-preview.ts
@@ -186,2 +186,3 @@
   } catch (error) {
+    const escapeHtml = require('escape-html');
     res.status(400).send(`
@@ -195,4 +196,4 @@
           <h1>Error while rendering template</h1>
-          <p>${error.message}. Details:</p>
-          <pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${error.stack}</pre>
+          <p>${escapeHtml(error.message)}. Details:</p>
+          <pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${escapeHtml(error.stack)}</pre>
         </body>
EOF
@@ -186,2 +186,3 @@
} catch (error) {
const escapeHtml = require('escape-html');
res.status(400).send(`
@@ -195,4 +196,4 @@
<h1>Error while rendering template</h1>
<p>${error.message}. Details:</p>
<pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${error.stack}</pre>
<p>${escapeHtml(error.message)}. Details:</p>
<pre style="background-color: #f8f9fa; padding: 10px; overflow: auto; max-width: 100%;">${escapeHtml(error.stack)}</pre>
</body>
package.json
Outside changed files

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/package.json b/package.json
--- a/package.json
+++ b/package.json
@@ -136,3 +136,4 @@
     "winston": "3.17.0",
-    "zod": "3.23.8"
+    "zod": "3.23.8",
+    "escape-html": "^1.0.3"
   },
EOF
@@ -136,3 +136,4 @@
"winston": "3.17.0",
"zod": "3.23.8"
"zod": "3.23.8",
"escape-html": "^1.0.3"
},
This fix introduces these dependencies
Package Version Security advisories
escape-html (npm) 1.0.3 None
Copilot is powered by AI and may make mistakes. Always verify output.
Positive Feedback
Negative Feedback

Provide additional feedback

Please help us improve GitHub Copilot by sharing more details about this comment.

Please select one or more of the options
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

Successfully merging this pull request may close these issues.

1 participant