Basics

This check has a base priority of normal and works with any version of Elixir.

Explanation

Forbids raw inline <script> tags in HEEx templates.

Inline <script> markup bypasses Phoenix LiveView's render lifecycle, breaks LiveView reconnect/morphdom semantics, and tends to grow into ad-hoc JavaScript that lives outside the asset pipeline. Use one of:

• a colocated phx-hook for behavior tied to a specific element,
• a colocated script via :type={Phoenix.LiveView.ColocatedHook} / :type={Phoenix.LiveView.ColocatedJS} (processed at compile time),
• a <script> in the root layout for app-wide setup loaded once, or
• an external script imported through the asset bundler for third-party integrations.

Script tags are allowed when they are not inline bodies:

• <script :type={...}> — a Phoenix colocated declaration, hoisted to a separate file at compile time.
• <script ... src="..."> — an external source; the tag body is ignored per the HTML spec.

The check inspects every ~H sigil and every .heex template referenced via embed_templates.

Bad

<script>
  console.log("hello");
</script>

Good

<div id="phone" phx-hook=".PhoneNumber">...</div>
<script :type={Phoenix.LiveView.ColocatedHook} name=".Filter">...</script>
<script defer src="https://accounts.google.com/gsi/client"></script>

Check-Specific Parameters

There are no specific parameters for this check.

General Parameters

Like with all checks, general params can be applied.

Parameters can be configured via the .credo.exs config file.