I am trying to add a dynamically generated html tag to the DOM.
For ex. dynamic tag is like – .

After debugging i found out that the checkmarx scan is failing because of “<” and “>” characters.

The code is failing for checkmarx scan.

I tried following approaches –

1. sanitizing the dynamic selector using domSanitizer.bypasssecuritytrusthtml()
   Result : Failing checkmarx scan

`// parent element in .html

// logic in .ts

let safeTag = this.domSanitizer.bypasssecuritytrusthtml(dynamicTag);
this.selector = `<${safeTag}></${safeTag}>“

2. tried adding the dynamic tag to the parent element using innerHtml
   Result: Failing checkmarx scan

`// parent element in .html

// logic in .ts

let el = this.MFE.nativeElement;
this.selector = <${safeTag}></${safeTag}>
el.innerHTML = this.selector;`

3. tried creating a tag in .ts and then adding inside the parent element using insertAdjacentHTML

`// parent element in .html

// logic in .ts

let el = this.MFE.nativeElement;
this.selector = <${safeTag}></${safeTag}>
el.insertAdjacentHTML(“beforeend”, this.selector);`

4. tried escaping the ‘<‘ and ‘>’
   Result: Checkmarx scan passed but the selector is added to parent element as a string instead of HTML tag.

`// parent element in .html

// logic in .ts

let el = this.MFE.nativeElement;
this.selector = $lt;${safeTag}$gt;$lt;/${safeTag}$gt;
el.innerHTML = this.selector;`

5. tried to create a custom pipe to sanitize the innerHTML using domSanitizer
   Result: Checkmarx scan failed

The dynamic tag is generated dynamically and passed to a method as argument inside which I tried the approaches as mentioned above.