Support Vue 3 and Nuxt 3

[truesteps]

Heya! Are you planning a tag released for vue 3?

[truesteps]

@Chantouch i'm working on a vue 3 rewrite, just didn't get to write tests yet, gonna send a pull request asap.... Altho, it seems, sanitize-html doesn't work with Vite :(

[chantouchsek]

Lol, Thanks for working on it. Let see if sanitize-html can work with vite. 🍡

[chantouchsek]

Can you create a draft PR for it?

[truesteps]

284 added it, as well as sent a bug report for sanitize-html https://github.com/apostrophecms/sanitize-html/issues/553

[danluchs]

Any movement on this? We'd really like to use this package with our upcoming Nuxt 3 project.

It looks like the issue I'm seeing is on line 55 of src/sanitize.ts, at least for our installation. Nuxt is throwing this error, when trying to set $sanitize on the Vue.prototype:

Cannot set properties of undefined (setting '$sanitize')

This may fix the issue:

const vueProto = Vue?.config?.globalProperties ?? Vue.prototype;
vueProto[`$${name}`] = (dirty: string, opts = undefined) => sanitizeHtml(dirty, opts || options1);

[chantouchsek]

@danluchs feel free to submit a PR for support nuxt 3, I will take a look on it.

[danluchs]

@chantouchsek I'm not sure about the PR process, it doesn't look like I can make a branch?

The issue appears to be on line 55 in the src/sanitize.ts file. The following code should fix things. Nuxt 3/Vue 3 uses the config.globalProperties object vs. the old prototype object.

const vueProto = Vue?.config?.globalProperties ?? Vue.prototype;
vueProto[`$${name}`] = (dirty: string, opts = undefined) => sanitizeHtml(dirty, opts || options1);

[chantouchsek]

How did you try to create a branch?

[chantouchsek]

First fork it and commit from your repo

[danluchs]

OK, it's set up, ready for testing: https://github.com/chantouchsek/v-sanitize/pull/598

[chantouchsek]

@danluchs did you test on nuxt 3, I think it needs more change for that.