Improved robustness of SVG attribute matching

js/artInfrastructure.js

@@ -98,24 +98,31 @@ App.Art.SvgQueue = class {
 		 * @param {NamedNodeMap} right
 		 */
 		function equalAttributes(left, right) {
-			/** get all the attribute names from an attribute list and sort them
+			/** get all the attribute names from an attribute list
 			 * @param {NamedNodeMap} attrs
 			 * @returns {string[]}
 			 */
-			function sortedAttrNames(attrs) {
+			function attrNames(attrs) {
 				let names = [];
 				for (let index = 0; index < attrs.length; ++index) {
 					names.push(attrs[index].nodeName);
 				}
-				names.sort();
 				return names;
 			}
 
-			if (typeof(left) !== typeof(right)) {
-				return false;
+			if (!left && !right) {
+				return true; // both are nullish, treat as equal
+			} else if (!left || !right) {
+				return false; // only one is nullish, not equal
 			}
-			const allNames = _.union(sortedAttrNames(left), sortedAttrNames(right));
-			return allNames.every((attr) => left[attr].nodeValue === right[attr].nodeValue);
+
+			const leftNames = attrNames(left), rightNames = attrNames(right);
+			const intersectionLength = _.intersection(leftNames, rightNames).length;
+			if (leftNames.length !== intersectionLength || rightNames.length !== intersectionLength) {
+				return false; // contain different attributes, not equal
+			}
+			// are all values equal?
+			return leftNames.every((attr) => left.getNamedItem(attr).nodeValue === right.getNamedItem(attr).nodeValue);
 		}
 
 		let frag = document.createDocumentFragment();