From 71d33081aaf24db12906ec3069270a9df018fa2b Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Fri, 25 Feb 2022 23:01:32 +0530
Subject: [PATCH] fix: org chart connectors not rendered when Employee Naming
 is set to Full Name (#29997)

---
 .../js/hierarchy_chart/hierarchy_chart_desktop.js  | 14 ++++++++------
 .../js/hierarchy_chart/hierarchy_chart_mobile.js   |  9 +++++----
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/erpnext/public/js/hierarchy_chart/hierarchy_chart_desktop.js b/erpnext/public/js/hierarchy_chart/hierarchy_chart_desktop.js
index 831626aa91..a585aa614f 100644
--- a/erpnext/public/js/hierarchy_chart/hierarchy_chart_desktop.js
+++ b/erpnext/public/js/hierarchy_chart/hierarchy_chart_desktop.js
@@ -304,12 +304,13 @@ erpnext.HierarchyChart = class {
 	}
 
 	get_child_nodes(node_id) {
+		let me = this;
 		return new Promise(resolve => {
 			frappe.call({
-				method: this.method,
+				method: me.method,
 				args: {
 					parent: node_id,
-					company: this.company
+					company: me.company
 				}
 			}).then(r => resolve(r.message));
 		});
@@ -350,12 +351,13 @@ erpnext.HierarchyChart = class {
 	}
 
 	get_all_nodes() {
+		let me = this;
 		return new Promise(resolve => {
 			frappe.call({
 				method: 'erpnext.utilities.hierarchy_chart.get_all_nodes',
 				args: {
-					method: this.method,
-					company: this.company
+					method: me.method,
+					company: me.company
 				},
 				callback: (r) => {
 					resolve(r.message);
@@ -427,8 +429,8 @@ erpnext.HierarchyChart = class {
 
 	add_connector(parent_id, child_id) {
 		// using pure javascript for better performance
-		const parent_node = document.querySelector(`#${parent_id}`);
-		const child_node = document.querySelector(`#${child_id}`);
+		const parent_node = document.getElementById(`${parent_id}`);
+		const child_node = document.getElementById(`${child_id}`);
 
 		let path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
 
diff --git a/erpnext/public/js/hierarchy_chart/hierarchy_chart_mobile.js b/erpnext/public/js/hierarchy_chart/hierarchy_chart_mobile.js
index 0a8ba78f64..52236e7df9 100644
--- a/erpnext/public/js/hierarchy_chart/hierarchy_chart_mobile.js
+++ b/erpnext/public/js/hierarchy_chart/hierarchy_chart_mobile.js
@@ -235,7 +235,7 @@ erpnext.HierarchyChartMobile = class {
 		let me = this;
 		return new Promise(resolve => {
 			frappe.call({
-				method: this.method,
+				method: me.method,
 				args: {
 					parent: node_id,
 					company: me.company,
@@ -286,8 +286,8 @@ erpnext.HierarchyChartMobile = class {
 	}
 
 	add_connector(parent_id, child_id) {
-		const parent_node = document.querySelector(`#${parent_id}`);
-		const child_node = document.querySelector(`#${child_id}`);
+		const parent_node = document.getElementById(`${parent_id}`);
+		const child_node = document.getElementById(`${child_id}`);
 
 		const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
 
@@ -518,7 +518,8 @@ erpnext.HierarchyChartMobile = class {
 		level.nextAll('li').remove();
 
 		let node_object = this.nodes[node.id];
-		let current_node = level.find(`#${node.id}`).detach();
+		let current_node = level.find(`[id="${node.id}"]`).detach();
+
 		current_node.removeClass('active-child active-path');
 
 		node_object.expanded = 0;