Merge remote-tracking branch 'origin/stable'

src/public/app/services/note_content_renderer.js

@@ -61,9 +61,11 @@ async function getRenderedContent(note, options = {}) {
         $renderedContent.append($("<pre>").text(trim(fullNote.content, options.trim)));
     }
     else if (type === 'image') {
+        const sanitizedTitle = note.title.replace(/[^a-z0-9-.]/gi, "");
+
         $renderedContent.append(
             $("<img>")
-                .attr("src", `api/images/${note.noteId}/${note.title}`)
+                .attr("src", `api/images/${note.noteId}/${sanitizedTitle}`)
                 .css("max-width", "100%")
         );
     }

src/public/app/services/note_list_renderer.js

@@ -266,7 +266,7 @@ class NoteListRenderer {
                     .append($expander)
                     .append($('<span class="note-icon">').addClass(note.getIcon()))
                     .append(this.viewType === 'grid'
-                        ? note.title
+                        ? $("<span>").text(note.title)
                         : await linkService.createNoteLink(notePath, {showTooltip: false, showNotePath: this.showNotePath})
                     )
                     .append($renderedAttributes)

src/public/app/services/tab_manager.js

@@ -503,7 +503,7 @@ export default class TabManager extends Component {
 
     updateDocumentTitle(activeNoteContext) {
         const titleFragments = [
-            // it helps navigating in history if note title is included in the title
+            // it helps to navigate in history if note title is included in the title
             activeNoteContext.note?.title,
             "Trilium Notes"
         ].filter(Boolean);

src/public/app/services/toast.js

@@ -4,16 +4,17 @@ import utils from "./utils.js";
 function toast(options) {
     const $toast = $(`<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
     <div class="toast-header">
-        <strong class="mr-auto"><span class="bx bx-${options.icon}"></span> ${options.title}</strong>
+        <strong class="mr-auto"><span class="bx bx-${options.icon}"></span> <span class="toast-title"></span></strong>
         <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
             <span aria-hidden="true">&times;</span>
         </button>
     </div>
-    <div class="toast-body">
+    <div class="toast-body"></div>
-        ${options.message}
-    </div>
 </div>`);
 
+    $toast.find('.toast-title').text(options.title);
+    $toast.find('.toast-body').text(options.message);
+
     if (options.id) {
         $toast.attr("id", "toast-" + options.id);
     }

src/public/app/widgets/dialogs/options/appearance.js

@@ -297,7 +297,7 @@ export default class ApperanceOptions {
             this.$themeSelect.append($("<option>")
                 .attr("value", theme.val)
                 .attr("data-note-id", theme.noteId)
-                .html(theme.title));
+                .text(theme.title));
         }
 
         this.$themeSelect.val(options.theme);

src/public/app/widgets/ribbon_widgets/edited_notes.js

@@ -77,7 +77,9 @@ export default class EditedNotesWidget extends CollapsibleWidget {
                 );
             }
             else {
-                $item.append(editedNote.notePath ? await linkService.createNoteLink(editedNote.notePath.join("/"), {showNotePath: true}) : editedNote.title);
+                $item.append(editedNote.notePath
+                    ? await linkService.createNoteLink(editedNote.notePath.join("/"), {showNotePath: true})
+                    : $("<span>").text(editedNote.title));
             }
 
             if (i < editedNotes.length - 1) {

src/public/app/widgets/type_widgets/editable_text.js

@@ -311,7 +311,8 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
         const note = await froca.getNote(noteId);
 
         this.textEditor.model.change( writer => {
-            const src = `api/images/${note.noteId}/${note.title}`;
+            const sanitizedTitle = note.title.replace(/[^a-z0-9-.]/gi, "");
+            const src = `api/images/${note.noteId}/${sanitizedTitle}`;
 
             const imageElement = writer.createElement( 'image',  { 'src': src } );
 

src/public/app/widgets/type_widgets/empty.js

@@ -79,7 +79,7 @@ export default class EmptyTypeWidget extends TypeWidget {
             this.$workspaceNotes.append(
                 $('<div class="workspace-note">')
                     .append($("<div>").addClass(workspaceNote.getIcon() + " workspace-icon"))
-                    .append($("<div>").append(workspaceNote.title))
+                    .append($("<div>").text(workspaceNote.title))
                     .attr("title", "Enter workspace " + workspaceNote.title)
                     .on('click', () => this.triggerCommand('hoistNote', {noteId: workspaceNote.noteId}))
             );

src/routes/api/clipper.js

@@ -43,7 +43,7 @@ function getClipperInboxNote() {
 }
 
 function addClipping(req) {
-    const {title, content, pageUrl, images} = req.body;
+    let {title, content, pageUrl, images} = req.body;
 
     const clipperInbox = getClipperInboxNote();
 
@@ -57,6 +57,8 @@ function addClipping(req) {
             type: 'text'
         }).note;
 
+        pageUrl = htmlSanitizer.sanitize(pageUrl);
+
         clippingNote.setLabel('clipType', 'clippings');
         clippingNote.setLabel('pageUrl', pageUrl);
         clippingNote.setLabel('iconClass', 'bx bx-globe');
@@ -89,9 +91,13 @@ function createNote(req) {
         type: 'text'
     });
 
+    clipType = htmlSanitizer.sanitize(clipType);
+
     note.setLabel('clipType', clipType);
 
     if (pageUrl) {
+        pageUrl = htmlSanitizer.sanitize(pageUrl);
+
         note.setLabel('pageUrl', pageUrl);
         note.setLabel('iconClass', 'bx bx-globe');
     }

src/services/html_sanitizer.js

@@ -2,6 +2,8 @@ const sanitizeHtml = require('sanitize-html');
 
 // intended mainly as protection against XSS via import
 // secondarily it (partly) protects against "CSS takeover"
+// sanitize also note titles, label values etc. - there's so many usage which make it difficult to guarantee all of them
+// are properly handled
 function sanitize(dirtyHtml) {
     if (!dirtyHtml) {
         return dirtyHtml;

src/services/image.js

@@ -12,6 +12,7 @@ const sanitizeFilename = require('sanitize-filename');
 const noteRevisionService = require('./note_revisions');
 const isSvg = require('is-svg');
 const isAnimated = require('is-animated');
+const htmlSanitizer = require("./html_sanitizer");
 
 async function processImage(uploadBuffer, originalName, shrinkImageSwitch) {
     const compressImages = optionService.getOptionBool("compressImages");
@@ -66,6 +67,8 @@ function getImageMimeFromExtension(ext) {
 function updateImage(noteId, uploadBuffer, originalName) {
     log.info(`Updating image ${noteId}: ${originalName}`);
 
+    originalName = htmlSanitizer.sanitize(originalName);
+
     const note = becca.getNote(noteId);
 
     note.saveNoteRevision();

src/services/import/zip.js

@@ -160,6 +160,11 @@ async function importZip(taskContext, fileBuffer, importRootNote) {
                 attr.name = 'disabled:' + attr.name;
             }
 
+            if (taskContext.data.safeImport) {
+                attr.name = htmlSanitizer.sanitize(attr.name);
+                attr.value = htmlSanitizer.sanitize(attr.value);
+            }
+
             attributes.push(attr);
         }
     }

src/services/notes.js

@@ -18,6 +18,7 @@ const Branch = require('../becca/entities/branch');
 const Note = require('../becca/entities/note');
 const Attribute = require('../becca/entities/attribute');
 const dayjs = require("dayjs");
+const htmlSanitizer = require("./html_sanitizer.js");
 
 function getNewNotePosition(parentNoteId) {
     const note = becca.notes[parentNoteId];
@@ -98,6 +99,11 @@ function getNewNoteTitle(parentNote) {
         }
     }
 
+    // this isn't in theory a good place to sanitize title, but this will catch a lot of XSS attempts
+    // title is supposed to contain text only (not HTML) and be printed text only, but given the number of usages
+    // it's difficult to guarantee correct handling in all cases
+    title = htmlSanitizer.sanitize(title);
+
     return title;
 }
 
@@ -352,8 +358,10 @@ function downloadImages(noteId, content) {
             const imageService = require('../services/image');
             const {note} = imageService.saveImage(noteId, imageBuffer, "inline image", true, true);
 
+            const sanitizedTitle = note.title.replace(/[^a-z0-9-.]/gi, "");
+
             content = content.substr(0, imageMatch.index)
-                + `<img src="api/images/${note.noteId}/${note.title}"`
+                + `<img src="api/images/${note.noteId}/${sanitizedTitle}"`
                 + content.substr(imageMatch.index + imageMatch[0].length);
         }
         else if (!url.includes('api/images/')