23.0.2 release

ChangeLog

@@ -1,3 +1,17 @@
+25-JAN-2024: 23.0.2
+
+- Fallback to online resource for embed fonts and images
+- Fixes possible duplicate callback for XHR in error case
+- Adds fallback to raster for embedded SVG images
+- Fixes freehand drawing behaviour [drawio-4140]
+- Prevents XSS due to unchecked base URL parameter
+- Fixes inconsistent link and textbox dialogs
+
+24-JAN-2024: 23.0.1
+
+- Fixes possible scrollbar in connection points dialog
+- Fixes not adding existing tags to selection
+
 23-JAN-2024: 23.0.0
 
 - Major release increment due to removal of HTML labels to SVG path functionality

VERSION

@@ -1 +1 @@
-23.0.0
+23.0.2

src/main/mxgraph/util/mxUtils.js

@@ -2956,6 +2956,25 @@ var mxUtils =
 		return new mxPoint(x - offset.x, y - offset.y);
 	},
 
+	/**
+	 * Function: removeJavascriptProtocol
+	 * 
+	 * Removes leading javascript: protocol from the given link.
+	 * 
+	 * Parameters:
+	 * 
+	 * link - String that represents the link.
+	 */
+	removeJavascriptProtocol: function(link)
+	{
+		while (link != null && mxUtils.ltrim(link.toLowerCase()).substring(0, 11) === 'javascript:')
+		{
+			link = link.substring(link.toLowerCase().indexOf(':') + 1);
+		}
+
+		return link;
+	},
+
 	/**
 	 * Function: ltrim
 	 * 

src/main/mxgraph/util/mxXmlRequest.js

@@ -171,6 +171,13 @@ mxXmlRequest.prototype.request = null;
  */
 mxXmlRequest.prototype.decodeSimulateValues = false;
 
