VerifiedRoutes is encoding `+` in url path

I have some code like this:

defmodule Unicode do
  @derive Phoenix.Param
  defstruct [id: "U+0041"]
  def dummy, do: %__MODULE__{}
end

<.link href={~p"/path/#{Unicode.dummy()}"}>some link</.link>

The issue is that VerifiedRoutes(it’s not Phoenix.Param as it stops if I remove the ~p) is encoding the interpolated portion to U%2B0041. The issue is that since a + is valid in the path component of a URL, the browser doesn’t decode it, so the URL in the address bar shows the encoded version of the URL which is not exactly pretty. The route still works, but it just looks a bit ugly.

Is this a bug or am I missing something here with URL encoding? I notice that URI will correctly decode the route, and also if I try to encode it again with URI is seems to keep it as U+0041, which seems to support that the + is allowed there. Does anyone know if there’s a reason this gets encoded by VerifiedRoutes? For now i’m just leaving the ~p off.

Also interestingly it seems to only do it if it’s interpolated. If I plug a string directly into the ~p it keeps the + as a +. When I interpolate it, it gets encoded.

This might be to disambiguate the uri percent encoding where + may or may not be percent encoded vs. the application/x-www-form-urlencoded encoding where a literal + is an alternative encoding for a space and equivalent to %20.

1 Like