From 1b2b5ff36ab55d0b204a9b858010467a06a439f1 Mon Sep 17 00:00:00 2001
From: JuliaSvinareva <Julia.Svinaryova@onlyoffice.com>
Date: Thu, 3 Sep 2020 18:43:03 +0300
Subject: [PATCH] Update bootstrap (dropdown menu)

---
 apps/common/main/lib/component/Button.js      | 10 ++++-----
 apps/common/main/lib/component/ColorButton.js |  2 +-
 apps/common/main/lib/component/ComboBox.js    | 10 ++++-----
 .../main/lib/component/ComboBoxFonts.js       | 12 +++++------
 .../main/lib/component/ComboDataView.js       |  2 +-
 apps/common/main/lib/component/InputField.js  | 12 +++++------
 apps/common/main/lib/component/Menu.js        | 11 +++++-----
 apps/common/main/lib/component/MenuItem.js    |  5 +++--
 apps/common/main/lib/component/Tooltip.js     |  2 +-
 apps/common/main/lib/extend/Bootstrap.js      | 10 ++++-----
 apps/common/main/lib/view/Comments.js         |  4 ++--
 apps/common/main/lib/view/History.js          |  2 +-
 apps/common/main/lib/view/ReviewPopover.js    |  2 +-
 apps/common/main/resources/less/combobox.less |  2 +-
 .../embed/js/ApplicationController.js         |  2 +-
 .../main/app/controller/Viewport.js           |  3 ++-
 .../main/app/view/ListSettingsDialog.js       |  4 ++--
 apps/documenteditor/main/app/view/Toolbar.js  | 21 ++++++++++---------
 .../main/resources/less/filemenu.less         |  4 ++--
 .../embed/js/ApplicationController.js         |  2 +-
 .../main/resources/less/leftmenu.less         |  6 +++---
 .../embed/js/ApplicationController.js         |  2 +-
 .../main/app/view/FormulaTab.js               |  2 +-
 .../main/app/view/NameManagerDlg.js           |  2 +-
 .../main/app/view/Toolbar.js                  |  2 +-
 .../main/resources/less/leftmenu.less         |  6 +++---
 26 files changed, 73 insertions(+), 69 deletions(-)

