1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-16 18:44:01 +02:00

fix regression about using element for tooltip container option

This commit is contained in:
Johann-S
2018-12-05 10:25:00 +01:00
parent 1a171b80ab
commit 37f74c7070
3 changed files with 67 additions and 4 deletions

View File

@@ -414,6 +414,52 @@ $(function () {
.bootstrapTooltip('show')
})
QUnit.test('should place tooltips inside a specific container when container is an element', function (assert) {
assert.expect(3)
var done = assert.async()
var $container = $('<div></div>').appendTo('#qunit-fixture')
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
container: $container[0]
})
$tooltip
.one('shown.bs.tooltip', function () {
assert.strictEqual($container.find('.tooltip').length, 1)
assert.strictEqual($('#qunit-fixture > .tooltip').length, 0, 'tooltip is not in parent')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($container.find('.tooltip').length, 0, 'tooltip was removed from dom')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should place tooltips inside a specific container when container is a selector', function (assert) {
assert.expect(3)
var done = assert.async()
var $container = $('<div id="container"></div>').appendTo('#qunit-fixture')
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
container: '#container'
})
$tooltip
.one('shown.bs.tooltip', function () {
assert.strictEqual($container.find('.tooltip').length, 1)
assert.strictEqual($('#qunit-fixture > .tooltip').length, 0, 'tooltip is not in parent')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($container.find('.tooltip').length, 0, 'tooltip was removed from dom')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should add position class before positioning so that position-specific styles are taken into account', function (assert) {
assert.expect(2)
var done = assert.async()

View File

@@ -51,8 +51,11 @@
<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 type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip with container (selector)" data-container="#customContainer">
Tooltip with container (selector)
</button>
<button id="tooltipElement" type="button" class="btn btn-secondary" data-placement="left" title="Tooltip with container (element)">
Tooltip with container (element)
</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
@@ -70,6 +73,9 @@
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
$('#tooltipElement').tooltip({
container: $('#customContainer')[0]
})
$('#target').tooltip({
placement : 'top',
trigger : 'manual'