fix(tooltip): xss in container option

zwesy · Jun 1, 2018 · 2d90d36 · 2d90d36
1 parent e3084c3
commit 2d90d36
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 21 deletions.
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
@@ -273,7 +273,7 @@ const Tooltip = (($) => {
         const attachment = this._getAttachment(placement)
         this.addAttachmentClass(attachment)
 
-        const container = this.config.container === false ? document.body : $(this.config.container)
+        const container = this.config.container === false ? document.body : $(document).find(this.config.container)
 
         $(tip).data(this.constructor.DATA_KEY, this)
 

diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html
@@ -27,27 +27,40 @@ <h1>Tooltip <small>Bootstrap Visual Test</small></h1>
 
       <hr>
 
-      <p>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="auto" title="Tooltip on auto">
-          Tooltip on auto
-        </button>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
-          Tooltip on top
-        </button>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="right" title="Tooltip on right">
-          Tooltip on right
-        </button>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">
-          Tooltip on bottom
-        </button>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip on left">
-          Tooltip on left
-        </button>
-        <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-html="true" title="<em>Tooltip</em> <u>with</u> <b>HTML</b>">
-          Tooltip with HTML
-        </button>
-      </p>
+      <div class="row">
+        <p>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="auto" title="Tooltip on auto">
+            Tooltip on auto
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
+            Tooltip on top
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="right" title="Tooltip on right">
+            Tooltip on right
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">
+            Tooltip on bottom
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip on left">
+            Tooltip on left
+          </button>
+        </p>
+      </div>
+      <div class="row">
+        <p>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip with XSS" data-container="<img src=1 onerror=alert(123) />">
+            Tooltip with XSS
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip with container" data-container="#customContainer">
+            Tooltip with container
+          </button>
+          <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-html="true" title="<em>Tooltip</em> <u>with</u> <b>HTML</b>">
+            Tooltip with HTML
+          </button>
+        </p>
+      </div>
       <div id="target" title="Test tooltip on transformed element"></div>
+      <div id="customContainer"></div>
     </div>
 
     <script src="../../../assets/js/vendor/jquery-slim.min.js"></script>