From 458378819816e2c36d2fbc4105c85942be974ad4 Mon Sep 17 00:00:00 2001
From: Jim Fitzpatrick <fitzpatrick.jim@gmail.com>
Date: Fri, 12 Mar 2021 13:37:48 -0500
Subject: [PATCH] Fix XSS vulnerability

Fixes a Cross-Site Scripting (XSS) vulnerability that would allow an
attacker to execute arbitrary JavaScript if they had a way to input data
that would ultimately be displayed in a Dropkick select (even if the
`<select>` element itself were properly escaped). This was due to a code
path that would set the `innerHTML` of a div to the `.text` property of
a corresponding option node.text`. If that text value contained valid
HTML, the div would be built out with that HTML. This commit instead
updates the logic to set `innerHTML` to the `innerHTML` of the option,
which would appropriately carry over HTML entities, etc.

Here is a fiddle that reproduces the issue:

https://jsfiddle.net/L32ej60q/
---
 src/dropkick.js        |  2 +-
 tests/dropkick-test.js | 14 ++++++++++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/dropkick.js b/src/dropkick.js
index 787bef18..f0989903 100644
--- a/src/dropkick.js
+++ b/src/dropkick.js
@@ -1109,7 +1109,7 @@ Dropkick.build = function( sel, idpre ) {
     ret.elem.appendChild( _.create( "div", {
       "class": "dk-selected " + ( selOpt ? selOpt.className : "" ),
       "tabindex": sel.tabindex || 0,
-      "innerHTML": selOpt ? selOpt.text : '&nbsp;',
+      "innerHTML": selOpt ? selOpt.innerHTML : '&nbsp;',
       "id": idpre + "-combobox",
       "aria-live": "assertive",
       "aria-owns": optList.id,
diff --git a/tests/dropkick-test.js b/tests/dropkick-test.js
index fbc1e06a..28086061 100644
--- a/tests/dropkick-test.js
+++ b/tests/dropkick-test.js
@@ -1,4 +1,5 @@
 import { expect } from 'chai';
+import sinon from 'sinon';
 import {
   $,
   buildSelect,
@@ -263,4 +264,17 @@ describe('Dropkick tests', function() {
       });
     });
   });
+
+  describe('security', function() {
+    it('does not construct html from option node text', function(done) {
+      window.xssCallback = sinon.fake();
+      let select = buildSelect('xss_select', ['<img src="img.gif" onload="xssCallback()" onerror="xssCallback()">']);
+      this.dk = new Dropkick(select);
+      expect(this.dk.data.elem.querySelector('img')).to.equal(null);
+      setTimeout(function() {
+        expect(window.xssCallback).not.to.have.been.called;
+        done();
+      }, 10);
+    });
+  });
 });