utils.js: Optimize performance of getCSSPath()

public/js/icinga/utils.js

@@ -371,16 +371,20 @@
             var path = [];
 
             while (true) {
-                var id = element.getAttribute("id");
+                let id = element.id;
+                if (typeof id !== 'undefined' && typeof id !== 'string') {
+                    // Sometimes there may be a form element with the name "id"
+                    id = element.getAttribute("id");
+                }
 
+                if (!! id) {
                     // Only use ids if they're truly unique
-                // TODO: The check used to use document.querySelectorAll, but this resulted in many issues with ids
+                    let results = document.querySelectorAll('* #' + this.escapeCSSSelector(id));
-                //       that start with a decimal. jQuery seems to escape those correctly, so this is the only reason
+                    if (results.length === 1) {
-                //       why it's still.. jQuery.
-                if (!! id && $('* #' + id).length === 1) {
                         path.push('#' + id);
                         break;
                     }
+                }
 
                 var tagName = element.tagName;
                 var parent = element.parentElement;
@@ -409,6 +413,20 @@
             return path.reverse().join(' > ');
         },
 
+        /**
+         * Escape the given string to be used in a CSS selector
+         *
+         * @param {string} selector
+         * @returns {string}
+         */
+        escapeCSSSelector: function (selector) {
+            if (typeof CSS !== 'undefined' && typeof CSS.escape === 'function') {
+                return CSS.escape(selector);
+            }
+
+            return selector.replaceAll(/^(\d)/, '\\\\3$1 ');
+        },
+
         /**
          * Climbs up the given dom path and returns the element
          *