JedWatson / JedWatson/react-select
[V2] Request/Bug: Needs CSP Considerations
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 28k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
We use a pretty strict CSP which doesn't allow unsafe-inline for style-src. Therefore, when we try to use react-select we get the following errors (and an un-styled react-select component):
Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
Unfortunately this is blocking us from using this wonderful component!
I noticed this old issue: https://github.com/JedWatson/react-select/issues/2030, but the props autosize and inputProps have been removed in v2.
EDIT: It looks maybe the best way to add support for this is by using create-emotion which includes the ability to use a single <style> tag with a nonce attribute?
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the react-select styling path and the create-emotion documentation for its nonce option. Confirm the approach supports a strict CSP without style-src 'unsafe-inline' and that react-select remains styled when used under that policy.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend, security
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100