XSS vulnerability in default announcements

[thomas-insyde]

Hi,

There's an XSS vulnerability while rendering the LiveRegion when the list is generated with user input. I also managed to recreate it in the demo.

Steps to recreate:

1. Go to the live demo on https://schne324.github.io/dragon-drop/demo/
2. Replace on of the labels, for instance Ween with "><img src=x onerror="alert('Evil script');" />. (Make sure that the text in the dom is encoded, so "><img src=x onerror="alert('Evil script');" />.)
3. Drag & drop the item with malicious content.
4. You'll be prompted with the Js alert.

The problem lies with the use of HTMLElement.innerText for the default announcements.

  announcement: {
    grabbed: function grabbed(el) {
      return 'Item ' + el.innerText + ' grabbed';
    },
    dropped: function dropped(el) {
      return 'Item ' + el.innerText + ' dropped';
    },
    reorder: function reorder(el, items) {
      var pos = items.indexOf(el) + 1;
      var text = el.innerText;
      return 'The list has been reordered, ' + text + ' is now item ' + pos + ' of ' + items.length;
    },
    cancel: 'Reordering cancelled'
  }

Some documentation on XSS prevention can be found here https://cheatsheetseries.owasp.org/cheatsheets/DOM_based_XSS_Prevention_Cheat_Sheet.html.