Phoenix_live_view: Phoenix live_link does not scroll when url has anchor

[StormBytePP]

Environment

• Elixir version (elixir -v): v1.9.4 Erlang/OTP 22
• Phoenix version (mix deps): v1.4.11
• Phoenix LiveView version (mix deps): ref 57f2ef7
• NodeJS version (node -v): v13.2.0
• NPM version (npm -v): v6.13.1
• Operating system: Gentoo Linux (amd64, Kernel-5.2.0)

In Phoenix' LV, live_link actually is able to change and render another page, but since it changes the DOM model, if any URL contains an anchor, the browser is unable to scroll up to where that component ID is.

For example a link in the form /test#test will render correctly test page, but will not scroll down to where that id test is.

Is there any way in JS that it follows up this scrolling?

[StormBytePP]

Maybe this helps once live_link acted: https://www.w3schools.com/jsref/met_element_scrollintoview.asp ?

@josevalim what do you think?

[snewcomer]

@StormBytePP In that case, it is better to not use live_link and just a normal a permalink?

<%= @comment.inserted_at, to: "#comment#{@id}" %>

Or do you have other use cases I'm not thinking about?

[mcrumm]

@snewcomer I think @StormBytePP is looking for the scroll to occur after the live redirect to _another_ LiveView. For instance from "/" to "/test#test".

[josevalim]

Also related to #481.