Ensure unique selectors for loaded extension files

f869b26664516c6a67068c69d3a765c3c5c817b2

Cohee <18619528+Cohee1207@users.noreply.github.com>

2 files changed, +17 -5Showing whitespace changes
public/scripts/extensions.js+7 -5
@@ -4,7 +4,7 @@ import { eventSource, event_types, saveSettings, saveSettingsDebounced, getReque
44import { showLoader } from './loader.js';
55import { POPUP_RESULT, POPUP_TYPE, Popup, callGenericPopup } from './popup.js';
66import { renderTemplate, renderTemplateAsync } from './templates.js';
77import { delay, isSubsetOf, sanitizeSelector, setValueByPath } from './utils.js';
88import { getContext } from './st-context.js';
99import { isAdmin } from './user.js';
1010import { t } from './i18n.js';
@@ -509,10 +509,11 @@ function addExtensionStyle(name, manifest) {
509509
510510 return new Promise((resolve, reject) => {
511511 const url = `/scripts/extensions/${name}/${manifest.css}`;
512+ const id = sanitizeSelector(`${name}-css`);
512513
513514 if ($(`link[id="${nameid}"]`).length === 0) {
514515 const link = document.createElement('link');
515516 link.id = nameid;
516517 link.rel = 'stylesheet';
517518 link.type = 'text/css';
518519 link.href = url;
@@ -540,11 +541,12 @@ function addExtensionScript(name, manifest) {
540541
541542 return new Promise((resolve, reject) => {
542543 const url = `/scripts/extensions/${name}/${manifest.js}`;
544+ const id = sanitizeSelector(`${name}-js`);
543545 let ready = false;
544546
545547 if ($(`script[id="${nameid}"]`).length === 0) {
546548 const script = document.createElement('script');
547549 script.id = nameid;
548550 script.type = 'module';
549551 script.src = url;
550552 script.async = true;
public/scripts/utils.js+10 -0
@@ -67,6 +67,16 @@ export function escapeHtml(str) {
6767 return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
6868}
6969
70+/**
71+ * Make string safe for use as a CSS selector.
72+ * @param {string} str String to sanitize
73+ * @param {string} replacement Replacement for invalid characters
74+ * @returns {string} Sanitized string
75+ */
76+export function sanitizeSelector(str, replacement = '_') {
77+ return String(str).replace(/[^a-z0-9_-]/ig, replacement);
78+}
79+
7080export function isValidUrl(value) {
7181 try {
7282 new URL(value);