+/**
+ * Variable: acceptResponse
+ * 
+ * Specifies if the response has been processed with onload or onerror.
+ */
+mxXmlRequest.prototype.acceptResponse = true;
+
 /**
  * Function: isBinary
  * 
@@ -319,8 +326,9 @@ mxXmlRequest.prototype.send = function(onload, onerror, timeout, ontimeout)
 		{
 			this.request.onreadystatechange = mxUtils.bind(this, function()
 			{
-				if (this.isReady())
+				if (this.isReady() && this.acceptResponse)
 				{
+					this.acceptResponse = false;
 					onload(this);
 					this.request.onreadystatechange = null;
 				}
@@ -340,7 +348,11 @@ mxXmlRequest.prototype.send = function(onload, onerror, timeout, ontimeout)
 		{
 			this.request.onerror = mxUtils.bind(this, function(e)
 			{
-				onerror(this, e);
+				if (this.acceptResponse)
+				{
+					this.acceptResponse = false;
+					onerror(this, e);
+				}
 			});
 		}
 

src/main/webapp/js/diagramly/App.js

@@ -1862,7 +1862,7 @@ App.blockedAncestorFrames = function()
 				message += ' -> ' + window.location.ancestorOrigins[i];
 
 				// Running commercial, competing services using our infrastructure isn't allowed.
-				if (message.endsWith('tabs.appsplus.co') || message.endsWith('confluence-cloud-excalidraw-ll3likebca-uc.a.run.app'))
+				if (message.endsWith('.appsplus.co') || message.endsWith('confluence-cloud-excalidraw-ll3likebca-uc.a.run.app'))
 				{
 					return true;
 				}

src/main/webapp/js/diagramly/Devel.js

@@ -60,7 +60,7 @@ if (!mxIsElectron && location.protocol !== 'http:')
 			// www.draw.io required for browser data migration to app.diagrams.net and
 			// viewer.diagrams.net required for iframe embed preview
 			'frame-src %frame-src% \'self\' https://viewer.diagrams.net https://www.draw.io https://*.google.com; ' +
-			'style-src %style-src% \'self\'  https://fonts.googleapis.com ' +
+			'style-src %style-src% \'self\' https://fonts.googleapis.com ' +
 			// Replaces unsafe-inline style-src with hashes with safe-style-src URL parameter
 			((urlParams['safe-style-src'] == '1') ? styleHashes : '\'unsafe-inline\'; ') +
 			'base-uri \'none\';' +

src/main/webapp/js/diagramly/Dialogs.js

@@ -6123,13 +6123,12 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 	inner.style.whiteSpace = 'nowrap';
 	inner.style.textOverflow = 'clip';
 	inner.style.cursor = 'default';
-	inner.style.paddingRight = '20px';
 
 	var linkInput = document.createElement('input');
 	linkInput.setAttribute('placeholder', mxResources.get('dragUrlsHere'));
 	linkInput.setAttribute('type', 'text');
 	linkInput.style.marginTop = '6px';
-	linkInput.style.width = '97%';
+	linkInput.style.width = '414px';
 	linkInput.style.boxSizing = 'border-box';
 	linkInput.style.backgroundImage = 'url(\'' + Dialog.prototype.clearImage + '\')';
 	linkInput.style.backgroundRepeat = 'no-repeat';
@@ -6171,8 +6170,7 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 	pageRadio.setAttribute('name', 'geLinkDialogOption');
 
 	var pageSelect = document.createElement('select');
-	pageSelect.style.maxWidth = '100%';
-	pageSelect.style.width = '380px';
+	pageSelect.style.width = '414px';
 
 	var newWindowCheckbox = document.createElement('input');
 	newWindowCheckbox.setAttribute('type', 'checkbox');
@@ -6317,7 +6315,6 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 		{
 			// Setup the dnd listeners
 			var dlg = div.parentNode;
-			var graph = editorUi.editor.graph;
 			var dropElt = null;
 
 			mxEvent.addListener(dlg, 'dragleave', function(evt)
@@ -6367,30 +6364,12 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 	};
 
 	var btns = document.createElement('div');
-	btns.style.marginTop = '18px';
-	btns.style.textAlign = 'center';
+	btns.style.marginTop = '16px';
+	btns.style.textAlign = 'right';
 
 	if (!editorUi.isOffline())
 	{
-		var link = document.createElement('a');
-		link.setAttribute('href', 'https://www.drawio.com/doc/faq/custom-links');
-		link.setAttribute('title', mxResources.get('help'));
-		link.setAttribute('target', '_blank');
-		link.style.marginLeft = '8px';
-		link.style.cursor = 'help';
-
-		var icon = document.createElement('img');
-		mxUtils.setOpacity(icon, 50);
-		icon.style.height = '16px';
-		icon.style.width = '16px';
-		icon.setAttribute('border', '0');
-		icon.setAttribute('valign', 'middle');
-		icon.style.marginTop = (mxClient.IS_IE11) ? '0px' : '-4px';
-		icon.setAttribute('src', Editor.helpImage);
-		link.appendChild(icon);
-		icon.className = 'geAdaptiveAsset';
-
-		btns.appendChild(link);
+		btns.appendChild(editorUi.createHelpIcon('https://www.drawio.com/doc/faq/custom-links'));
 	}
 
 	var cancelBtn = mxUtils.button(mxResources.get('cancel'), function()
@@ -6440,7 +6419,7 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 	selectDropdown.className = 'geBtn';
 	selectDropdown.style.position = 'relative';
 	selectDropdown.style.top = '1px';
-	selectDropdown.style.maxWidth = '100px';
+	selectDropdown.style.maxWidth = '120px';
 	var selectFn = {};
 
 	var option = document.createElement('option');
@@ -6580,15 +6559,11 @@ var LinkDialog = function(editorUi, initialValue, btnLabel, fn, showPages, showN
 		});
 	}
 
-	//TODO should Trello support this?
-
 	mxEvent.addListener(linkInput, 'keypress', function(e)
 	{
 		if (e.keyCode == 13)
 		{
-			editorUi.hideDialog();
-			var value = (pageRadio.checked) ? pageSelect.value : linkInput.value;
-			fn(value, LinkDialog.selectedDocs);
+			mainBtn.click();
 		}
 	});
 
@@ -9582,29 +9557,31 @@ var TagsWindow = function(editorUi, x, y, w, h)
 				if (newValue != null && newValue.length > 0)
 				{
 					var temp = newValue.split(' ');
+					var newTags = [];
 					var tags = [];
 
 					for (var i = 0; i < temp.length; i++)
 					{
 						var token = mxUtils.trim(temp[i]);
 
-						if (token != '' && mxUtils.indexOf(
-							allTags, token) < 0)
+						if (token != '')
 						{
 							tags.push(token);
+
+							if (mxUtils.indexOf(allTags, token) < 0)
+							{
+								newTags.push(token);
+							}
 						}
 					}
 
-					if (tags.length > 0)
+					if (graph.isSelectionEmpty())
 					{
-						if (graph.isSelectionEmpty())
-						{
-							updateFn(allTags.concat(tags));
-						}
-						else
-						{
-							graph.addTagsForCells(graph.getSelectionCells(), tags);
-						}
+						updateFn(allTags.concat(newTags));
+					}
+					else
+					{
+						graph.addTagsForCells(graph.getSelectionCells(), tags);
 					}
 				}
 			}, mxResources.get('tags'), null, null, 'https://www.drawio.com/blog/tags-in-diagrams');
@@ -12398,10 +12375,9 @@ var FontDialog = function(editorUi, curFontname, curUrl, curType, fn)
 	td.appendChild(label);
 
 	// Link to Google Fonts
-	if (!mxClient.IS_CHROMEAPP && (!editorUi.isOffline() || EditorUi.isElectronApp))
+	if (!editorUi.isOffline() || EditorUi.isElectronApp)
 	{
-		var link = editorUi.menus.createHelpLink('https://fonts.google.com/');
-		link.getElementsByTagName('img')[0].setAttribute('valign', 'middle');
+		var link = editorUi.createHelpIcon('https://fonts.google.com/');
 		td.appendChild(link);
 	}
 
@@ -13257,14 +13233,14 @@ var ConnectionPointsDialog = function(editorUi, cell)
 			return editingGraph.addCell(cPoint);
 		};
 
-		//Add cell and current connection points on it
+		// Add cell and current connection points on it
 		var geo = cell.geometry;
 		var mainCell = new mxCell(cell.value, new mxGeometry(0, 0, geo.width, geo.height),
 							cell.style + ';rotatable=0;resizable=0;connectable=0;editable=0;movable=0;fillColor=none;');
 		mainCell.vertex = true;
 		editingGraph.addCell(mainCell);
 
-		//Adding a point via double click
+		// Adding a point via double click
 		editingGraph.dblClick = function(evt, cell)
 		{
 			if (cell != null && cell != mainCell)
@@ -13293,14 +13269,15 @@ var ConnectionPointsDialog = function(editorUi, cell)
 		keyHandler.bindKey(46, removeCPoints);
 		keyHandler.bindKey(8, removeCPoints);
 
-		//Force rubberband inside the cell
+		// Force rubberband inside the cell
 		editingGraph.getRubberband().isForceRubberbandEvent = function(event)
 		{
-			//Left click and not a click on a connection point
-			return event.evt.button == 0 
-					&& (event.getCell() == null || event.getCell() == mainCell);
+			// Left click and not a click on a connection point
+			return event.evt.button == 0 &&
+				(event.getCell() == null ||
+				event.getCell() == mainCell);
 		};
-		//Force panning inside the cell
+		// Force panning inside the cell
 		editingGraph.panningHandler.isForcePanningEvent = function(event)
 		{
 			return event.evt.button == 2;
@@ -13688,20 +13665,15 @@ var ConnectionPointsDialog = function(editorUi, cell)
 		});
 
 		resetBtn.className = 'geBtn';
-
+		
 		var buttons = document.createElement('div');
 		buttons.style.marginTop = '10px';
 		buttons.style.textAlign = 'right';
 
 		if (!editorUi.isOffline())
 		{
-			var helpBtn = mxUtils.button(mxResources.get('help'), function()
-			{
-				editorUi.openLink('https://www.drawio.com/doc/faq/shape-connection-points-customise');
-			});
-
-			helpBtn.className = 'geBtn';
-			buttons.appendChild(helpBtn);
+			buttons.appendChild(editorUi.createHelpIcon(
+				'https://www.drawio.com/doc/faq/shape-connection-points-customise'));
 		}
 
 		if (editorUi.editor.cancelFirst)