eslint-plugin-lwc icon indicating copy to clipboard operation
eslint-plugin-lwc copied to clipboard

no-inner-html rule seems overzealous (flags getter usage)

Open geoffswift opened this issue 2 years ago • 0 comments
trafficstars

We prefer to generate our HTML by building up a DOM node tree, and reading the outerHTML property, and thus we can ensure that we are securely / appropriately escaping all HTML entities etc. The no-inner-html rule flags up instances where I am reading the outerHTML property on a DOM node though, and this seems to be overzealous.

Is the rule being helpful in this example?

const anchor = document.createElement('a'),
	textNode = document.createTextNode(Name);

anchor.setAttribute('target', target);
anchor.href = href;

// eslint-disable-next-line @lwc/lwc/no-inner-html
return anchor.outerHTML;

I propose that the rule would ideally be amended to flag up when the innerHTML / outerHTML (etc) property is being set. It would seem to be the case that when the setter is used, that there is potential risk.

N.B. The documentation in no-inner-html.md appears to be erroneous and refers to outputHTML rather than outerHTML as follows:

Disallow the use of 'innerHTML' in all its forms. This includes innerHTML, outputHTML, and insertAdjacentHTML.

geoffswift avatar Nov 17 '23 10:11 geoffswift