@@ -1081,15 +1081,15 @@ function createRelationshipDisplay() {
10811081 <div class="relationship-item">
10821082 <div class="parent">
10831083 <span class="relationship-label">Primary:</span>
1084- <a href="/paths/${ parentId } " class="badge badge-primary">${ parentId } </a>
1085- <span class="path-name">${ parentName } </span>
1084+ <a href="/paths/${ escapeHtml ( parentId ) } " class="badge badge-primary">${ escapeHtml ( parentId ) } </a>
1085+ <span class="path-name">${ escapeHtml ( parentName ) } </span>
10861086 </div>
10871087 <div class="children">
10881088 ${ children . map ( child => `
10891089 <div class="variant-row">
10901090 <span class="relationship-label">Variant:</span>
1091- <a href="/paths/${ child . id } " class="badge badge-derivative">${ child . id } </a>
1092- <span class="path-name">${ child . name } </span>
1091+ <a href="/paths/${ escapeHtml ( child . id ) } " class="badge badge-derivative">${ escapeHtml ( child . id ) } </a>
1092+ <span class="path-name">${ escapeHtml ( child . name ) } </span>
10931093 </div>
10941094 ` ) . join ( '' ) }
10951095 </div>
@@ -1100,6 +1100,14 @@ function createRelationshipDisplay() {
11001100 container . innerHTML = html ;
11011101}
11021102
1103+ // Helper function to escape HTML and prevent XSS
1104+ function escapeHtml ( text ) {
1105+ if ( ! text ) return '' ;
1106+ const div = document . createElement ( 'div' ) ;
1107+ div . textContent = text ;
1108+ return div . innerHTML ;
1109+ }
1110+
11031111// Create network graph visualization
11041112function createRelationshipNetwork ( ) {
11051113 const container = document . getElementById ( 'network-container' ) ;
0 commit comments