From e5ff08c9865e132d147b4b747a3dd16432664c34 Mon Sep 17 00:00:00 2001 From: Uyen Nguyen <55873366+uyen18827@users.noreply.github.com> Date: Sun, 5 Sep 2021 20:53:03 +0700 Subject: [PATCH] dependency: added DOMPurify --- package-lock.json | 40 +++++++++++++++++++++++++++++++++ package.json | 4 ++++ src/core/inventory/inventory.ts | 25 +++++++++++---------- src/core/script/saveScript.ts | 15 +++++++------ 4 files changed, 65 insertions(+), 19 deletions(-) diff --git a/package-lock.json b/package-lock.json index ecd5e1a..ee76605 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,10 @@ "name": "veinif", "version": "0.0.1-alpha.2", "license": "MIT", + "dependencies": { + "@types/dompurify": "^2.2.3", + "dompurify": "^2.3.1" + }, "devDependencies": { "electron": "^12.0.4", "electron-builder": "^22.10.5", @@ -209,6 +213,14 @@ "@types/ms": "*" } }, + "node_modules/@types/dompurify": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-2.2.3.tgz", + "integrity": "sha512-CLtc2mZK8+axmrz1JqtpklO/Kvn38arGc8o1l3UVopZaXXuer9ONdZwJ/9f226GrhRLtUmLr9WrvZsRSNpS8og==", + "dependencies": { + "@types/trusted-types": "*" + } + }, "node_modules/@types/fs-extra": { "version": "9.0.12", "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-9.0.12.tgz", @@ -259,6 +271,11 @@ "xmlbuilder": ">=11.0.1" } }, + "node_modules/@types/trusted-types": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.2.tgz", + "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==" + }, "node_modules/@types/verror": { "version": "1.10.5", "resolved": "https://registry.npmjs.org/@types/verror/-/verror-1.10.5.tgz", @@ -1297,6 +1314,11 @@ "node": ">=8" } }, + "node_modules/dompurify": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.3.1.tgz", + "integrity": "sha512-xGWt+NHAQS+4tpgbOAI08yxW0Pr256Gu/FNE2frZVTbgrBUn8M7tz7/ktS/LZ2MHeGqz6topj0/xY+y8R5FBFw==" + }, "node_modules/dot-prop": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz", @@ -3705,6 +3727,14 @@ "@types/ms": "*" } }, + "@types/dompurify": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-2.2.3.tgz", + "integrity": "sha512-CLtc2mZK8+axmrz1JqtpklO/Kvn38arGc8o1l3UVopZaXXuer9ONdZwJ/9f226GrhRLtUmLr9WrvZsRSNpS8og==", + "requires": { + "@types/trusted-types": "*" + } + }, "@types/fs-extra": { "version": "9.0.12", "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-9.0.12.tgz", @@ -3755,6 +3785,11 @@ "xmlbuilder": ">=11.0.1" } }, + "@types/trusted-types": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.2.tgz", + "integrity": "sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==" + }, "@types/verror": { "version": "1.10.5", "resolved": "https://registry.npmjs.org/@types/verror/-/verror-1.10.5.tgz", @@ -4566,6 +4601,11 @@ "verror": "^1.10.0" } }, + "dompurify": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.3.1.tgz", + "integrity": "sha512-xGWt+NHAQS+4tpgbOAI08yxW0Pr256Gu/FNE2frZVTbgrBUn8M7tz7/ktS/LZ2MHeGqz6topj0/xY+y8R5FBFw==" + }, "dot-prop": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz", diff --git a/package.json b/package.json index b3fbdd0..6f29e6c 100644 --- a/package.json +++ b/package.json @@ -38,5 +38,9 @@ "buildResources": "electron/buildResources" } } + }, + "dependencies": { + "@types/dompurify": "^2.2.3", + "dompurify": "^2.3.1" } } diff --git a/src/core/inventory/inventory.ts b/src/core/inventory/inventory.ts index 133a30d..333b9eb 100644 --- a/src/core/inventory/inventory.ts +++ b/src/core/inventory/inventory.ts @@ -1,6 +1,7 @@ import { inventoryItem, Items } from "../model/item"; import { Paragraphs } from "../model/paragraph"; import { capitalise } from "../../tools/formatting"; +import DOMPurify from 'DOMPurify'; export let inventory: Array = []; @@ -47,16 +48,16 @@ export function getItem(item: Items, pName: Paragraphs["name"]) { if (inInventory.item.itemQty == 0) { removeItemHTML(inInventory.item.itemCode) } - else{ - console.log(`${item.itemName} is already in the inventory. Adding 1 to quantity.`); - console.log(inventory); - //update item quantity on view - let quantityDiv = document.querySelector(`#${item.itemCode}-quantity`); - quantityDiv!.textContent = `Quantity: ${inInventory.item.itemQty}`; - let pNameCheck = inInventory.pickedUpLocation.find(location => location == pName); - console.log(pNameCheck, pName) - if (!pNameCheck) { - inInventory.pickedUpLocation.push(pName); + else { + console.log(`${item.itemName} is already in the inventory. Adding 1 to quantity.`); + console.log(inventory); + //update item quantity on view + let quantityDiv = document.querySelector(`#${item.itemCode}-quantity`); + quantityDiv!.textContent = `Quantity: ${inInventory.item.itemQty}`; + let pNameCheck = inInventory.pickedUpLocation.find(location => location == pName); + console.log(pNameCheck, pName) + if (!pNameCheck) { + inInventory.pickedUpLocation.push(pName); } } } @@ -98,7 +99,7 @@ export function appendItemHTML(item: Items) { role="tab" aria-controls="pills-${item.itemCode}" aria-selected="false">${capitalise(item.itemName)} `; - inventoryTab.innerHTML += tab; + inventoryTab.innerHTML += DOMPurify.sanitize(tab); let tabContent: string = `
Quantity: ${item.itemQty}
` - inventoryTabContent.innerHTML += tabContent; + inventoryTabContent.innerHTML += DOMPurify.sanitize(tabContent); } /** * Clear all item from Inventory interface diff --git a/src/core/script/saveScript.ts b/src/core/script/saveScript.ts index 77bd464..a5a2c20 100644 --- a/src/core/script/saveScript.ts +++ b/src/core/script/saveScript.ts @@ -5,6 +5,7 @@ import { Save } from "../model/save"; import { getCurrentParagraphName, updateParagraph } from "../paragraphs/paragraphFunctions"; import { getPlayer, setPlayer, showNameDiv } from "../player/playerInfo"; import { loadPronounsRadioBtn, showPronouns } from "../player/pronouns"; +import * as DOMPurify from 'DOMPurify'; /** * Create a new save and stringify it. @@ -81,8 +82,8 @@ export function exportStorageSave(saveSlot: string) { let retrievedSave = localStorage.getItem(saveSlot); let saveMessage = document.querySelector('#exportMessage'); saveMessage!.textContent = null; //clear old message - saveMessage!.innerHTML += `Save exported from ${saveSlot}.
- Copy and keep the code bellow to load later`; + saveMessage!.innerHTML += DOMPurify.sanitize(`Save exported from ${saveSlot}.
+ Copy and keep the code bellow to load later`); let saveOutput = document.querySelector(`#saveOutput`); (saveOutput).value = ``; //clear old save (saveOutput).value = `${btoa(retrievedSave!)}`; //encode to Base64 @@ -96,8 +97,8 @@ export function exportStorageSave(saveSlot: string) { export function exportSave() { let saveMessage = document.querySelector('#exportMessage'); saveMessage!.textContent = null; //clear old message - saveMessage!.innerHTML += `Save created at ${new Date().toLocaleString()}.
- Copy and keep the code bellow to load later` + saveMessage!.innerHTML += DOMPurify.sanitize(`Save created at ${new Date().toLocaleString()}.
+ Copy and keep the code bellow to load later`); let saveOutput = document.querySelector(`#saveOutput`); (saveOutput).value = ``; //clear old save (saveOutput).value += `${btoa(save())}`; //encode to Base64 @@ -116,10 +117,10 @@ export function loadSaveCode() { console.log(retrievedSave) load(retrievedSave); let loadMessage = document.querySelector(`#exportMessage`); - loadMessage!.innerHTML += ``); //TODO: verify if save is valid. //TODO: fallback: If load is invalid, start new game. } @@ -128,5 +129,5 @@ export function getSaveDesc(saveSlot: string) { let retrievedSave = JSON.parse(localStorage.getItem(saveSlot)!); let description = retrievedSave.date; let descContainer = document.querySelector(`#saveDesc-${saveSlot}`); - descContainer!.innerHTML = description; + descContainer!.innerHTML = DOMPurify.sanitize(description); } \ No newline at end of file