FIX: replace prefixCSS with prefixElementColors (#18556)
Instead of having `prefixCSS`, only `prefixElementColors` are available to reduce chances of exposing XSS.
This commit is contained in:
parent
7f167de10b
commit
58e4b43fe4
|
@ -13,8 +13,8 @@
|
|||
@model={{sectionLink.model}}
|
||||
@prefixType={{sectionLink.prefixType}}
|
||||
@prefixValue={{sectionLink.prefixValue}}
|
||||
@prefixCSS={{sectionLink.prefixCSS}}
|
||||
@prefixColor={{sectionLink.prefixColor}} >
|
||||
@prefixColor={{sectionLink.prefixColor}}
|
||||
@prefixElementColors={{sectionLink.prefixElementColors}} >
|
||||
</Sidebar::SectionLink>
|
||||
{{/each}}
|
||||
|
||||
|
|
|
@ -15,9 +15,8 @@
|
|||
{{/if}}
|
||||
|
||||
{{#if (eq @prefixType "span")}}
|
||||
<span style={{html-safe @prefixCSS}} class="prefix-span"></span>
|
||||
<span style={{html-safe (concat "background: linear-gradient(90deg, " @prefixElementColors ")")}} class="prefix-span"></span>
|
||||
{{/if}}
|
||||
|
||||
{{#if @prefixBadge}}
|
||||
{{d-icon @prefixBadge class="prefix-badge"}}
|
||||
{{/if}}
|
||||
|
|
|
@ -6,7 +6,8 @@
|
|||
@prefixType={{@prefixType}}
|
||||
@prefixValue={{@prefixValue}}
|
||||
@prefixCSSClass={{@prefixCSSClass}}
|
||||
@prefixCSS={{this.prefixCSS}}
|
||||
@prefixColor={{this.prefixColor}}
|
||||
@prefixElementColors={{this.prefixElementColors}}
|
||||
@prefixBadge={{@prefixBadge}}
|
||||
/>
|
||||
|
||||
|
@ -28,8 +29,8 @@
|
|||
@prefixType={{@prefixType}}
|
||||
@prefixValue={{@prefixValue}}
|
||||
@prefixCSSClass={{@prefixCSSClass}}
|
||||
@prefixCSS={{this.prefixCSS}}
|
||||
@prefixColor={{this.prefixColor}}
|
||||
@prefixElementColors={{this.prefixElementColors}}
|
||||
@prefixBadge={{@prefixBadge}}
|
||||
/>
|
||||
|
||||
|
|
|
@ -51,7 +51,13 @@ export default class SectionLink extends Component {
|
|||
return "#" + color;
|
||||
}
|
||||
|
||||
get prefixCSS() {
|
||||
return this.args.prefixCSS;
|
||||
get prefixElementColors() {
|
||||
const prefixElementColors = this.args.prefixElementColors.filter((color) =>
|
||||
color?.match(/^\w{6}$/)
|
||||
);
|
||||
if (prefixElementColors.length === 1) {
|
||||
prefixElementColors.push(prefixElementColors[0]);
|
||||
}
|
||||
return prefixElementColors.map((color) => `#${color} 50%`).join(", ");
|
||||
}
|
||||
}
|
||||
|
|
|
@ -19,8 +19,8 @@
|
|||
@prefixBadge={{sectionLink.prefixBadge}}
|
||||
@prefixType={{sectionLink.prefixType}}
|
||||
@prefixValue={{sectionLink.prefixValue}}
|
||||
@prefixCSS={{sectionLink.prefixCSS}}
|
||||
@prefixColor={{sectionLink.prefixColor}} >
|
||||
@prefixColor={{sectionLink.prefixColor}}
|
||||
@prefixElementColors={{sectionLink.prefixElementColors}} >
|
||||
</Sidebar::SectionLink>
|
||||
{{/each}}
|
||||
{{else}}
|
||||
|
|
|
@ -52,12 +52,8 @@ export default class CategorySectionLink {
|
|||
return "span";
|
||||
}
|
||||
|
||||
get prefixCSS() {
|
||||
if (this.category.parentCategory) {
|
||||
return `background: linear-gradient(90deg, #${this.category.parentCategory.color} 50%, #${this.category.color} 50%)`;
|
||||
} else {
|
||||
return `background: #${this.category.color}`;
|
||||
}
|
||||
get prefixElementColors() {
|
||||
return [this.category.parentCategory?.color, this.category.color];
|
||||
}
|
||||
|
||||
get prefixColor() {
|
||||
|
|
|
@ -197,7 +197,7 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) {
|
|||
|
||||
assert.ok(
|
||||
exists(
|
||||
`.sidebar-section-link-${category1.slug} .sidebar-section-link-prefix .prefix-span[style="background: #${category1.color}"]`
|
||||
`.sidebar-section-link-${category1.slug} .sidebar-section-link-prefix .prefix-span[style="background: linear-gradient(90deg, #${category1.color} 50%, #${category1.color} 50%)"]`
|
||||
),
|
||||
"category1 section link is rendered with solid prefix icon color"
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue