hypra

SEC-005: data name in a script or style

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

Scripts and styles are written exactly as they are: Hypra doesn't put data into them, because data in code can become code. So {product.id} stays those exact characters, which is almost never what was meant.

Fails

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  props(product: Product)
  h1 "Shoes"
  script "track('view', {product.id})"
}
warning[SEC-005]: `{product.id}` in script is written as-is
 --> page.hypra:4:10
  |
4 |   script "track('view', {product.id})"
  |          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  = help: scripts and styles don't read data; pass it in a data-* attribute or a script(type: "application/json")
  = docs: https://hypralang.dev/rules/sec-005/

0 errors, 1 warning

Fixed

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  props(product: Product)
  h1 "Shoes"
  head { script("/track.js", defer: true) }
  div(id: "product", data-id: "{product.id}") { p "{product.name}" }
}

Pass data in a data-* attribute, and read it from the script.