Make frontend CSS color validation Chromium-only (remove DOM style fallback)#2946
Make frontend CSS color validation Chromium-only (remove DOM style fallback)#2946
Conversation
Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>
Deploying waveterm with
|
| Latest commit: |
e3a3c73
|
| Status: | ⚡️ Build in progress... |
Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>
![kilo-code-bot[bot]](https://avatars.githubusercontent.com/in/2193792?s=60&v=4){kind=small}
frontend/util/color-validator.ts
Outdated
| const temp = document.createElement("div"); | ||
| temp.style.color = ""; | ||
| temp.style.color = color; | ||
| return temp.style.color != ""; |
There was a problem hiding this comment.
WARNING: Use strict equality operator
Should use !== instead of != when comparing to empty string. The project uses != only for null/undefined checks, not for string comparisons.
| return temp.style.color != ""; | |
| return temp.style.color !== ""; |
frontend/util/color-validator.ts
Outdated
| throw new Error(`Invalid CSS color: ${String(color)}`); | ||
| } | ||
| const normalizedColor = color.trim(); | ||
| if (normalizedColor == "" || !isValidCssColor(normalizedColor)) { |
There was a problem hiding this comment.
WARNING: Use strict equality operator
Should use === instead of == when comparing to empty string. The project uses == only for null/undefined checks, not for string comparisons.
| if (normalizedColor == "" || !isValidCssColor(normalizedColor)) { | |
| if (normalizedColor === "" || !isValidCssColor(normalizedColor)) { |
Code Review SummaryStatus: No New Issues Found | Recommendation: Address existing comments before merge NoteAll issues in this PR have already been identified in previous comments (strict equality operators on lines 9 and 46 of Files Reviewed (3 files)
|
Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>
| const NamedColorRegex = /^[a-z]+$/i; | ||
|
|
||
| function isValidCssColor(color: string): boolean { | ||
| if (typeof CSS == "undefined" || typeof CSS.supports != "function") { |
There was a problem hiding this comment.
WARNING: Use strict equality operators
Use === instead of == and !== instead of != for type-safe comparisons.
| if (typeof CSS == "undefined" || typeof CSS.supports != "function") { | |
| if (typeof CSS === "undefined" || typeof CSS.supports !== "function") { |
| } | ||
|
|
||
| export function validateCssColor(color: string): string { | ||
| if (typeof color != "string") { |
There was a problem hiding this comment.
WARNING: Use strict equality operator
Use !== instead of != for type-safe comparison.
| if (typeof color != "string") { | |
| if (typeof color !== "string") { |
The new color validator is used exclusively in the Electron/Chromium frontend, so fallback parsing via temporary DOM elements is unnecessary. This update tightens the implementation to rely on the browser-native CSS capability check only.
Scope
validateCssColor(color: string): stringbehavior unchanged (returns normalized type for valid colors, throws on invalid).Implementation
frontend/util/color-validator.tsisValidCssColornow exclusively uses:CSS.supports("color", color)document.createElement(...).style.colorassignment/parsing.Behavioral contract (unchanged)
hex,hex8,rgb,rgba,hsl,keyword, etc.).Error("Invalid CSS color: ...").✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.