Boolean property `readonly` does not seem to be applied

[patwid]

Similar to the resolved issue #55, specifying the boolean property readonly does not seem to be applied to e.g. an input element.

Specifying the boolean property disabled seems to work properly.

For example:

import gleam/io
import lustre/attribute
import lustre/element
import lustre/element/html

// Expect "<input readonly>" actual "<input>"
pub fn main() {
  html.input([attribute.readonly(True)])
  |> element.to_string
  |> io.println
}

As a workaround, specifying "readonly" as an attribute rather than a property seems to work as expected:

import gleam/io
import lustre/attribute
import lustre/element
import lustre/element/html

// Expect "<input readonly>" actual "<input readonly>"
pub fn main() {
  html.input([attribute.attribute("readonly", "")])
  |> element.to_string
  |> io.println
}

[hayleigh-dot-dev]

Hi there, when you say "doesn't work properly" can you clarify whether you mean "the HTML is not what I expect" vs "the behaviour is not what I expect".

attribute.readonly sets a property on the element without modifying the html. You can read about the difference between attributes and properties here.

If the behaviour is what you expect (eg the input cannot be modified) then I will close this because it's working as intended!

[patwid]

The behavior is not what I expect. The input element still accepts input.

I assumed that setting the property would also modify the DOM/html, because I compared it to attribute.disabled(True) for which the behavior is as expected. And there the input element actually has the "attribute" disabled in the DOM/html.