feat(web): HTML sanitization#680
Conversation
There was a problem hiding this comment.
Pull request overview
This PR introduces automatic HTML sanitization for the web implementation to reduce XSS/paste-attack risk, and tightens/sanitizes custom <mention> attributes passed through the web input APIs.
Changes:
- Add a DOMPurify-backed sanitizer utility plus mention-attribute sanitization + runtime warnings for non‑
data-*custom attributes. - Sanitize HTML at major web input/output boundaries for TipTap (defaultValue/setValue/paste and getHTML/onChangeHtml).
- Update docs, example usage, and an E2E link test to align with the new sanitization behavior.
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| src/web/sanitization/htmlSanitizer.ts | Introduces sanitizeHtml, mention attribute sanitization, and attribute warning helper. |
| src/web/normalization/tiptapHtmlNormalizer.ts | Applies sanitization to TipTap HTML ingress/egress normalization. |
| src/web/EnrichedTextInput.tsx | Sanitizes/warns on mention attributes before inserting a mention. |
| src/web/tests/mentionSanitization.test.ts | Adds unit tests for mention attribute sanitization and sanitizer behavior. |
| docs/WEB.md | Updates web docs to describe automatic sanitization and mention attribute guidance. |
| docs/INPUT_API_REFERENCE.md | Documents 'default' mention style fallback behavior. |
| apps/example-web/src/App.tsx | Updates example mention attributes to use data-*. |
| .playwright/tests/links.spec.ts | Adjusts link copy/paste test data to a sanitizer-friendly URL. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
exploIF
left a comment
There was a problem hiding this comment.
In general looks good. However custom domains support is a blocker from my perspective. Happy to discuss potential solutions, but we should at least give an option for the users
| it('strips unknown protocol URLs from links', () => { | ||
| const out = sanitizeHtml('<a href="custom://link">x</a>'); | ||
| expect(out).not.toContain('custom'); | ||
| }); |
There was a problem hiding this comment.
This is pretty important limitation, as such values are totally valid urls in mobile environment (including web browser on mobile devices). We should consider adding such support somehow
Summary
EnrichedTextInputandEnrichedTextdata-prefix, we print a runtime warning that it might get stripped by a sanitizer'default'mention style functionality wasn't documentedmentionattributes:id,textandindicator- now it allows every custom attributeTest Plan
Try to create a mention with an illegal HTML attribute, eg.
onClick. It should be stripped and a suitable console warning should be visible.Compatibility
Checklist