DOM-based XSS due to un-escaped special characters

[hwendland]

How can we reproduce this bug?

1. Create a new tribute
2. Set the display name (key) of one of the items to "<img/src/on src=x onerror=alert(document.domain)>".
3. When you enter "@" into the input field managed by tribute, the drop-down list for selecting a name will be displayed and JavaScript will be executed via the HTML tag contained in the username.

What did you expect to happen?

• HTML is sanitised / escaped before it is inserted into the DOM

What happened instead?

• The HTML is inserted into the DOM as is

Link (jsfiddle/plunkr/codepen) or Screenshot:
https://codepen.io/hannah_dnp/pen/QWmQLmG
-> enter "@" into any of the inputs and observe the alert being shown

[LockingReal]

My personal opinion If the packaging tool is used, I think the xss attack defense should be in the compile or package phase (plug-in). For other scenarios, you can use some other npm libraries in the whole project(xss.js??), but I think it is not good to use special apis to process values during development..