dwyl / elixir-auth-github

:octocat: Minimalist GitHub OAuth Authentication for Elixir Apps. Tested, Documented & Maintained. Setup in 5 mins. 🚀
GNU General Public License v2.0
38 stars 4 forks source link

Fix Template Attribute Interpolation in Readme #60

Closed Consofine closed 2 years ago

Consofine commented 2 years ago

Bug

In the templates in the readme, Eex interpolation is used inside of tags. This results in a compilation error if you try to use this code:

== Compilation error in file lib/oauth_demo_web/views/page_view.ex ==
** (Phoenix.LiveView.HTMLTokenizer.ParseError) lib/oauth_demo_web/templates/page/index.html.heex:4:12: expected closing `"` for attribute value

Make sure the attribute is properly closed. This may also happen if
there is an EEx interpolation inside a tag, which is not supported.
Instead of

    <div <%= @some_attributes %>>
    </div>

do

    <div {@some_attributes}>
    </div>

Where @some_attributes must be a keyword list or a map.

The readme's code for lib/app_web/templates/page/welcome.html.heex is written incorrectly (remove quotes around src): <img width="32px" src="{@profile.avatar_url}" />

And incorrect interpolation is used in /lib/app_web/templates/page/index.html.eex: <a href="<%= @oauth_github_url %>">

Also, the <p> tag in the supplied code for /lib/app_web/templates/page/index.html.eex isn't closed correctly: <p>To get started, login to your GitHub Account: <p>

Fix

As pointed out in the Phoenix docs, instead of trying to interpolate attribute values like: <a href="<%= @oauth_github_url %>"> <img width="32px" src="{@profile.avatar_url}" />

We should instead do: <a href={@oauth_github_url}> <img width="32px" src={@profile.avatar_url} />