# SEC-004: data in an attribute that runs code

**Warning**: the page still builds, but this is most likely a mistake.

Some attributes are run as code, like Alpine.js's `x-data` or htmx's `hx-on`. Data inside them becomes code:
a name like `'); stealCookies(); ('` would run.

## Fails

```hypra fails
page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  props(user: User)
  h1 "Shoes"
  div(x-data: "greeting('{user.name}')") { p(x-text: "message") }
}
```

## Fixed

```hypra passes
page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  props(user: User)
  h1 "Shoes"
  div(x-data: "greeting($el.dataset.name)", data-name: "{user.name}") { p(x-text: "message") }
}
```

Pass data in a `data-*` attribute, where it's escaped, and read it from there.
