fix: added sanitisation for richtext rendering

shiksha-platform · Aug 23, 2022 · 82b7a84 · 82b7a84
1 parent eec8498
commit 82b7a84
Show file tree

Hide file tree

Showing 3 changed files with 198 additions and 5 deletions.
diff --git a/packages/content-pages/package.json b/packages/content-pages/package.json
@@ -13,10 +13,11 @@
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^12.8.3",
     "axios": "^0.24.0",
+    "dompurify": "^2.3.10",
     "draft-js": "^0.11.7",
     "draftjs-to-html": "^0.9.1",
     "expo-font": "^10.0.3",
-    "i18next": "^21.6.7",
+    "isomorphic-dompurify":"^0.20.0",
     "moment": "^2.29.1",
     "native-base": "^3.2.2",
     "react": "^17.0.2",

diff --git a/packages/content-pages/src/components/RichtextBlockComponent.js b/packages/content-pages/src/components/RichtextBlockComponent.js
@@ -3,6 +3,7 @@ import { useEffect, useState } from "react";
 import { EditorState, convertToRaw, convertFromRaw } from "draft-js";
 import draftToHtml from "draftjs-to-html";
 import { mock1, mock2 } from "./mock";
+import DOMPurify from "isomorphic-dompurify";
 
 console.log(mock1);
 export default function RichtextBlockComponent({initialData}) {
@@ -23,5 +24,5 @@ export default function RichtextBlockComponent({initialData}) {
     }
   }, [convertedContent]);
 
-  return <div dangerouslySetInnerHTML={{ __html: convertedContent }}></div>;
+  return <div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(convertedContent) }}></div>;
 }