Skip to content

Commit

Permalink
docs: add info about CSP compliance
Browse files Browse the repository at this point in the history
  • Loading branch information
ghiscoding committed Nov 10, 2023
1 parent c90b9c1 commit 87954c7
Showing 1 changed file with 21 additions and 0 deletions.
21 changes: 21 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,27 @@ New Multiple-Select Options:
- `showOkButton` to add an "OK" button at the end of the multiple select option list (see [demo](https://ghiscoding.github.io/multiple-select-vanilla/#/options25))
- `showSearchClear` show a clear button on the search filter input (see [demo](https://ghiscoding.github.io/multiple-select-vanilla/#/options34))

## CSP Compliance
The library is now CSP (Content Security Policy) compliant since `v0.6.0`, however there are some exceptions though. When using any html string as template (with `textTemplate`, `labelTemplate`, `renderOptionLabelAsHtml` or `useSelectOptionLabelToHtml`) then you will not be fully compliant unless you return `TrustedHTML`. You can achieve this by using the `sanitizer` method in combo with [DOMPurify](https://github.com/cure53/DOMPurify) to return `TrustedHTML` as shown below and you will now be fully compliant

```typescript
import DOMPurify from 'dompurify';
import { multipleSelect, MultipleSelectInstance } from 'multiple-select-vanilla';

const ms1 = multipleSelect('#select1', {
name: 'my-select',
single: false,
useSelectOptionLabelToHtml: true,
sanitizer: (html) => DOMPurify.sanitize(html, { RETURN_TRUSTED_TYPE: true }),
data: [
{
text: '<i class="fa fa-star"></i> January',
value: 1,
},
]
});
```

### Used by
This fork was created mostly to drop jQuery, and is used by a few other libraries that I maintain:
- [Angular-Slickgrid](https://github.com/ghiscoding/Angular-Slickgrid)
Expand Down

0 comments on commit 87954c7

Please sign in to comment.