rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-18 10:52:19 +01:00
Code Issues Actions Packages Releases Activity

test: ensure .navbar-fixed-* padding on modal open

Browse Source
This commit is contained in:
Andrew Luca 2018-10-14 22:39:40 +03:00 committed by Johann-S
parent 5003e6c1b9
commit 0b78f465d3
1 changed files with 76 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
js/tests/unit/modal.js
View File

@ -387,4 +387,80 @@ $(function () {
})
.bootstrapModal('show')
})
QUnit.test('should add padding-right of scrollbar width to .navbar-fixed-top and .navbar-fixed-bottom before open', function (assert) {
assert.expect(2)
var Modal = $.fn.bootstrapModal.Constructor
var done = assert.async()
var $body = $(document.body)
var scrollbarWidth
// simulate overflow scroll
$body.css({ height: '2000px' })
var $fixedTop = $('<nav class="navbar navbar-fixed-top" />').appendTo($body)
var $fixedBottom = $('<nav class="navbar navbar-fixed-bottom" />').appendTo($body)
// patch setScrollbar function to get scrollbar width
var setScrollbar = Modal.prototype.setScrollbar
Modal.prototype.setScrollbar = function () {
setScrollbar.call(this)
scrollbarWidth = this.scrollbarWidth + 'px'
}
$('<div id="modal-test"/>')
.on('hidden.bs.modal', function () {
$fixedTop.remove()
$fixedBottom.remove()
$body.removeAttr('style')
// restore original setScrollbar
Modal.prototype.setScrollbar = setScrollbar
done()
})
.on('shown.bs.modal', function () {
var fixedTopPaddingRight = $fixedTop.css('padding-right')
var fixedBottomPaddingRight = $fixedBottom.css('padding-right')
assert.strictEqual(scrollbarWidth, fixedTopPaddingRight,
'.navbar-fixed-top has padding-right (' + fixedTopPaddingRight + ') equal to scrollbar width (' + scrollbarWidth + ')')
assert.strictEqual(scrollbarWidth, fixedBottomPaddingRight,
'.navbar-fixed-bottom has padding-right (' + fixedBottomPaddingRight + ') equal to scrollbar width (' + scrollbarWidth + ')')
$(this).bootstrapModal('hide')
})
.bootstrapModal('show')
})
QUnit.test('should restore inline padding-right for .navbar-fixed-top and .navbar-fixed-bottom after close', function (assert) {
assert.expect(2)
var done = assert.async()
var $body = $(document.body)
var $styleshhet = $('<link rel="stylesheet" href="../../dist/css/bootstrap.css" />').appendTo(document.head)
var $fixedTop = $('<nav class="navbar navbar-fixed-top" style="padding-right: 10px;" />').appendTo($body)
var $fixedBottom = $('<nav class="navbar navbar-fixed-bottom" style="padding-right: 5%;" />').appendTo($body)
// simulate overflow scroll
$body.css({ height: '2000px' })
$('<div id="modal-test"/>')
.on('hidden.bs.modal', function () {
assert.strictEqual($fixedTop.css('padding-right'), '10px',
'.navbar-fixed-top has inline padding-right restored')
assert.strictEqual($fixedBottom[0].style.paddingRight, '5%',
'.navbar-fixed-bottom has right padding-right restored')
$fixedTop.remove()
$fixedBottom.remove()
$body.removeAttr('style')
$styleshhet.remove()
done()
})
.on('shown.bs.modal', function () {
$(this).bootstrapModal('hide')
})
.bootstrapModal('show')
})
})