SafeLabel

Author: odeimaiz

services/static-webserver/client/source/class/osparc/ui/basic/LinkLabel.js

@@ -29,13 +29,12 @@
  */
 
 qx.Class.define("osparc.ui.basic.LinkLabel", {
-  extend: qx.ui.basic.Label,
+  extend: osparc.ui.basic.SafeLabel,
 
   construct: function(label, url) {
     this.base(arguments, label);
 
     this.set({
-      rich: true,
       allowGrowX: true
     });
 

services/static-webserver/client/source/class/osparc/ui/basic/SafeLabel.js

@@ -0,0 +1,46 @@
+/* ************************************************************************
+
+   osparc - the simcore frontend
+
+   https://osparc.io
+
+   Copyright:
+     2025 IT'IS Foundation, https://itis.swiss
+
+   License:
+     MIT: https://opensource.org/licenses/MIT
+
+   Authors:
+     * Odei Maiz (odeimaiz)
+
+************************************************************************ */
+
+/**
+ * A Label that sanitizes its value when in rich mode to avoid XSS attacks
+ */
+
+qx.Class.define("osparc.ui.basic.SafeLabel", {
+  extend: qx.ui.basic.Label,
+
+  construct() {
+    this.base(arguments);
+
+    this.set({
+      rich: true,
+    });
+
+    this.addListener("changeValue", this._onChangeValue, this);
+  },
+
+  members: {
+    _onChangeValue(e) {
+      const val = e.getData();
+      if (this.getRich() && typeof val === "string") {
+        const sanitized = osparc.wrapper.DOMPurify.sanitize(val);
+        if (sanitized !== val) {
+          this.setValue(sanitized);
+        }
+      }
+    }
+  }
+});

services/static-webserver/client/source/class/osparc/ui/list/ListItem.js

@@ -154,21 +154,19 @@ qx.Class.define("osparc.ui.list.ListItem", {
           });
           break;
         case "title":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             font: "text-14",
             selectable: true,
-            rich: true,
           });
           this._add(control, {
             row: 0,
             column: 1
           });
           break;
         case "subtitle":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             font: "text-13",
             selectable: true,
-            rich: true,
           });
           this._add(control, {
             row: 1,

services/static-webserver/client/source/class/osparc/widget/PreparingInputs.js

@@ -28,7 +28,6 @@ qx.Class.define("osparc.widget.PreparingInputs", {
     const text = this.tr("To proceed, we need to prepare some inputs. You can check the progress logs here:");
     const title = new qx.ui.basic.Label(text).set({
       font: "text-14",
-      rich: true
     });
     this._add(title);