Refactor initRepoBranchTagSelector using the new registerGlobalInitFunc

Author: kerwin612

templates/repo/branch_dropdown.tmpl

@@ -14,7 +14,7 @@
 
 Search "repo/branch_dropdown" in the template directory to find all occurrences.
 */}}
-<div class="js-branch-tag-selector {{if .ContainerClasses}}{{.ContainerClasses}}{{end}}"
+<div class="js-branch-tag-selector data-global-init="initRepoBranchTagSelector" {{if .ContainerClasses}}{{.ContainerClasses}}{{end}}"
 	data-text-release-compare="{{ctx.Locale.Tr "repo.release.compare"}}"
 	data-text-branches="{{ctx.Locale.Tr "repo.branches"}}"
 	data-text-tags="{{ctx.Locale.Tr "repo.tags"}}"

web_src/js/features/repo-legacy.ts

@@ -1,3 +1,4 @@
+import {registerGlobalInitFunc} from '../modules/observer.ts';
 import {
   initRepoCommentFormAndSidebar,
   initRepoIssueBranchSelect, initRepoIssueCodeCommentCancel, initRepoIssueCommentDelete,
@@ -20,10 +21,10 @@ import {initRepoNew} from './repo-new.ts';
 import {createApp} from 'vue';
 import RepoBranchTagSelector from '../components/RepoBranchTagSelector.vue';
 
-function initRepoBranchTagSelector(selector: string) {
-  for (const elRoot of document.querySelectorAll(selector)) {
-    createApp(RepoBranchTagSelector, {elRoot}).mount(elRoot);
-  }
+function initRepoBranchTagSelector() {
+  registerGlobalInitFunc('initRepoBranchTagSelector', async (el: HTMLInputElement) => {
+    createApp(RepoBranchTagSelector, {el}).mount(el);
+  });
 }
 
 export function initBranchSelectorTabs() {
@@ -42,7 +43,7 @@ export function initRepository() {
   const pageContent = document.querySelector('.page-content.repository');
   if (!pageContent) return;
 
-  initRepoBranchTagSelector('.js-branch-tag-selector');
+  initRepoBranchTagSelector();
   initRepoCommentFormAndSidebar();
 
   // Labels