fix(zen-settings): sanitize properties and theme name to prevent css issues

This commit is contained in:
Bryan Galdámez 2024-09-14 16:44:21 -06:00
parent d7715eb754
commit 9c29cf23e7

View file

@ -118,10 +118,10 @@ var gZenThemeImporter = new (class {
_getBrowser() { _getBrowser() {
if (!this.__browser) { if (!this.__browser) {
this.__browser = Services.wm.getMostRecentWindow("navigator:browser") this.__browser = Services.wm.getMostRecentWindow('navigator:browser');
} }
return this.__browser return this.__browser;
} }
async _getThemePreferences(theme) { async _getThemePreferences(theme) {
@ -134,7 +134,7 @@ var gZenThemeImporter = new (class {
let preferences = await IOUtils.readJSON(themePath); let preferences = await IOUtils.readJSON(themePath);
// skip transformation, we won't be writing old preferences to dom, all of them can only be checkboxes // skip transformation, we won't be writing old preferences to dom, all of them can only be checkboxes
if (typeof preferences === "object" && !Array.isArray(preferences)) { if (typeof preferences === 'object' && !Array.isArray(preferences)) {
return { preferences: [], areOldPreferences: true }; return { preferences: [], areOldPreferences: true };
} }
@ -142,16 +142,17 @@ var gZenThemeImporter = new (class {
} }
async writeToDom() { async writeToDom() {
const browser = this._getBrowser() const browser = this._getBrowser();
for (const theme of Object.values(await this.getThemes())) { for (const theme of Object.values(await this.getThemes())) {
const { preferences, areOldPreferences } = await this._getThemePreferences(theme); const { preferences, areOldPreferences } = await this._getThemePreferences(theme);
const sanitizedName = theme.name?.replaceAll(/\s/g, '-')?.replaceAll(/[^A-z_-]+/g, '');
if (!theme.enabled) { if (!theme.enabled) {
const element = browser.document.getElementById(theme.name); const element = browser.document.getElementById(sanitizedName);
if (element) { if (element) {
element.remove() element.remove();
} }
continue; continue;
@ -161,24 +162,24 @@ var gZenThemeImporter = new (class {
continue; continue;
} }
const themePreferences = preferences.filter(({ type }) => type === "dropdown") const themePreferences = preferences.filter(({ type }) => type === 'dropdown');
for (const { property } of themePreferences) { for (const { property } of themePreferences) {
const value = Services.prefs.getStringPref(property, "") const value = Services.prefs.getStringPref(property, '');
if (value !== "") { if (value !== '') {
let element = browser.document.getElementById(theme.name) let element = browser.document.getElementById(sanitizedName);
if (!element) { if (!element) {
element = browser.document.createElement("div") element = browser.document.createElement('div');
element.style.display = "none" element.style.display = 'none';
element.setAttribute("id", theme.name) element.setAttribute('id', sanitizedName);
browser.document.body.appendChild(element) browser.document.body.appendChild(element);
} }
element.setAttribute(property, value) element.setAttribute(property?.replaceAll(/\./g, '-'), value);
} }
} }
} }