remove-w2ui: use JSDialog.Dropdown in MenuButtons

Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I9a5bec468a64ef8cfa9868ef3a61b9d308106c94

browser/src/control/jsdialog/Widget.MenuButton.js

@@ -25,53 +25,6 @@
 
 /* global JSDialog $ */
 
-function _makeW2MenuFocusable(id, control, menu) {
-	var element = document.getElementById(id);
-	var rows = element.getElementsByTagName('tr');
-	rows = Array.from(rows);
-
-	if (rows.length > 0) {
-		var tabStartIndex = 1000; // Shouldn't be 0 (zero).
-		// Loop focus inside menu - start.
-		var parentNode = rows[0].parentNode;
-		var trBegin = document.createElement('tr');
-		trBegin.tabIndex = tabStartIndex - 1;
-		trBegin.id = id + '-beginning';
-		parentNode.insertBefore(trBegin, parentNode.children[0]);
-
-		var trEnd = document.createElement('tr');
-		trEnd.id = id + '-ending';
-		trEnd.tabIndex = tabStartIndex + rows.length;
-		parentNode.appendChild(trEnd);
-
-		trBegin.addEventListener('focusin', function() {
-			rows[rows.length - 1].focus();
-		});
-
-		trEnd.addEventListener('focusin', function() {
-			rows[0].focus();
-		});
-		// Loop focus inside menu - end.
-
-		trEnd.focus();
-
-		rows.forEach(function(row, index) {
-			if (!menu[index].type || (menu[index].type !== 'break' && menu[index].type !== 'separator'))
-				row.tabIndex = index + tabStartIndex;
-
-			row.addEventListener('keydown', function(event) {
-				var elementToHide = document.getElementById(id);
-				if (event.code === 'Escape') {
-					if (elementToHide) {
-						elementToHide.style.display = 'none';
-						control.button.focus();
-					}
-				}
-			});
-		});
-	}
-}
-
 function _menubuttonControl (parentContainer, data, builder) {
 	var ids;
 	var menuId = null;
@@ -116,22 +69,36 @@ function _menubuttonControl (parentContainer, data, builder) {
 		$(control.container).addClass('menubutton');
 
 		$(control.container).unbind('click');
-		$(control.container).click(function () {
+
+		var dropdownId = data.id;
+		var clickFunction = function () {
 			if (control.container.hasAttribute('disabled'))
 				return;
-			$(control.container).w2menu({
-				items: builder._menus[menuId],
-				onSelect: function (event) {
-					if (event.item.uno)
-						builder.map.sendUnoCommand('.uno:' + event.item.uno);
-					else if (event.item.type === 'action')
-						builder.map.dispatch(event.item.id);
-					else
-						builder.callback('menubutton', 'select', control.container, event.item.id, builder);
+
+			var callback = function(objectType, eventType, object, data, entry) {
+				if (eventType === 'selected' && entry.uno) {
+					var uno = (entry.uno.indexOf('.uno:') === 0) ? entry.uno : '.uno:' + entry.uno;
+					builder.map.sendUnoCommand(uno);
+					JSDialog.CloseDropdown(dropdownId);
+					return true;
+				} else if (eventType === 'selected' && entry.action) {
+					builder.map.dispatch(entry.action);
+					JSDialog.CloseDropdown(dropdownId);
+					return true;
+				} else if (eventType === 'selected') {
+					builder.callback('menubutton', 'select', control.container, entry.id, builder);
+					JSDialog.CloseDropdown(dropdownId);
+					return true;
 				}
-			});
-			_makeW2MenuFocusable('w2ui-overlay', control, builder._menus[menuId]);
-		});
+
+				return false;
+			};
+
+			JSDialog.OpenDropdown(dropdownId, control.container, builder._menus[menuId], callback);
+		};
+
+		control.container.addEventListener('click', clickFunction);
+		builder._preventDocumentLosingFocusOnClick(control.container);
 
 		builder.options.noLabelsForUnoButtons = noLabels;
 	} else if (data.text !== undefined || data.image) {

cypress_test/integration_tests/desktop/writer/notebookbar_spec.js

@@ -0,0 +1,35 @@
+/* global describe it cy beforeEach require afterEach Cypress */
+
+var helper = require('../../common/helper');
+var desktopHelper = require('../../common/desktop_helper');
+var writerHelper = require('../../common/writer_helper');
+
+describe(['tagdesktop'], 'Notebookbar tests.', function() {
+	var origTestFileName = 'notebookbar.odt';
+	var testFileName;
+
+	beforeEach(function() {
+		testFileName = helper.beforeAll(origTestFileName, 'writer');
+		desktopHelper.switchUIToNotebookbar();
+
+		if (Cypress.env('INTEGRATION') === 'nextcloud') {
+			desktopHelper.showSidebarIfHidden();
+		}
+
+		writerHelper.selectAllTextOfDoc();
+	});
+
+	afterEach(function() {
+		helper.afterAll(testFileName, this.currentTest.state);
+	});
+
+	it('Apply bold font from dropdown in Format tab', function() {
+		cy.cGet('.notebookbar #Format-tab-label').click();
+		cy.cGet('.notebookbar .unoFormatMenu > .unoarrow').click();
+		cy.cGet('#format-dropdown').should('exist');
+		cy.cGet('#format-dropdown #format-entry-0').click(); // Bold
+		cy.cGet('#format-dropdown').should('not.exist');
+		writerHelper.selectAllTextOfDoc();
+		cy.cGet('#copy-paste-container p b').should('exist');
+	});
+});