From faa1e07e64c59e1c195038ce017105cf745592fa Mon Sep 17 00:00:00 2001 From: Johann-S Date: Mon, 25 Sep 2017 22:23:32 +0200 Subject: [PATCH 1/4] Dropdown - Allow to disable Popper.js style --- docs/4.0/components/dropdowns.md | 6 ++++++ js/src/dropdown.js | 12 ++++++++++-- js/tests/unit/dropdown.js | 30 ++++++++++++++++++++++++++++++ js/tests/visual/dropdown.html | 19 ++++++++++++++++--- 4 files changed, 62 insertions(+), 5 deletions(-) diff --git a/docs/4.0/components/dropdowns.md b/docs/4.0/components/dropdowns.md index b4c70478ef9e..33657440b27c 100644 --- a/docs/4.0/components/dropdowns.md +++ b/docs/4.0/components/dropdowns.md @@ -778,6 +778,12 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap 'toggle' Reference element of the dropdown menu. Accepts the values of 'toggle', 'parent', or an HTMLElement reference. For more information refer to Popper.js's referenceObject docs. + + display + string + dynamic | static + By default we use Popper.js but if you want to disable Popper.js use `static` + diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 82deaa220522..b877017f2bd5 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -75,14 +75,16 @@ const Dropdown = (($) => { offset : 0, flip : true, boundary : 'scrollParent', - reference : 'toggle' + reference : 'toggle', + display : 'dynamic' } const DefaultType = { offset : '(number|string|function)', flip : 'boolean', boundary : '(string|element)', - reference : '(string|element)' + reference : '(string|element)', + display : 'string' } /** @@ -295,6 +297,12 @@ const Dropdown = (($) => { } } + // Disable Popper.js if we have a static display + if (this._config.display === 'static') { + popperConfig.modifiers.applyStyle = { + enabled: false + } + } return popperConfig } diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js index 97ceb6596111..0d34b0a4ebae 100644 --- a/js/tests/unit/dropdown.js +++ b/js/tests/unit/dropdown.js @@ -908,4 +908,34 @@ $(function () { }) $textarea.trigger('click') }) + + QUnit.test('should not use Popper.js if display set to static', function (assert) { + assert.expect(1) + var dropdownHTML = + '
' + + 'Dropdown' + + '
' + + 'Secondary link' + + 'Something else here' + + '
' + + 'Another link' + + '
' + + '
' + + var $dropdown = $(dropdownHTML) + .appendTo('#qunit-fixture') + .find('[data-toggle="dropdown"]') + .bootstrapDropdown() + var done = assert.async() + var dropdownMenu = $dropdown.next()[0] + + $dropdown.parent('.dropdown') + .on('shown.bs.dropdown', function () { + // Popper.js add this attribute when we use it + assert.strictEqual(dropdownMenu.getAttribute('x-placement'), null) + done() + }) + + $dropdown.trigger('click') + }) }) diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html index 27a888f04048..e757155f7e5d 100644 --- a/js/tests/visual/dropdown.html +++ b/js/tests/visual/dropdown.html @@ -164,9 +164,9 @@

Dropdown Bootstrap Visual Test

-
+
- +
Action Another action @@ -174,7 +174,7 @@

Dropdown Bootstrap Visual Test

-
+
+
+
+ +
+ Action + Another action + Something else here +
+
+
+
From 3d9dbfc63d543b1637c1ac58833c388e9801e478 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 21 Jan 2018 22:12:31 +0200 Subject: [PATCH 2/4] Update dropdown.js --- js/tests/unit/dropdown.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js index 0d34b0a4ebae..3040e81b41aa 100644 --- a/js/tests/unit/dropdown.js +++ b/js/tests/unit/dropdown.js @@ -912,15 +912,15 @@ $(function () { QUnit.test('should not use Popper.js if display set to static', function (assert) { assert.expect(1) var dropdownHTML = - '
' - + 'Dropdown' - + '
' - + 'Secondary link' - + 'Something else here' - + '
' - + 'Another link' - + '
' - + '
' + '
' + + 'Dropdown' + + '
' + + 'Secondary link' + + 'Something else here' + + '
' + + 'Another link' + + '
' + + '
' var $dropdown = $(dropdownHTML) .appendTo('#qunit-fixture') From c16195d2e2dd24fba55474bbef95d940fed1f0f5 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 21 Jan 2018 22:19:35 +0200 Subject: [PATCH 3/4] Update dropdown.html --- js/tests/visual/dropdown.html | 1 - 1 file changed, 1 deletion(-) diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html index e757155f7e5d..e3bacc2950f2 100644 --- a/js/tests/visual/dropdown.html +++ b/js/tests/visual/dropdown.html @@ -200,7 +200,6 @@

Dropdown Bootstrap Visual Test

- From 9f742114840e71fd6557ca4fca3dcaaf72452f6d Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 11 Feb 2018 15:22:27 -0800 Subject: [PATCH 4/4] copy changes --- docs/4.0/components/dropdowns.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/4.0/components/dropdowns.md b/docs/4.0/components/dropdowns.md index 33657440b27c..cba13ce0394b 100644 --- a/docs/4.0/components/dropdowns.md +++ b/docs/4.0/components/dropdowns.md @@ -782,7 +782,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap display string dynamic | static - By default we use Popper.js but if you want to disable Popper.js use `static` + By default, we use Popper.js for dynamic positioning. Disable this with `static`.