From aa36989bd00e8069c0a546c4753e533cefa06a7f Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Sat, 27 Jul 2024 16:44:41 +0200
Subject: [PATCH] Enable `no-jquery/no-parse-html-literal` and fix violation
 (#31684)

Tested it, path segment creation works just like before.
---
 .eslintrc.yaml                     |  2 +-
 web_src/js/features/repo-editor.ts | 12 ++++++++----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/.eslintrc.yaml b/.eslintrc.yaml
index 65c897c91..1664e4308 100644
--- a/.eslintrc.yaml
+++ b/.eslintrc.yaml
@@ -568,7 +568,7 @@ rules:
   no-jquery/no-param: [2]
   no-jquery/no-parent: [0]
   no-jquery/no-parents: [2]
-  no-jquery/no-parse-html-literal: [0]
+  no-jquery/no-parse-html-literal: [2]
   no-jquery/no-parse-html: [2]
   no-jquery/no-parse-json: [2]
   no-jquery/no-parse-xml: [2]
diff --git a/web_src/js/features/repo-editor.ts b/web_src/js/features/repo-editor.ts
index 8bf23fc60..dadbd802b 100644
--- a/web_src/js/features/repo-editor.ts
+++ b/web_src/js/features/repo-editor.ts
@@ -1,7 +1,7 @@
 import $ from 'jquery';
 import {htmlEscape} from 'escape-goat';
 import {createCodeEditor} from './codeeditor.ts';
-import {hideElem, queryElems, showElem} from '../utils/dom.ts';
+import {hideElem, queryElems, showElem, createElementFromHTML} from '../utils/dom.ts';
 import {initMarkupContent} from '../markup/content.ts';
 import {attachRefIssueContextPopup} from './contextpopup.ts';
 import {POST} from '../modules/fetch.ts';
@@ -61,7 +61,7 @@ export function initRepoEditor() {
     });
   }
 
-  const filenameInput = document.querySelector('#file-name');
+  const filenameInput = document.querySelector<HTMLInputElement>('#file-name');
   function joinTreePath() {
     const parts = [];
     for (const el of document.querySelectorAll('.breadcrumb span.section')) {
@@ -80,8 +80,12 @@ export function initRepoEditor() {
         const value = parts[i];
         if (i < parts.length - 1) {
           if (value.length) {
-            $(`<span class="section"><a href="#">${htmlEscape(value)}</a></span>`).insertBefore($(filenameInput));
-            $('<div class="breadcrumb-divider">/</div>').insertBefore($(filenameInput));
+            filenameInput.before(createElementFromHTML(
+              `<span class="section"><a href="#">${htmlEscape(value)}</a></span>`,
+            ));
+            filenameInput.before(createElementFromHTML(
+              `<div class="breadcrumb-divider">/</div>`,
+            ));
           }
         } else {
           filenameInput.value = value;