diff --git a/apps/common/main/lib/component/Button.js b/apps/common/main/lib/component/Button.js
index 29fc096d6..f8b11c628 100644
--- a/apps/common/main/lib/component/Button.js
+++ b/apps/common/main/lib/component/Button.js
@@ -223,7 +223,7 @@ define([
                     templateBtnIcon +
                 '</span>' +
             '</button>' +
-            '<button type="button" class="btn <%= cls %> inner-box-caption dropdown-toggle" data-toggle="dropdown">' +
+            '<button type="button" class="btn <%= cls %> inner-box-caption dropdown-toggle" data-toggle="dropdown" data-reference="parent">' +
                 '<span class="btn-fixflex-vcenter">' +
                     '<span class="caption"><%= caption %></span>' +
                     '<i class="caret img-commonctrl"></i>' +
@@ -281,7 +281,7 @@ define([
                         '<% applyicon() %>',
                         '<span class="caption"><%= caption %></span>',
                     '</button>',
-                    '<button type="button" class="btn <%= cls %> dropdown-toggle" data-toggle="dropdown">',
+                    '<button type="button" class="btn <%= cls %> dropdown-toggle" data-toggle="dropdown" data-reference="parent">',
                         '<i class="caret img-commonctrl"></i>',
                         '<span class="sr-only"></span>',
                     '</button>',
@@ -388,7 +388,7 @@ define([
 
                     if (modalParents.length > 0) {
                         $(me.btnEl.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
-                        me.btnMenuEl && me.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                        me.btnMenuEl && $(me.btnMenuEl.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
                         var onModalClose = function(dlg) {
                             if (modalParents[0] !== dlg.$window[0]) return;
                             var tip = me.btnEl.data('bs.tooltip');
@@ -719,8 +719,8 @@ define([
             });
 
             if (modalParents.length > 0) {
-                this.btnEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
-                this.btnMenuEl && this.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                $(this.btnEl.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                this.btnMenuEl && $(this.btnMenuEl.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
             }
 
             if (this.disabled || !Common.Utils.isGecko) {
diff --git a/apps/common/main/lib/component/ColorButton.js b/apps/common/main/lib/component/ColorButton.js
index c01bcd325..eddb4ac26 100644
--- a/apps/common/main/lib/component/ColorButton.js
+++ b/apps/common/main/lib/component/ColorButton.js
@@ -109,7 +109,7 @@ define([
                     id: id,
                     additionalAlign: options.additionalAlign,
                     items: (options.additionalItems ? options.additionalItems : []).concat([
-                        { template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height: 220px; margin: 10px;"></div>') },
+                        { template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false },
                         { template: _.template('<a id="' + id + '-color-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
                     ])
                 });
diff --git a/apps/common/main/lib/component/ComboBox.js b/apps/common/main/lib/component/ComboBox.js
index 78a7b0a22..383324cad 100644
--- a/apps/common/main/lib/component/ComboBox.js
+++ b/apps/common/main/lib/component/ComboBox.js
@@ -43,7 +43,7 @@
  *
  *  <div class="input-group input-group-nr combobox" id="id-combobox">
  *      <input type="text" class="form-control">
- *      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ *      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-reference="parent"><span class="caret"></span></button>
  *      <ul class="dropdown-menu"></ul>
  * </div>
  *
@@ -92,10 +92,10 @@ define([
             template: _.template([
                 '<span class="input-group combobox <%= cls %>" id="<%= id %>" style="<%= style %>">',
                     '<input type="text" class="form-control" spellcheck="false">',
-                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
+                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-reference="parent"><span class="caret img-commonctrl"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<% _.each(items, function(item) { %>',
-                            '<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
+                            '<li id="<%= item.id %>" class="dropdown-item" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
                         '<% }); %>',
                     '</ul>',
                 '</span>'
@@ -192,7 +192,7 @@ define([
 
                         var modalParents = el.closest('.asc-window');
                         if (modalParents.length > 0) {
-                            el.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                            $(el.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
                             var onModalClose = function(dlg) {
                                 if (modalParents[0] !== dlg.$window[0]) return;
                                 var tip = el.data('bs.tooltip');
@@ -644,7 +644,7 @@ define([
                 } else {
                     $(this.el).find('ul').html(_.template([
                         '<% _.each(items, function(item) { %>',
-                           '<li id="<%= item.id %>" data-value="<%- item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
+                           '<li id="<%= item.id %>" class="dropdown-item" data-value="<%- item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
                         '<% }); %>'
                     ].join(''))({
                         items: this.store.toJSON(),
diff --git a/apps/common/main/lib/component/ComboBoxFonts.js b/apps/common/main/lib/component/ComboBoxFonts.js
index a109a10e7..668bb1639 100644
--- a/apps/common/main/lib/component/ComboBoxFonts.js
+++ b/apps/common/main/lib/component/ComboBoxFonts.js
@@ -71,11 +71,11 @@ define([
                 '<div class="input-group combobox fonts <%= cls %>" id="<%= id %>" style="<%= style %>">',
                     '<input type="text" class="form-control" spellcheck="false"> ',
                     '<div style="display: table-cell;"></div>',
-                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
+                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-reference="parent"><span class="caret img-commonctrl"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
-                        '<li class="divider">',
+                        '<li class="dropdown-divider">',
                     '<% _.each(items, function(item) { %>',
-                        '<li id="<%= item.id %>">',
+                        '<li id="<%= item.id %>" class="dropdown-item">',
                             '<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
                         '</li>',
                     '<% }); %>',
@@ -204,8 +204,8 @@ define([
 
                     if (e.keyCode == Common.UI.Keys.UP || e.keyCode == Common.UI.Keys.DOWN) {
                         _.delay(function() {
-                            var selected = (e.keyCode == Common.UI.Keys.DOWN) ? me.cmpEl.find('ul li.selected').nextAll('li:not(.divider)') : me.cmpEl.find('ul li.selected').prevAll('li:not(.divider)');
-                            selected = (selected.length>0) ? selected.eq(0) : ((e.keyCode == Common.UI.Keys.DOWN) ? me.cmpEl.find('ul li:not(.divider):first') : me.cmpEl.find('ul li:not(.divider):last'));
+                            var selected = (e.keyCode == Common.UI.Keys.DOWN) ? me.cmpEl.find('ul li.selected').nextAll('li:not(.dropdown-divider)') : me.cmpEl.find('ul li.selected').prevAll('li:not(.dropdown-divider)');
+                            selected = (selected.length>0) ? selected.eq(0) : ((e.keyCode == Common.UI.Keys.DOWN) ? me.cmpEl.find('ul li:not(.dropdown-divider):first') : me.cmpEl.find('ul li:not(.dropdown-divider):last'));
                             selected = selected.find('a');
 
                             me._skipInputChange = true;
@@ -379,7 +379,7 @@ define([
 
             onInsertItem: function(item) {
                 $(this.el).find('ul').prepend(_.template([
-                    '<li id="<%= item.id %>">',
+                    '<li id="<%= item.id %>" class="dropdown-item">',
                         '<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
                     '</li>'
                 ].join(''))({
diff --git a/apps/common/main/lib/component/ComboDataView.js b/apps/common/main/lib/component/ComboDataView.js
index 7e816324f..8fe76286b 100644
--- a/apps/common/main/lib/component/ComboDataView.js
+++ b/apps/common/main/lib/component/ComboDataView.js
@@ -108,7 +108,7 @@ define([
                     menuAlign: 'tl-tl',
                     offset: [0, 3],
                     items: [
-                        {template: _.template('<div class="menu-picker-container"></div>')}
+                        {template: _.template('<div class="menu-picker-container"></div>'), clsDropdownItem: false}
                     ]
                 })
             });
diff --git a/apps/common/main/lib/component/InputField.js b/apps/common/main/lib/component/InputField.js
index df8164441..0ca5c07d4 100644
--- a/apps/common/main/lib/component/InputField.js
+++ b/apps/common/main/lib/component/InputField.js
@@ -169,7 +169,7 @@ define([
                     if (this._input.closest('.asc-window').length>0)
                         var onModalClose = function() {
                             var errorTip = el.find('.input-error').data('bs.tooltip');
-                            if (errorTip) errorTip.tip().remove();
+                            if (errorTip) $(errorTip.getTipElement()).remove();
                             Common.NotificationCenter.off({'modal:close': onModalClose});
                         };
                         Common.NotificationCenter.on({'modal:close': onModalClose});
@@ -334,7 +334,7 @@ define([
                             modalParents = errorBadge.closest('.asc-window'),
                             errorTip = errorBadge.data('bs.tooltip');
 
-                        if (errorTip) errorTip.tip().remove();
+                        if (errorTip) $(errorTip.getTipElement()).remove();
                         errorBadge.attr('data-toggle', 'tooltip');
                         errorBadge.removeData('bs.tooltip');
                         errorBadge.tooltip({
@@ -342,7 +342,7 @@ define([
                             placement   : 'cursor'
                         });
                         if (modalParents.length > 0) {
-                            errorBadge.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                            $(errorBadge.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
                         }
 
                         return errors;
@@ -363,7 +363,7 @@ define([
                         modalParents = errorBadge.closest('.asc-window'),
                         errorTip = errorBadge.data('bs.tooltip');
 
-                    if (errorTip) errorTip.tip().remove();
+                    if (errorTip) $(errorTip.getTipElement()).remove();
                     errorBadge.attr('data-toggle', 'tooltip');
                     errorBadge.removeData('bs.tooltip');
                     errorBadge.tooltip({
@@ -372,7 +372,7 @@ define([
                     });
 
                     if (modalParents.length > 0) {
-                        errorBadge.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
+                        $(errorBadge.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
                     }
                 } else {
                     me.cmpEl.removeClass('error');
@@ -476,7 +476,7 @@ define([
                     if (this._input.closest('.asc-window').length>0)
                         var onModalClose = function() {
                             var errorTip = el.find('.input-error').data('bs.tooltip');
-                            if (errorTip) errorTip.tip().remove();
+                            if (errorTip) $(errorTip.getTipElement()).remove();
                             Common.NotificationCenter.off({'modal:close': onModalClose});
                         };
                     Common.NotificationCenter.on({'modal:close': onModalClose});
diff --git a/apps/common/main/lib/component/Menu.js b/apps/common/main/lib/component/Menu.js
index e528612c6..258b62b3d 100644
--- a/apps/common/main/lib/component/Menu.js
+++ b/apps/common/main/lib/component/Menu.js
@@ -44,10 +44,10 @@
  *  Default template
  *
  *  <ul class="dropdown-menu" role="menu">
- *      <li><a href="#">item 1</a></li>-->
- *      <li><a href="#">item 2</a></li>-->
- *      <li class="divider"></li>-->
- *      <li><a href="#">item 3</a></li>
+ *      <li class="dropdown-item"><a href="#">item 1</a></li>-->
+ *      <li class="dropdown-item"><a href="#">item 2</a></li>-->
+ *      <li class="dropdown-divider"></li>-->
+ *      <li class="dropdown-item"><a href="#">item 3</a></li>
  *  </ul>
  *
  *  A useful classes of menu position
@@ -186,7 +186,8 @@ define([
                         me.items.push(
                             new Common.UI.MenuItem(_.extend({
                                 tagName : 'li',
-                                template: me.itemTemplate
+                                template: me.itemTemplate,
+                                clsDropdownItem: me.clsDropdownItem
                             }, item))
                         );
                     }
diff --git a/apps/common/main/lib/component/MenuItem.js b/apps/common/main/lib/component/MenuItem.js
index 693423c61..c881ff0b9 100644
--- a/apps/common/main/lib/component/MenuItem.js
+++ b/apps/common/main/lib/component/MenuItem.js
@@ -48,7 +48,7 @@
  *  <li><a href="#">Caption</a></li>
  *
  *  Separator:
- *  <li class="divider"></li>
+ *  <li class="dropdown-divider"></li>
  *
  *  Menu item with sub-menu:
  *  <li class="dropdown-submenu">
@@ -136,6 +136,7 @@ define([
             this.iconCls        = me.options.iconCls;
             this.hint           = me.options.hint;
             this.rendered       = false;
+            this.clsDropdownItem   = (!_.isUndefined(me.options.clsDropdownItem)) ? me.options.clsDropdownItem : true; // false for complex elements (forms, group buttons)
 
             if (this.menu !== null && !(this.menu instanceof Common.UI.Menu) && !(this.menu instanceof Common.UI.MenuSimple)) {
                 this.menu = new Common.UI.Menu(_.extend({}, me.options.menu));
@@ -179,7 +180,7 @@ define([
                         );
                     }
 
-                    el.addClass('dropdown-item');
+                    this.clsDropdownItem && el.addClass('dropdown-item');
 
                     var firstChild = el.children(':first');
 
diff --git a/apps/common/main/lib/component/Tooltip.js b/apps/common/main/lib/component/Tooltip.js
index f5e279f67..9b10cc7ac 100644
--- a/apps/common/main/lib/component/Tooltip.js
+++ b/apps/common/main/lib/component/Tooltip.js
@@ -147,7 +147,7 @@
         },
 
         isVisible: function() {
-            return this.getBSTip().tip().is(':visible');
+            return $(this.getBSTip().getTipElement()).is(':visible');
         }
     });
     Common.UI = Common.UI || {};
diff --git a/apps/common/main/lib/extend/Bootstrap.js b/apps/common/main/lib/extend/Bootstrap.js
index 599f129e7..9c529a3d0 100755
--- a/apps/common/main/lib/extend/Bootstrap.js
+++ b/apps/common/main/lib/extend/Bootstrap.js
@@ -95,7 +95,7 @@ function patchDropDownKeyDown(e) {
     }
 
 //    var $items = $('[role=menu] li:not(.divider):visible a', $parent)   - original search function
-    var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', $parent).find('> a');
+    var $items = $('> [role=menu] > li:not(.dropdown-divider):not(.disabled):visible', $parent).find('> a');
 
     if (!$items.length) return;
 
@@ -109,9 +109,9 @@ function patchDropDownKeyDown(e) {
             li.addClass('focused-submenu');
              _.delay(function() {
                  var mnu = $('> [role=menu]', li),
-                    $subitems = mnu.find('> li:not(.divider):not(.disabled):visible > a'),
-                    $dataviews = mnu.find('> li:not(.divider):not(.disabled):visible .dataview'),
-                    $internal_menu = mnu.find('> li:not(.divider):not(.disabled):visible ul.internal-menu');
+                    $subitems = mnu.find('> li:not(.dropdown-divider):not(.disabled):visible > a'),
+                    $dataviews = mnu.find('> li:not(.dropdown-divider):not(.disabled):visible .dataview'),
+                    $internal_menu = mnu.find('> li:not(.dropdown-divider):not(.disabled):visible ul.internal-menu');
                 if ($subitems.length>0 && $dataviews.length<1 && $internal_menu.length<1)
                     ($subitems.index($subitems.filter(':focus'))<0) && $subitems.eq(0).focus();
             }, 250);
@@ -153,7 +153,7 @@ function patchDropDownKeyDownAdditional(e) { // only for formula menu when typin
         return (isActive) ? $this.click() : undefined;
     }
 
-    var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', $parent).find('> a');
+    var $items = $('> [role=menu] > li:not(.dropdown-divider):not(.disabled):visible', $parent).find('> a');
 
     if (!$items.length) return;
 
diff --git a/apps/common/main/lib/view/Comments.js b/apps/common/main/lib/view/Comments.js
index 679ea505c..707467e55 100644
--- a/apps/common/main/lib/view/Comments.js
+++ b/apps/common/main/lib/view/Comments.js
@@ -371,12 +371,12 @@ define([
                         btns = $(view.el).find('.btn-resolve');
                     btns.tooltip({title: me.textResolve, placement: 'cursor'});
                     btns.each(function(idx, item){
-                        arr.push($(item).data('bs.tooltip').tip());
+                        arr.push($($(item).data('bs.tooltip').getTipElement()));
                     });
                     btns = $(view.el).find('.btn-resolve-check');
                     btns.tooltip({title: me.textOpenAgain, placement: 'cursor'});
                     btns.each(function(idx, item){
-                        arr.push($(item).data('bs.tooltip').tip());
+                        arr.push($($(item).data('bs.tooltip').getTipElement()));
                     });
                     view.tipsArray = arr;
                 };
diff --git a/apps/common/main/lib/view/History.js b/apps/common/main/lib/view/History.js
index aabc4aa31..c19e0570c 100644
--- a/apps/common/main/lib/view/History.js
+++ b/apps/common/main/lib/view/History.js
@@ -120,7 +120,7 @@ define([
                 if (record.get('isRevision')) {
                     if (view.btnTip) {
                         view.btnTip.dontShow = true;
-                        view.btnTip.tip().remove();
+                        $(view.btnTip.getTipElement()).remove();
                         view.btnTip = null;
                     }
                     var btns = $(view.el).find('.revision-expand').tooltip({title: (record.get('isExpanded')) ? me.textHide : me.textShow, placement: 'cursor'});
diff --git a/apps/common/main/lib/view/ReviewPopover.js b/apps/common/main/lib/view/ReviewPopover.js
index 723632817..a6f6af399 100644
--- a/apps/common/main/lib/view/ReviewPopover.js
+++ b/apps/common/main/lib/view/ReviewPopover.js
@@ -963,7 +963,7 @@ define([
                     } else if (event.keyCode == Common.UI.Keys.DOWN) {
                         if (me.emailMenu && me.emailMenu.rendered && me.emailMenu.isVisible()) {
                             _.delay(function () {
-                                var selected = me.emailMenu.cmpEl.find('li:not(.divider):first');
+                                var selected = me.emailMenu.cmpEl.find('li:not(.dropdown-divider):first');
                                 selected = selected.find('a');
                                 selected.focus();
                             }, 10);
diff --git a/apps/common/main/resources/less/combobox.less b/apps/common/main/resources/less/combobox.less
index 1428b4ff5..4bc2140bd 100644
--- a/apps/common/main/resources/less/combobox.less
+++ b/apps/common/main/resources/less/combobox.less
@@ -115,7 +115,7 @@
             }
         }
 
-        &.divider:first-child {
+        &.dropdown-divider:first-child {
             display: none;
         }
     }
diff --git a/apps/documenteditor/embed/js/ApplicationController.js b/apps/documenteditor/embed/js/ApplicationController.js
index 8eef26616..318106114 100644
--- a/apps/documenteditor/embed/js/ApplicationController.js
+++ b/apps/documenteditor/embed/js/ApplicationController.js
@@ -179,7 +179,7 @@ DE.ApplicationController = new(function(){
                     $ttEl = $('.hyperlink-tooltip');
                     $ttEl.tooltip({'container':'body', 'trigger':'manual'});
                     $ttEl.on('shown.bs.tooltip', function(e) {
-                        $tooltip = $ttEl.data('bs.tooltip').tip();
+                        $tooltip = $($ttEl.data('bs.tooltip').getTipElement());
 
                         $tooltip.css({
                             left: $ttEl.ttpos[0] + ttOffset[0],
diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js
index 5780631da..3bff9087f 100644
--- a/apps/documenteditor/main/app/controller/Viewport.js
+++ b/apps/documenteditor/main/app/controller/Viewport.js
@@ -275,7 +275,8 @@ define([
                         '</div>'
                     ].join('')),
                     stopPropagation: true,
-                    value: me.header.mnuZoom.options.value
+                    value: me.header.mnuZoom.options.value,
+                    clsDropdownItem: false
                 });
 
                 me.header.btnOptions.setMenu(new Common.UI.Menu({
diff --git a/apps/documenteditor/main/app/view/ListSettingsDialog.js b/apps/documenteditor/main/app/view/ListSettingsDialog.js
index ff07be93b..dbfe8329b 100644
--- a/apps/documenteditor/main/app/view/ListSettingsDialog.js
+++ b/apps/documenteditor/main/app/view/ListSettingsDialog.js
@@ -184,7 +184,7 @@ define([
             var itemsTemplate =
                 [
                     '<% _.each(items, function(item) { %>',
-                    '<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem">',
+                    '<li id="<%= item.id %>" class="dropdown-item" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem">',
                     '<%= item.displayValue %><% if (item.value === Asc.c_oAscNumberingFormat.Bullet) { %><span style="font-family:<%=item.font%>;"><%=item.symbol%></span><% } %>',
                     '</a></li>',
                     '<% }); %>'
@@ -193,7 +193,7 @@ define([
                 '<div class="input-group combobox input-group-nr <%= cls %>" id="<%= id %>" style="<%= style %>">',
                 '<div class="form-control" style="padding-top:3px; line-height: 14px; cursor: pointer; <%= style %>"></div>',
                 '<div style="display: table-cell;"></div>',
-                '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
+                '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-reference="parent"><span class="caret img-commonctrl"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">'].concat(itemsTemplate).concat([
                     '</ul>',
                 '</div>'
diff --git a/apps/documenteditor/main/app/view/Toolbar.js b/apps/documenteditor/main/app/view/Toolbar.js
index 029e27b84..3445adc44 100644
--- a/apps/documenteditor/main/app/view/Toolbar.js
+++ b/apps/documenteditor/main/app/view/Toolbar.js
@@ -242,7 +242,7 @@ define([
                         menu: new Common.UI.Menu({
                             style: 'min-width: 100px;',
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-highlight" style="width: 120px; height: 120px; margin: 10px;"></div>')},
+                                {template: _.template('<div id="id-toolbar-menu-highlight" style="width: 120px; height: 120px; margin: 10px;"></div>'), clsDropdownItem: false},
                                 {caption: '--'},
                                 this.mnuHighlightTransparent = new Common.UI.MenuItem({
                                     caption: this.strMenuNoFill,
@@ -267,7 +267,7 @@ define([
                                     template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 -7px; background-color: #000;"></span><%= caption %></a>')
                                 },
                                 {caption: '--'},
-                                {template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
+                                {template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false},
                                 {template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
                             ]
                         })
@@ -281,7 +281,7 @@ define([
                         split: true,
                         menu: new Common.UI.Menu({
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
+                                {template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false},
                                 {template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
                             ]
                         })
@@ -437,7 +437,7 @@ define([
                         caption: me.capBtnInsTable,
                         menu: new Common.UI.Menu({
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>')},
+                                {template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>'), clsDropdownItem: false},
                                 {caption: this.mniCustomTable, value: 'custom'},
                                 {caption: this.mniDrawTable, value: 'draw', checkable: true},
                                 {caption: this.mniEraseTable, value: 'erase', checkable: true}
@@ -486,7 +486,7 @@ define([
                         menu: new Common.UI.Menu({
                             cls: 'menu-shapes',
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>')}
+                                {template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>'), clsDropdownItem: false}
                             ]
                         })
                     });
@@ -1086,7 +1086,8 @@ define([
                             '<div id="id-save-style-container" class = "save-style-container">' +
                             '<span id="id-save-style-plus" class="plus img-commonctrl"  ></span>' +
                             '<label id="id-save-style-link" class="save-style-link" >' + me.textStyleMenuNew + '</label>' +
-                            '</div>')
+                            '</div>'),
+                        clsDropdownItem: false
                     });
 
                     this.listStyles = new Common.UI.ComboDataView({
@@ -1622,7 +1623,7 @@ define([
                     new Common.UI.Menu({
                         style: 'min-width: 139px',
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 139px; margin: 0 16px;"></div>')},
+                            {template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 139px; margin: 0 16px;"></div>'), clsDropdownItem: false},
                             this.mnuMarkerSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuMarkersPicker.conf.index || 0)==0,
@@ -1635,7 +1636,7 @@ define([
                 this.btnNumbers.setMenu(
                     new Common.UI.Menu({
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 185px; margin: 0 16px;"></div>')},
+                            {template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 185px; margin: 0 16px;"></div>'), clsDropdownItem: false},
                             this.mnuNumberSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuNumbersPicker.conf.index || 0)==0,
@@ -1649,7 +1650,7 @@ define([
                     new Common.UI.Menu({
                         style: 'min-width: 90px',
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 16px;"></div>')},
+                            {template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 16px;"></div>'), clsDropdownItem: false},
                             this.mnuMultilevelSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuMultilevelPicker.conf.index || 0)==0,
@@ -1693,7 +1694,7 @@ define([
                 this.btnInsertChart.setMenu( new Common.UI.Menu({
                     style: 'width: 364px;',
                     items: [
-                        {template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')}
+                        {template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>'), clsDropdownItem: false}
                     ]
                 }));
 
diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less
index 1b45ece50..a66d300d2 100644
--- a/apps/documenteditor/main/resources/less/filemenu.less
+++ b/apps/documenteditor/main/resources/less/filemenu.less
@@ -137,7 +137,7 @@
         }
       }
 
-      &.divider {
+      &.dropdown-divider {
         height: 10px;
       }
     }
@@ -325,7 +325,7 @@
         }
       }
 
-      &.divider {
+      &.dropdown-divider {
         height: 10px;
       }
     }
diff --git a/apps/presentationeditor/embed/js/ApplicationController.js b/apps/presentationeditor/embed/js/ApplicationController.js
index 244aa0e0e..c3d3a39a4 100644
--- a/apps/presentationeditor/embed/js/ApplicationController.js
+++ b/apps/presentationeditor/embed/js/ApplicationController.js
@@ -176,7 +176,7 @@ PE.ApplicationController = new(function(){
                     $ttEl = $('.hyperlink-tooltip');
                     $ttEl.tooltip({'container':'body', 'trigger':'manual'});
                     $ttEl.on('shown.bs.tooltip', function(e) {
-                        $tooltip = $ttEl.data('bs.tooltip').tip();
+                        $tooltip = $($ttEl.data('bs.tooltip').getTipElement());
 
                         $tooltip.css({
                             left: $ttEl.ttpos[0] + ttOffset[0],
diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less
index 82edc9190..03987691a 100644
--- a/apps/presentationeditor/main/resources/less/leftmenu.less
+++ b/apps/presentationeditor/main/resources/less/leftmenu.less
@@ -121,7 +121,7 @@
             }
 
             &.devider {
-                .dropdown-menu .divider;
+                .dropdown-menu .dropdown-divider;
                 margin-top: 10px;
                 margin-bottom: 10px;
             }
@@ -203,7 +203,7 @@
                         }
                     }
 
-                    &.divider {
+                    &.dropdown-divider {
                         height: 10px;
                     }
                 }
@@ -388,7 +388,7 @@
                         }
                     }
 
-                    &.divider {
+                    &.dropdown-divider {
                         height: 10px;
                     }
                 }
diff --git a/apps/spreadsheeteditor/embed/js/ApplicationController.js b/apps/spreadsheeteditor/embed/js/ApplicationController.js
index 6b9a0bc31..ca1d1a457 100644
--- a/apps/spreadsheeteditor/embed/js/ApplicationController.js
+++ b/apps/spreadsheeteditor/embed/js/ApplicationController.js
@@ -509,7 +509,7 @@ SSE.ApplicationController = new(function(){
                     $ttEl = $('.hyperlink-tooltip');
                     $ttEl.tooltip({'container': 'body', 'trigger': 'manual'});
                     $ttEl.on('shown.bs.tooltip', function(e) {
-                        $tooltip = $ttEl.data('bs.tooltip').tip();
+                        $tooltip = $($ttEl.data('bs.tooltip').getTipElement());
 
                         $tooltip.css({
                             left: $ttEl.ttpos[0] + ttOffset[0],
diff --git a/apps/spreadsheeteditor/main/app/view/FormulaTab.js b/apps/spreadsheeteditor/main/app/view/FormulaTab.js
index 92343ba62..5e59d798b 100644
--- a/apps/spreadsheeteditor/main/app/view/FormulaTab.js
+++ b/apps/spreadsheeteditor/main/app/view/FormulaTab.js
@@ -350,7 +350,7 @@ define([
                     (li.length>0) && li.click();
                     Common.UI.Menu.Manager.hideAll();
                 } else if (e.namespace!=="after.bs.dropdown" && (e.keyCode == Common.UI.Keys.DOWN || e.keyCode == Common.UI.Keys.UP)) {
-                    var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', menu.$el).find('> a');
+                    var $items = $('> [role=menu] > li:not(.dropdown-divider):not(.disabled):visible', menu.$el).find('> a');
                     if (!$items.length) return;
                     var index = $items.index($items.filter(':focus')),
                         me = this;
diff --git a/apps/spreadsheeteditor/main/app/view/NameManagerDlg.js b/apps/spreadsheeteditor/main/app/view/NameManagerDlg.js
index e0eb6bf0d..782482db6 100644
--- a/apps/spreadsheeteditor/main/app/view/NameManagerDlg.js
+++ b/apps/spreadsheeteditor/main/app/view/NameManagerDlg.js
@@ -260,7 +260,7 @@ define([  'text!spreadsheeteditor/main/app/template/NameManagerDlg.template',
                 var me = this,
                     tipdata = $(evt.target).tooltip({title: this.tipIsLocked,trigger:'manual'}).data('bs.tooltip');
 
-                this.userTooltip = tipdata.tip();
+                this.userTooltip = $(tipdata.getTipElement());
                 this.userTooltip.css('z-index', parseInt(this.$window.css('z-index')) + 10);
                 tipdata.show();
 
diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js
index 86434fc0d..565181958 100644
--- a/apps/spreadsheeteditor/main/app/view/Toolbar.js
+++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js
@@ -253,7 +253,7 @@ define([
                         '<div style="display: inline-block; width: 100%; max-width: 300px; overflow: hidden; text-overflow: ellipsis; text-align: right; vertical-align: bottom; padding-left: 100px; color: silver;white-space: nowrap;"><%= item.exampleval ? item.exampleval : "" %></div>',
                         '</div></a></li>',
                         '<% }); %>',
-                        '<li class="divider">',
+                        '<li class="dropdown-divider">',
                         '<li id="id-toolbar-mnu-item-more-formats" data-value="-1"><a tabindex="-1" type="menuitem">' + me.textMoreFormats + '</a></li>'
                     ].join(''));
 
diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less
index 4ca403a1d..94ed8fdb7 100644
--- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less
+++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less
@@ -111,7 +111,7 @@
             }
 
             &.devider {
-                .dropdown-menu .divider;
+                .dropdown-menu .dropdown-divider;
                 margin-top: 10px;
                 margin-bottom: 10px;
             }
@@ -232,7 +232,7 @@
                         }
                     }
 
-                    &.divider {
+                    &.dropdown-divider {
                         height: 10px;
                     }
                 }
@@ -441,7 +441,7 @@
                         }
                     }
 
-                    &.divider {
+                    &.dropdown-divider {
                         height: 10px;
                     }
                 }