ember-dompurify

ember-dompurify

A wrapper around DOMPurify.

DOMPurify sanitizes HTML and prevents XSS attacks. You can feed DOMPurify with string full of dirty HTML and it will return a string with clean HTML. DOMPurify will strip out everything that contains dangerous HTML and thereby prevent XSS attacks and other nastiness. It's also damn bloody fast. We use the technologies the browser provides and turn them into an XSS filter. The faster your browser, the faster DOMPurify will be.

Installation

ember i ember-dompurify

Helper usage

Basic

{{dom-purify '<img src="x" onerror=alert(1)>'}}

Returns an Ember.String.htmlSafe object:

<img src="x">

Advanced (custom stateful hooks)

DOMPurify exposes a number of useful hooks. These hooks can be leveraged to initiate transforms on the HTML you are sanitizing, such as always inserting target="_blank" on all HTMLAnchorElement elements.

// app/dompurify-hooks/target-blank.js (built-in but an example of the public API)
import { Hook } from 'ember-dompurify';

export default class TargetBlankHook extends Hook {
  afterSanitizeAttributes(node) {
    if (node instanceof HTMLAnchorElement) {
      node.setAttribute('target', '_blank');
      node.setAttribute('rel', 'noopener');
    }
  }
}

{{dom-purify '<a src="https://google.com">Link</a>' hook='target-blank'}}

Result:

<a src="https://google.com" target="_blank" rel="noopener">Link</a>

Note: Multiple hooks can be provided as a string separated by spaces - i.e, {{dom-purify '<a src="https://google.com">Link</a>' hook='hook-one hook-two}})

Built-in hooks

These are commonly used and bundled with ember-dompurify. If you have other hooks you would like to add, please submit a PR or open an issue for a proposal.

#### target-blank

```hbs
{{dom-purify '<a src="https://google.com">Link</a>' hook='target-blank'}}

Result:

<a src="https://google.com" target="_blank" rel="noopener">Link</a>

API

import createDOMPurify from 'ember-dompurify';

const dompurify = createDOMPurify(window);
dompurify.sanitize('<img src="x" onerror=alert(1)/>'); // -> type: String, result: `<img src="x">`

Supported Helper Attributes

All DOMPurify options are supported, DOMPurify options.

Example:

{{dom-purify model.notes keep-content=true}}

Contributing

Installation

• git clone <repository-url>
• cd ember-dompurify
• npm install

Linting

• npm run lint:js
• npm run lint:js -- --fix

Running tests

• ember test – Runs the test suite on the current Ember version
• ember test --server – Runs the test suite in "watch mode"
• npm test – Runs ember try:each to test your addon against multiple Ember versions

Running the dummy application

• ember serve
• Visit the dummy application at http://localhost:4200.

For more information on using ember-cli, visit https://ember-cli.com/.

License

This project is licensed under the MIT License