fix 3078: ensure proper namespace for title attr

Browsers may not always render the <title> inside SVG as a tooltip.
Ensuring it has a correct namespace improves the cross browser behavior

Closes #3078

Signed-off-by: Nizamudeen A <[email protected]>

Author: nizamial09

src/icon/icon.directive.ts

@@ -81,7 +81,8 @@ export class IconDirective implements AfterViewInit, OnChanges {
 		}
 
 		const svg = root.tagName.toUpperCase() !== "SVG" ? svgElement : root;
-		svg.setAttribute("xmlns", "http://www.w3.org/2000/svg");
+		const xmlns = "http://www.w3.org/2000/svg";
+		svg.setAttribute("xmlns", xmlns);
 
 		const attributes = getAttributes({
 			width: icon.attrs.width,
@@ -110,7 +111,7 @@ export class IconDirective implements AfterViewInit, OnChanges {
 		}
 
 		if (attributes["title"]) {
-			const title = document.createElement("title");
+			const title = document.createElementNS(xmlns, "title");
 			title.textContent = attributes.title;
 			IconDirective.titleIdCounter++;
 			title.setAttribute("id", `${icon.name}-title-${IconDirective.titleIdCounter}`);