use safer HTML decode

OneSignal · Oct 26, 2023 · 0c5cf5c · 0c5cf5c
1 parent 93d15cb
commit 0c5cf5c
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 25 deletions.
diff --git a/src/page/bell/Bell.ts b/src/page/bell/Bell.ts
@@ -5,7 +5,6 @@ import {
   addCssClass,
   addDomElement,
   contains,
-  decodeHtmlEntities,
   delay,
   nothing,
   once,
@@ -30,6 +29,7 @@ import {
 import SubscriptionChangeEvent from '../models/SubscriptionChangeEvent';
 import { bowserCastle } from '../../shared/utils/bowserCastle';
 import OneSignal from '../../onesignal/OneSignal';
+import BrowserUtils from '../../shared/utils/BrowserUtils';
 
 const logoSvg = `<svg class="onesignal-bell-svg" xmlns="http://www.w3.org/2000/svg" width="99.7" height="99.7" viewBox="0 0 99.7 99.7"><circle class="background" cx="49.9" cy="49.9" r="49.9"/><path class="foreground" d="M50.1 66.2H27.7s-2-.2-2-2.1c0-1.9 1.7-2 1.7-2s6.7-3.2 6.7-5.5S33 52.7 33 43.3s6-16.6 13.2-16.6c0 0 1-2.4 3.9-2.4 2.8 0 3.8 2.4 3.8 2.4 7.2 0 13.2 7.2 13.2 16.6s-1 11-1 13.3c0 2.3 6.7 5.5 6.7 5.5s1.7.1 1.7 2c0 1.8-2.1 2.1-2.1 2.1H50.1zm-7.2 2.3h14.5s-1 6.3-7.2 6.3-7.3-6.3-7.3-6.3z"/><ellipse class="stroke" cx="49.9" cy="49.9" rx="37.4" ry="36.9"/></svg>`;
 
@@ -277,7 +277,7 @@ export default class Bell {
             resolve();
           });
         } else {
-          this.message.content = decodeHtmlEntities(
+          this.message.content = BrowserUtils.decodeHtmlEntities(
             this.message.getTipForState(),
           );
           this.message.contentType = Message.TYPES.TIP;

diff --git a/src/page/bell/Message.ts b/src/page/bell/Message.ts
@@ -1,6 +1,6 @@
+import BrowserUtils from '../../shared/utils/BrowserUtils';
 import Log from '../../shared/libraries/Log';
 import {
-  decodeHtmlEntities,
   delay,
   getConsoleStyle,
   nothing,
@@ -47,7 +47,7 @@ export default class Message extends AnimatedElement {
     );
     return (this.shown ? this.hide() : nothing())
       .then(() => {
-        this.content = decodeHtmlEntities(content);
+        this.content = BrowserUtils.decodeHtmlEntities((content));
         this.contentType = type;
       })
       .then(() => {
@@ -75,7 +75,7 @@ export default class Message extends AnimatedElement {
   }
 
   enqueue(message: string) {
-    this.queued.push(decodeHtmlEntities(message));
+    this.queued.push(BrowserUtils.decodeHtmlEntities(message));
     return new Promise<void>((resolve) => {
       if (this.bell.badge.shown) {
         this.bell.badge

diff --git a/src/shared/utils/BrowserUtils.ts b/src/shared/utils/BrowserUtils.ts
@@ -1,20 +1,12 @@
-import Environment from '../helpers/Environment';
-
 export class BrowserUtils {
-  private static decodeTextArea: HTMLTextAreaElement | null = null;
-  public static decodeHtmlEntities(text: string) {
-    if (Environment.isBrowser()) {
-      if (!BrowserUtils.decodeTextArea) {
-        BrowserUtils.decodeTextArea = document.createElement('textarea');
-      }
-    }
-    if (BrowserUtils.decodeTextArea) {
-      BrowserUtils.decodeTextArea.innerHTML = text;
-      return BrowserUtils.decodeTextArea.value;
-    } else {
-      // Not running in a browser environment, text cannot be decoded
+  // Decodes HTML encoded characters (like &amp;) into their displayed value.
+  // Example: "&lt;b&gt;test&lt;/b&gt" becomes "<b>test</b>"
+  public static decodeHtmlEntities(text: string): string {
+    if (typeof DOMParser === 'undefined') {
       return text;
     }
+    const doc = new DOMParser().parseFromString(text, 'text/html');
+    return doc.documentElement.textContent || '';
   }
 }
 

diff --git a/src/shared/utils/utils.ts b/src/shared/utils/utils.ts
@@ -3,9 +3,7 @@ import { WindowEnvironmentKind } from '../models/WindowEnvironmentKind';
 import Database from '../services/Database';
 import { OneSignalUtils } from './OneSignalUtils';
 import { PermissionUtils } from './PermissionUtils';
-import { BrowserUtils } from './BrowserUtils';
 import { Utils } from '../context/Utils';
-import bowser from 'bowser';
 import TimeoutError from '../errors/TimeoutError';
 import Log from '../libraries/Log';
 import { bowserCastle } from './bowserCastle';
@@ -14,10 +12,6 @@ export function isArray(variable: any) {
   return Object.prototype.toString.call(variable) === '[object Array]';
 }
 
-export function decodeHtmlEntities(text: string) {
-  return BrowserUtils.decodeHtmlEntities(text);
-}
-
 export function removeDomElement(selector: string) {
   const els = document.querySelectorAll(selector);
   if (els.length > 0) {