jsdialog: added missing 'disabled' attribute to listbox

problem: if listbox was initially disabled main container had missing disabled attribute, and because of that MutationObserver was never triggered to enable it Signed-off-by: Pranam Lashkari <lpranam@collabora.com> Change-Id: I4079cff1afd3ad0aeba920e0f38ed6571d317be3
CollaboraOnline · Dec 17, 2024 · 296d48f · 296d48f
1 parent b43b238
commit 296d48f
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 10 deletions.
diff --git a/browser/src/control/Control.JSDialogBuilder.js b/browser/src/control/Control.JSDialogBuilder.js
@@ -376,7 +376,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 
 		if (data.enabled === false) {
 			div.disabled = true;
-			spinfield.setAttribute('disabled', '');
+			spinfield.setAttribute('disabled', 'true');
 		}
 
 		JSDialog.SynchronizeDisabledState(div, [spinfield]);
@@ -1683,13 +1683,14 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		listboxArrow.id = 'listbox-arrow-' + data.id;
 
 
-		JSDialog.SynchronizeDisabledState(container, [listbox]);
-
 		if (data.enabled === false) {
 			container.disabled = true;
 			listbox.disabled = true;
+			container.setAttribute('disabled', 'true');
 		}
 
+		JSDialog.SynchronizeDisabledState(container, [listbox]);
+
 		$(listbox).change(() => {
 			if ($(listbox).val())
 				builder.callback('combobox', 'selected', data, $(listbox).val()+ ';' + $(listbox).children('option:selected').text(), builder);
@@ -2388,7 +2389,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 					}
 
 					if (disabled)
-						div.setAttribute('disabled', '');
+						div.setAttribute('disabled', 'true');
 					else
 						div.removeAttribute('disabled');
 				};
@@ -2408,7 +2409,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 			}
 
 			if (disabled) {
-				div.setAttribute('disabled', '');
+				div.setAttribute('disabled', 'true');
 			}
 
 			var selectFn = function() {
@@ -2501,7 +2502,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		builder._preventDocumentLosingFocusOnClick(div);
 
 		if (data.enabled === 'false' || data.enabled === false)
-			div.setAttribute('disabled', '');
+			div.setAttribute('disabled', 'true');
 
 		builder.map.hideRestrictedItems(data, controls['container'], controls['container']);
 		builder.map.disableLockedItem(data, controls['container'], controls['container']);
@@ -2516,7 +2517,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 					if (builder.map.tooltip)
 						builder.map.tooltip.show(elem, builder.map.getLastModDateValue()); // Show the tooltip with the correct content
 				}));
-	
+
 				$(elem).on('mouseleave', function() {
 					if (builder.map.tooltip)
 						builder.map.tooltip.hide(elem);
@@ -2833,7 +2834,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 			break;
 
 		case 'disable':
-			control.setAttribute('disabled', '');
+			control.setAttribute('disabled', 'true');
 			control.disabled = true;
 			break;
 

diff --git a/browser/src/control/jsdialog/Util.StateChange.ts b/browser/src/control/jsdialog/Util.StateChange.ts
@@ -21,7 +21,8 @@ function onStateChange(element: Element, callback: StateChangeCallback) {
 	var enabledCallback = function (mutations: Array<MutationRecord>) {
 		for (var i in mutations) {
 			if (mutations[i].attributeName === 'disabled') {
-				var enable = mutations[i].oldValue !== null;
+				const htmlElement = mutations[i].target as HTMLElement;
+				var enable = htmlElement.getAttribute('disabled') !== 'true';
 				callback(enable);
 			}
 		}

diff --git a/browser/src/control/jsdialog/Widget.HTMLContent.ts b/browser/src/control/jsdialog/Widget.HTMLContent.ts
@@ -197,7 +197,10 @@ function htmlContent(
 		setTimeout(() => builder.map.userList.renderAll(), 0);
 
 	if (data.enabled === false && parentContainer.firstChild)
-		(parentContainer.firstChild as HTMLElement).setAttribute('disabled', '');
+		(parentContainer.firstChild as HTMLElement).setAttribute(
+			'disabled',
+			'true',
+		);
 }
 
 JSDialog.htmlContent = htmlContent;