diff options
author | Johann-S <johann.servoire@gmail.com> | 2018-09-18 15:37:40 +0300 |
---|---|---|
committer | XhmikosR <xhmikosr@gmail.com> | 2018-11-13 09:47:32 +0300 |
commit | 557d5ac74d591b7267053e5fe6db9defcb480895 (patch) | |
tree | a1a1eb964aacd58c068cdb3d35eee4b47b0addf5 /js | |
parent | 4cac833447c53ec7f140c26260ddf36d78ff298f (diff) |
Remove the show delay for our toast plugin
Diffstat (limited to 'js')
-rw-r--r-- | js/src/toast.js | 37 | ||||
-rw-r--r-- | js/tests/unit/toast.js | 27 | ||||
-rw-r--r-- | js/tests/visual/toast.html | 6 |
3 files changed, 14 insertions, 56 deletions
diff --git a/js/src/toast.js b/js/src/toast.js index 1e70e091f2..878ffe0296 100644 --- a/js/src/toast.js +++ b/js/src/toast.js @@ -38,16 +38,13 @@ const Toast = (($) => { const DefaultType = { animation : 'boolean', autohide : 'boolean', - delay : '(number|object)' + delay : 'number' } const Default = { animation : true, autohide : true, - delay : { - show: 0, - hide: 500 - } + delay : 500 } const Selector = { @@ -95,19 +92,16 @@ const Toast = (($) => { } } - this._timeout = setTimeout(() => { - this._element.classList.add(ClassName.SHOW) - - if (this._config.animation) { - const transitionDuration = Util.getTransitionDurationFromElement(this._element) + this._element.classList.add(ClassName.SHOW) + if (this._config.animation) { + const transitionDuration = Util.getTransitionDurationFromElement(this._element) - $(this._element) - .one(Util.TRANSITION_END, complete) - .emulateTransitionEnd(transitionDuration) - } else { - complete() - } - }, this._config.delay.show) + $(this._element) + .one(Util.TRANSITION_END, complete) + .emulateTransitionEnd(transitionDuration) + } else { + complete() + } } hide(withoutTimeout) { @@ -122,7 +116,7 @@ const Toast = (($) => { } else { this._timeout = setTimeout(() => { this._close() - }, this._config.delay.hide) + }, this._config.delay) } } @@ -150,13 +144,6 @@ const Toast = (($) => { ...typeof config === 'object' && config ? config : {} } - if (typeof config.delay === 'number') { - config.delay = { - show: config.delay, - hide: config.delay - } - } - Util.typeCheckConfig( NAME, config, diff --git a/js/tests/unit/toast.js b/js/tests/unit/toast.js index d9c5e1fb6e..e6bd6be1ee 100644 --- a/js/tests/unit/toast.js +++ b/js/tests/unit/toast.js @@ -184,28 +184,6 @@ $(function () { .bootstrapToast('show') }) - QUnit.test('should allow to pass delay object in html', function (assert) { - assert.expect(1) - var done = assert.async() - - var toastHtml = - '<div class="toast" data-delay=\'{"show": 0, "hide": 1}\'>' + - '<div class="toast-body">' + - 'a simple toast' + - '</div>' + - '</div>' - - var $toast = $(toastHtml) - .bootstrapToast() - .appendTo($('#qunit-fixture')) - - $toast.on('shown.bs.toast', function () { - assert.strictEqual($toast.hasClass('show'), true) - done() - }) - .bootstrapToast('show') - }) - QUnit.test('should allow to config in js', function (assert) { assert.expect(1) var done = assert.async() @@ -219,10 +197,7 @@ $(function () { var $toast = $(toastHtml) .bootstrapToast({ - delay: { - show: 0, - hide: 1 - } + delay: 1 }) .appendTo($('#qunit-fixture')) diff --git a/js/tests/visual/toast.html b/js/tests/visual/toast.html index 902194617b..d069a163a7 100644 --- a/js/tests/visual/toast.html +++ b/js/tests/visual/toast.html @@ -26,7 +26,7 @@ </div> <div class="notifications"> - <div id="toastAutoHide" class="toast" role="alert" aria-live="assertive" aria-atomic="true"> + <div id="toastAutoHide" class="toast" role="alert" aria-live="assertive" aria-atomic="true" data-delay="2000"> <div class="toast-header"> <img class="rounded mr-2" data-src="holder.js/20x20?size=1&text=.&bg=#007aff" alt=""> <strong class="mr-auto">Bootstrap</strong> @@ -60,10 +60,6 @@ <script src="../../dist/toast.js"></script> <script> $(function () { - $('#toastAutoHide').attr('data-delay', JSON.stringify({ - show: 0, - hide: 2000 - })) $('.toast').toast() $('#btnShowToast').on('click', function () { |