innerHTML causes Severity ERRROR in review process

[Victor_Casajuana_Mas]

Hello.
I am trying to publish an application, but in the process of reviewing the platform returns an error:

• Rule ID: javascript.browser.security.insecure-document-method.insecure-document-method
• Description: User controlled data in methods like innerHTML, outerHTML or document.write is an anti-pattern that can lead to XSS vulnerabilities
• Severity: ERROR
• Confidence: LOW

If the platform doesn’t accept innerHTML, how can I change the HTML content of a Widget?

Thanks!

[rahul (Rahul Ganesh P)]

Hi Victor,
I guess your code does some variable substitution in the .js file through innerHTML. Building secure apps is a core value of the platform, and the idea for this innerHTML security screening is not to allow js injections in HTML content. You can refactor the code as represented in the example below to make it more secure:

const contentToBeModified = document.getElementById('html-content');
const resultContainer = document.createElement('div');

const textToBeAdded = "html content rendering in a secure way";
const textContent = document.createTextNode(textToBeAdded);

resultContainer.innerHTML = "<p id="contentLink"> </p>"

resultContainer.querySelector('#contentLink').appendChild(textContent);

contentToBeModified.appendChild(resultContainer);

Hope this helps

[Victor_Casajuana_Mas]

Thanks !, but the problem is that they don’t allow the .innerHTML() method regardless of the source of the HTML you want to add

[Saif (Saif Ali Shaik)]

Hi @Victor_Casajuana_Mas

I am guessing this is a review feedback from the app reviews team, am I right?

[Victor_Casajuana_Mas]

Exact!
this is a revision app
thanks.