Skip to content

feat(web): HTML sanitization - #680

Merged
hejsztynx merged 14 commits into
mainfrom
@ksienkiewicz/feat-html-sanitization
Jul 27, 2026
Merged

feat(web): HTML sanitization#680
hejsztynx merged 14 commits into
mainfrom
@ksienkiewicz/feat-html-sanitization

Conversation

@hejsztynx

@hejsztynx hejsztynx commented Jul 6, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • implemented sanitization on all ends of the EnrichedTextInput and EnrichedText
  • we were allowing all custom mention attributes names, inluding potentially malicious ones. Now the attributes are sanitized and if one doesn't start with the data- prefix, we print a runtime warning that it might get stripped by a sanitizer
  • the 'default' mention style functionality wasn't documented
  • the normalizer let through only a predefined set of mention attributes: id, text and indicator - now it allows every custom attribute
  • implemented a new web-only prop sanitizationConfig, currently with only linkRegex field, allowing to persist custom links which would be otherwise stripped by the sanitizer

Test 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

OS Implemented
iOS
Android
Web

Checklist

  • E2E tests are passing
  • Required E2E tests have been added (if applicable)

Copilot AI review requested due to automatic review settings July 6, 2026 11:40
@hejsztynx
hejsztynx marked this pull request as draft July 6, 2026 11:40

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Comment thread src/web/normalization/tiptapHtmlNormalizer.ts Outdated
Comment thread docs/WEB.md Outdated
Comment thread docs/INPUT_API_REFERENCE.md Outdated
Comment thread src/web/__tests__/sanitization.test.ts
@hejsztynx
hejsztynx marked this pull request as ready for review July 6, 2026 12:17
Comment thread src/web/normalization/tiptapHtmlNormalizer.ts Outdated

@exploIF exploIF left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Comment thread src/web/__tests__/sanitization.test.ts
@hejsztynx
hejsztynx marked this pull request as draft July 22, 2026 12:30
hejsztynx and others added 4 commits July 27, 2026 12:06
# Summary

Both components `EnrichedText` and `EnrichedTextInput` are using DOM -
`DOMPurify`, `DOMParser`, `TipTap`. An attempt of rendering them in a
non-browser environment, e.g. in SSR applications, would result in a
crash. Only `DOMParser` availability check was present, but it was
silent. Now we check for the browser environment before any other
component logic and throw a proper error. Documentation was also
updated, to explicitly point the client-only nature of the components.

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| iOS     |    ❌     |
| Android |    ❌     |
| Web     |    ✅     |

## Checklist

- [x] E2E tests are passing
- [ ] Required E2E tests have been added (if applicable)
@hejsztynx
hejsztynx marked this pull request as ready for review July 27, 2026 11:06
@hejsztynx
hejsztynx requested review from exploIF and szydlovsky July 27, 2026 11:07
Comment thread apps/example-web/src/components/TextRenderer.tsx Outdated
Comment thread apps/example-web/src/App.tsx Outdated

@szydlovsky szydlovsky left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

:shipit:

@hejsztynx
hejsztynx merged commit 3e82fe6 into main Jul 27, 2026
9 checks passed
@hejsztynx
hejsztynx deleted the @ksienkiewicz/feat-html-sanitization branch July 27, 2026 13:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants