Fix operation description rendering

src/web/HTMLOperation.mjs

@@ -56,9 +56,10 @@ class HTMLOperation {
 
         if (this.description) {
             const infoLink = this.infoURL ? `<hr>${titleFromWikiLink(this.infoURL)}` : "";
+            const content = Utils.escapeHtml(this.description + infoLink);
 
             html += ` data-container='body' data-toggle='popover' data-placement='right'
-                data-content="${this.description}${infoLink}" data-html='true' data-trigger='hover'
+                data-content="${content}" data-html='true' data-trigger='hover'
                 data-boundary='viewport' role='button'`;
         }
 

tests/browser/00_nightwatch.js

@@ -56,6 +56,23 @@ module.exports = {
         browser.expect.element("//li[contains(@class, 'operation') and text()='Play Media']").to.be.present;
         browser.expect.element("//li[contains(@class, 'operation') and text()='Disassemble x86']").to.be.present;
         browser.expect.element("//li[contains(@class, 'operation') and text()='Register']").to.be.present;
+        browser.expect.element("//li[contains(@class, 'operation') and text()='Escape Smart Characters']").to.be.present;
+    },
+
+    "Operation popover descriptions render HTML safely": browser => {
+        const op = "//li[contains(@class, 'operation') and text()='Escape Smart Characters']";
+
+        browser
+            .useXpath()
+            .moveToElement(op, 10, 10)
+            .useCss()
+            .waitForElementVisible(".popover-body code:last-of-type", 1000)
+            .expect.element(".popover-body code:last-of-type").text.to.contain("\"Hello\" -- world...");
+
+        browser
+            .useCss()
+            .moveToElement("#operations .title", 1, 1)
+            .waitForElementNotPresent(".popover-body", 1000);
     },
 
     "Recipe can be run": browser => {