Support for multiple allowed attributes

Tenga commented 3 years ago

Hi! 👋

This is a question in case this is possible and I missed it and/or a feature request in one because from my scouring and attempts, it doesn't seem like this is possible.

Subject of the feature

Ability to declare multiple allowed attributes

Problem

Currently, it seems impossible to define the schema as such to support allowing of multiple specific attribute values.

My specific use case would be for something like rehype-prism generated content, where I'd like to allow a span to have a set of known classNames, (i.e. token and operator), while still stripping any other ones.

If we take an example of a 

So far, I've blindly attempted:

Adding the same attribute multiple times:
```
span: [
["className", "token"],
["className", "operator"],
],
```
Current result: 
Adding an array of attributes:
```
span: [
["className", ["token", "operator"]],
],
```
Current result:

Pattern-matchy string:

span: [
["className", "token|operator"],
],

Current result: 

Space separated string, or a combo of how they appear:
```
span: [
["className", "token operator"],
],
```
Current result:

Expected behaviour

It seems like it would be beneficial to have a way to provide a list of valid attibute values for an attribute in the schema.

Currently the choice between a blanket allowance of an attribute vs only a single variant in cases where allowed attributes are known in advance and could be listed out, nudges the user towards the blanket allowance.

While I've tried the last approach, it's probably not something that would be useful.

Apologies if this was considered before and dismissed for a reason.

Alternatives

N/A

Thank you for your time!

wooorm commented 3 years ago

You tried a couple of things, and almost found the solution.

The readme says:

Instead of a single string (such as type), which allows any property value of that property name, it’s also possible to provide an array (such as ['type', 'checkbox']), where the first entry is the property name, and the other entries are allowed property values.

So, you can provide multiple allowed values like so:

var h = require('hastscript')
var merge = require('deepmerge')
var gh = require('./lib/github')
var sanitize = require('.')
var toHtml = require('hast-util-to-html')

var schema = merge(gh, {attributes: {span: [['className', 'token', 'number']]}})

var tree = h('div', [
  h('span.token.number', '1'),
  ' ',
  h('span.token.operator', '+'),
  ' ',
  h('span.token.number', '1'),
  ' ',
  h('span.token.xxx', '?'),
  h('span.yyy', '?')
])

var sanitized = toHtml(sanitize(tree, schema))

console.log(sanitized)

Yields:

<div><span class="token number">1</span> <span class="token">+</span> <span class="token number">1</span> <span class="token">?</span><span class="">?</span></div>

Tenga commented 3 years ago

Oh damn, I missed the plurality of that part of the readme. 😊

Thanks for pointing it out!

wooorm commented 3 years ago

Also added the example to the readme! https://github.com/syntax-tree/hast-util-sanitize/commit/545e0dc4b84b5901faca98866e66a1ea46b1e1ed

Best

syntax-tree / hast-util-sanitize