Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue with form_for

See original GitHub issue

This is in a .html.leex template if that makes any difference 🤷

<div class="flex flex-col justify-center py-12 sm:px-6 lg:px-8">
  <div class="sm:mx-auto sm:w-full sm:max-w-md">
    <img class="h-16 mx-auto w-auto" src="<%= Routes.static_path(@socket, "/images/logo.svg") %>" alt="" />
    <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
      Subscription
    </h2>
    <p class="mt-2 text-center text-sm text-gray-600 max-w">
      We need a few things from you in order to take care of payment.
    </p>
  </div>
  <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
    <div id="checkout-new" class="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10">
      <%= form_for @changeset, "#", [as: :price, phx_change: "update-plan"], fn f -> %>
        <div class="mb-6">
          <%= label(f, :plan_id, "Select plan", class: "block text-sm font-medium text-gray-700") %>
          <div class="mt-1">
            <%= select(f, :plan_id, @products, class: "mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-light-blue-500 focus:border-light-blue-500 sm:text-sm rounded-md") %>
          </div>
        </div>
      <% end %>
      <form action="#" method="post" phx-hook="InitCheckout" id="payment-form" data-public-key="<%= public_key() %>">
       <!-- # trimmed .... -->

Running prettier outputs this:

SyntaxError: Unexpected closing tag "eextundefined". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags (21:8)
  19 |           </div>
  20 |         </div>
> 21 |        </eextundefined>
     |        ^^^^^^^^^^^^^^^^
  22 |       <form action="#" method="post" phx-hook="InitCheckout" id="payment-form" data-public-key="eex4eex">
  23 |         <div class="space-y-6">
  24 |           <div>
    at vt (/Users/justinsmestad/code//app/assets/node_modules/prettier/parser-html.js:41:48413)
    at Mn (/Users/justinsmestad/code//app/assets/node_modules/prettier/parser-html.js:113:2409)
    at Un (/Users/justinsmestad/code//app/assets/node_modules/prettier/parser-html.js:113:4175)
    at Object.parse (/Users/justinsmestad/code//app/assets/node_modules/prettier/parser-html.js:113:4895)
    at Object.parse (/Users/justinsmestad/code//app/assets/node_modules/prettier/index.js:13625:19)
    at textToDoc (/Users/justinsmestad/code//app/assets/node_modules/prettier/index.js:14560:25)
    at /Users/justinsmestad/code//app/assets/node_modules/prettier/index.js:14545:95
    at embed (/Users/justinsmestad/code//app/assets/node_modules/prettier-plugin-eex/lib/printers.js:20:19)
    at Object.embed (/Users/justinsmestad/code//app/assets/node_modules/prettier-plugin-eex/lib/printers.js:37:16)
    at Object.printSubtree (/Users/justinsmestad/code//app/assets/node_modules/prettier/index.js:14545:28) {
  loc: { start: { line: 21, column: 8 }, end: { line: 21, column: 24 } },
  codeFrame: '\x1B[0m \x1B[90m 19 | \x1B[39m          \x1B[33m<\x1B[39m\x1B[33m/\x1B[39m\x1B[33mdiv\x1B[39m\x1B[33m>\x1B[39m\x1B[0m\n' +
    '\x1B[0m \x1B[90m 20 | \x1B[39m        \x1B[33m<\x1B[39m\x1B[33m/\x1B[39m\x1B[33mdiv\x1B[39m\x1B[33m>\x1B[39m\x1B[0m\n' +
    '\x1B[0m\x1B[31m\x1B[1m>\x1B[22m\x1B[39m\x1B[90m 21 | \x1B[39m       \x1B[33m<\x1B[39m\x1B[33m/\x1B[39m\x1B[33meextundefined\x1B[39m\x1B[33m>\x1B[39m\x1B[0m\n' +
    '\x1B[0m \x1B[90m    | \x1B[39m       \x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[0m\n' +
    '\x1B[0m \x1B[90m 22 | \x1B[39m      \x1B[33m<\x1B[39m\x1B[33mform\x1B[39m action\x1B[33m=\x1B[39m\x1B[32m"#"\x1B[39m method\x1B[33m=\x1B[39m\x1B[32m"post"\x1B[39m phx\x1B[33m-\x1B[39mhook\x1B[33m=\x1B[39m\x1B[32m"InitCheckout"\x1B[39m id\x1B[33m=\x1B[39m\x1B[32m"payment-form"\x1B[39m data\x1B[33m-\x1B[39mpublic\x1B[33m-\x1B[39mkey\x1B[33m=\x1B[39m\x1B[32m"eex4eex"\x1B[39m\x1B[33m>\x1B[39m\x1B[0m\n' +
    '\x1B[0m \x1B[90m 23 | \x1B[39m        \x1B[33m<\x1B[39m\x1B[33mdiv\x1B[39m \x1B[36mclass\x1B[39m\x1B[33m=\x1B[39m\x1B[32m"space-y-6"\x1B[39m\x1B[33m>\x1B[39m\x1B[0m\n' +
    '\x1B[0m \x1B[90m 24 | \x1B[39m          \x1B[33m<\x1B[39m\x1B[33mdiv\x1B[39m\x1B[33m>\x1B[39m\x1B[0m'
}