rehype-dom-parse

rehype plugin to use browser APIs to parse HTML

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
rehype-dom-parse
Minified + gzip package size for rehype-dom-parse in KB

Readme

rehype-dom-parse

Build Coverage Downloads Size Sponsors Backers Chat

rehype plugin to use browser APIs to parse HTML. Parser for unified. Used in the rehype-dom processor.

If you don’t care about bundle size, or if you don’t trust content, or if you’re not in a (modern) browser environment, use rehype-parse instead.

As rehype-dom-parse is designed for browser use, it defaults to parsing in fragment mode, whereas rehype-parse defaults to document mode!

Install

yarn:

yarn add rehype-dom-parse

npm:

npm install rehype-dom-parse

Use

import unified from 'unified';
import createStream from 'unified-stream';
import parse from 'rehype-dom-parse';
import stringify 'rehype-dom-stringify';

const processor = unified()
  .use(parse)
  .use(stringify)
  .data('settings', { fragment: true })

processor.process('<p>text, <b>hyper', (err, file) => {
  if (err) {
    console.error(err);
  } else {
    console.log(String(file));
  }
});

Yields:

<p>text, <b>hyper</b></p>

API

processor.use(parse[, options])

Configure processor to parse HTML as input and transform it to hast.

options
options.fragment

Specify whether to parse a fragment (boolean, default: true), instead of a complete document. In document mode, unopened html, head, and body elements are opened in just the right places.

Security

Use of rehype-dom-parse can open you up to a cross-site scripting (XSS) attack if the DOM is unsafe. Use rehype-sanitize to make the tree safe.

Contribute

See contributing.md in rehypejs/.github for ways to get started. See support.md for ways to get help.

This project has a Code of Conduct. By interacting with this repository, organisation, or community you agree to abide by its terms.

License

ISC © Keith McKnight

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.