bigskysoftware / htmx

</> htmx - high power tools for HTML
https://htmx.org
Other
38.56k stars 1.31k forks source link

Fix illegal invocation using FormData proxy #2995

Closed scrhartley closed 2 weeks ago

scrhartley commented 2 weeks ago

Currently the htmx:configRequest event exposes detail.parameters as a proxied FormData. When trying to use it for debugging with:

element.addEventListener('htmx:configRequest', function(event) {
    console.log(new URLSearchParams(event.detail.parameters).toString());
});

I get:

Uncaught TypeError: Illegal invocation

To work around this, it currently needs to be converted to entries:

element.addEventListener('htmx:configRequest', function(event) {
    console.log(new URLSearchParams(event.detail.parameters.entries()).toString());
});

With a normal FormData object, it can be passed directly:

let data = new FormData();
data.set('foo', 'bar');
console.log(new URLSearchParams(data).toString()); // Outputs foo=bar

I have a fix and will create a PR if that's OK: https://github.com/scrhartley/htmx/commit/bdd17de17a851052a9ba54eefb0aa991686196f0

Telroshan commented 2 weeks ago

Hey, bugfix PRs welcome @scrhartley! Didn't think of this usecase when writing that proxy, good fix!

scrhartley commented 2 weeks ago

Fixed by #2997