When an a tag goes from having an href to having no href the patch leaves the attribute in place but with an empty string value instead of removing it. This is unexpected behavior, as a blank href has different semantics from no href at all. The cause of the behavior is that href is being set as a property, so a patch that removes it will set it to an empty string. Setting href as an attribute rather than a property should fix it.
Copying some context from https://github.com/elm-lang/virtual-dom/issues/109 below, including a link to an SSCCE
Problem
This bug is very easy to recreate and observe, I made a very basic ellie here
Long story short, here is what happens step-by-step:
- Start with an
a element with no href, like a [] [], it can't be clicked.
- Toggle and switch to another
a with an href like: a [ href "https://google.com" ] []
- So far so good, we can now click the
a and go to google.
- Toggle back to an
a with no href, but now instead of having the original a [] [] (which is what we expect) we get the following html: <a href="">no href</a>. This is obviously problematic.
Workaround
- Use
Html.Attributes.attribute "href" theHrefValue
When an
atag goes from having anhrefto having nohrefthe patch leaves the attribute in place but with an empty string value instead of removing it. This is unexpected behavior, as a blankhrefhas different semantics from nohrefat all. The cause of the behavior is thathrefis being set as a property, so a patch that removes it will set it to an empty string. Settinghrefas anattributerather than apropertyshould fix it.Copying some context from https://github.com/elm-lang/virtual-dom/issues/109 below, including a link to an SSCCE
Problem
This bug is very easy to recreate and observe, I made a very basic ellie here
Long story short, here is what happens step-by-step:
aelement with no href, likea [] [], it can't be clicked.awith anhreflike:a [ href "https://google.com" ] []aand go to google.awith nohref, but now instead of having the originala [] [](which is what we expect) we get the following html:<a href="">no href</a>. This is obviously problematic.Workaround
Html.Attributes.attribute "href" theHrefValue