diff options
Diffstat (limited to 'js/tests/visual')
| -rw-r--r-- | js/tests/visual/tooltip.html | 22 |
1 files changed, 21 insertions, 1 deletions
diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html index 436f5c1cd..831f26d0a 100644 --- a/js/tests/visual/tooltip.html +++ b/js/tests/visual/tooltip.html @@ -62,7 +62,12 @@ </button> </p> </div> - <div id="target" title="Test tooltip on transformed element"></div> + <div class="row"> + <div class="col-sm-3"> + <div id="target" title="Test tooltip on transformed element"></div> + </div> + <div id="shadow" class="pt-5"></div> + </div> <div id="customContainer"></div> </div> @@ -72,6 +77,21 @@ <script src="../../dist/tooltip.js"></script> <script> $(function () { + if (typeof document.body.attachShadow === 'function') { + var shadowRoot = $('#shadow')[0].attachShadow({ mode: 'open' }) + shadowRoot.innerHTML = + '<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top in a shadow dom">' + + ' Tooltip on top in a shadow dom' + + '</button>' + + '<button id="secondTooltip" type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top in a shadow dom with container option">' + + ' Tooltip on top in a shadow dom' + + '</button>' + + $(shadowRoot.firstChild).tooltip() + $(shadowRoot.getElementById('secondTooltip')).tooltip({ + container: shadowRoot + }) + } $('[data-toggle="tooltip"]').tooltip() $('#tooltipElement').tooltip({ container: $('#customContainer')[0] |