Visited link styles are not being unset with LiveView changes

Phoenix Forum Questions / Help
, ,
1

Hi everyone.

I have a simple LiveView project, which let’s say has a list of links:

links: [link_1, link_2, link_3]

And I draw them in LiveView:

<%= for link in @links do %>
  <a href="<%= link %>"> Link </a>
<% end %>

With a simple css attribute:

a:visited {
   color: red
}

But when I change the links and send them through the wire, the visited state doesn’t change. So if at the beginning I click “Link 1”, and live view changes it to “Link 6” which I never clicked on, it would still appear red.

How can I unset the visited state?

Thank you!!

2

:wave:

You can try adding an id to each anchor tag, that might help.

<%= for link in @links do %>
  <a href="<%= link %>" id="link-<%= link %>"> Link </a>
<% end %>

That would give liveview/morphdom more info about which elements changed and it would stop it from blindly mutating them in place.

(Possibly) relevant issue: https://github.com/patrick-steele-idem/morphdom/issues/3

4 Likes
3

Super, it worked!!! Thank you.