Potential fix for code scanning alert no. 116: DOM text reinterpreted as HTML #10754
Conversation
… as HTML Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
WalkthroughThis change introduces the Changes
Sequence Diagram(s)sequenceDiagram
participant User as User
participant Modal as AvatarEditModal
participant Purify as DOMPurify
User->>Modal: Upload file via input event
activate Modal
Modal->>Modal: Store selected file in variable
Modal->>Modal: Check if file is a valid image type
Modal->>Modal: Generate image preview URL
alt URL starts with "blob:"
Modal->>Purify: Sanitize preview URL
Purify-->>Modal: Return sanitized URL
else
Modal->>Modal: Use original imageUrl
end
deactivate Modal
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
✨ Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
Deploying care-fe with
|
| Latest commit: |
c5088fb
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://744398a5.care-fe.pages.dev |
| Branch Preview URL: | https://alert-autofix-116.care-fe.pages.dev |
Deploying care-fe with
|
| Latest commit: |
738a005
|
| Status: | ⚡️ Build in progress... |
Deploying care-fe with
|
| Latest commit: |
738a005
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://e1a80d44.care-fe.pages.dev |
| Branch Preview URL: | https://alert-autofix-116.care-fe.pages.dev |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/components/Common/AvatarEditModal.tsx (2)
220-224: Simplify the condition using optional chaining.The condition can be simplified for better readability.
-preview && preview.startsWith("blob:") +preview?.startsWith("blob:")🧰 Tools
🪛 Biome (1.9.4)
[error] 221-221: Change to an optional chain.
Unsafe fix: Change to an optional chain.
(lint/complexity/useOptionalChain)
380-380: Consider sanitizing webcam preview for consistency.While the webcam preview comes from a trusted source, consider sanitizing it for consistency with other image sources and defense in depth.
-<img src={previewImage} /> +<img src={DOMPurify.sanitize(previewImage ?? "")} />
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/components/Common/AvatarEditModal.tsx(3 hunks)
🧰 Additional context used
🪛 Biome (1.9.4)
src/components/Common/AvatarEditModal.tsx
[error] 221-221: Change to an optional chain.
Unsafe fix: Change to an optional chain.
(lint/complexity/useOptionalChain)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: cypress-run (1)
- GitHub Check: OSSAR-Scan
- GitHub Check: Cloudflare Pages: care-fe
🔇 Additional comments (2)
src/components/Common/AvatarEditModal.tsx (2)
1-1: LGTM! Good choice of sanitization library.Adding DOMPurify is a good security practice for sanitizing HTML content.
135-141: LGTM! Improved file handling logic.The changes enhance code readability by storing the file in a variable and performing type checking before setting it.
CARE
|
||||||||||||||||||||||||||||
| Project |
CARE
|
| Branch Review |
alert-autofix-116
|
| Run status |
|
| Run duration | 07m 03s |
| Commit |
|
| Committer | Rithvik Nishad |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
Failures
|
0
|
Flaky
|
0
|
Pending
|
0
|
Skipped
|
0
|
Passing
|
11
|
| View all changes introduced in this branch ↗︎ | |
Potential fix for https://github.com/ohcnetwork/care_fe/security/code-scanning/116
To fix the problem, we need to ensure that the content being used in the
srcattribute of theimgtag is safe. One way to do this is to validate the file type and ensure it is an image before creating the object URL. Additionally, we can add a check to ensure that thepreviewvariable contains a valid URL.selectedFile.previewvariable contains a valid URL before using it in thesrcattribute of theimgtag.Suggested fixes powered by Copilot Autofix. Review carefully before merging.
Summary by CodeRabbit
New Features
Refactor