diff --git a/README.md b/README.md index 27cd467..65c2c3e 100644 --- a/README.md +++ b/README.md @@ -63,6 +63,8 @@ See more examples below: * [`examples/demo_hooks.exs`] * [`examples/demo_endpoint.exs`] * [`examples/demo_live_pubsub.exs`] + * [`examples/demo_static_files/demo_static_files.exs`] + * [`examples/demo_static_files/demo_static_files_test.exs`] ## License @@ -87,3 +89,5 @@ limitations under the License. [`examples/demo_hooks.exs`]: examples/demo_hooks.exs [`examples/demo_endpoint.exs`]: examples/demo_endpoint.exs [`examples/demo_live_pubsub.exs`]: examples/demo_live_pubsub.exs +[`examples/demo_static_files/demo_static_files.exs`]: examples/demo_static_files/demo_static_files.exs +[`examples/demo_static_files/demo_static_files_test.exs`]: examples/demo_static_files/demo_static_files_test.exs diff --git a/examples/demo_static_files/assets/inc.svg b/examples/demo_static_files/assets/inc.svg new file mode 100644 index 0000000..c7b2af9 --- /dev/null +++ b/examples/demo_static_files/assets/inc.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/examples/demo_static_files/assets/style.css b/examples/demo_static_files/assets/style.css new file mode 100644 index 0000000..9053a2e --- /dev/null +++ b/examples/demo_static_files/assets/style.css @@ -0,0 +1,49 @@ +/* app.css */ +body { + font-family: "Helvetica", "Arial", sans-serif; + background-color: #f9fafb; + color: #333; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 100vh; + margin: 1em; + padding: 1em; +} + +span { + font-size: 2.5rem; + font-weight: 600; + margin-bottom: 1rem; + color: #1e293b; +} + +button { + display: inline-flex; + align-items: center; + justify-content: center; + width: 64px; + height: 64px; + margin-left: 20px; + border-radius: 30%; + background-color: #2563eb; + cursor: pointer; + transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out; +} + +button img { + width: 32px; + height: 32px; + filter: invert(100%) brightness(200%); +} + +button:hover { + background-color: #1d4ed8; + transform: scale(1.05); +} + +button:active { + background-color: #1e40af; + transform: scale(0.98); +} diff --git a/examples/demo_static_files/demo_static_files.exs b/examples/demo_static_files/demo_static_files.exs new file mode 100755 index 0000000..3aa2ca5 --- /dev/null +++ b/examples/demo_static_files/demo_static_files.exs @@ -0,0 +1,41 @@ +Mix.install([ + # TODO: Update when stable/released? + # {:phoenix_playground, "~> 0.1.9"} + {:phoenix_playground, path: Path.expand("../..", __DIR__)} +]) + +defmodule DemoStatic do + use Phoenix.LiveView + + def mount(_params, _session, socket) do + {:ok, assign(socket, count: 0)} + end + + def render(assigns) do + ~H""" + {@count} + + + + """ + end + + def handle_event("inc", _params, socket) do + {:noreply, assign(socket, count: socket.assigns.count + 1)} + end +end + +defmodule DemoPlug do + use Plug.Builder + + plug Plug.Static, at: "/assets", from: Path.expand("assets", __DIR__) +end + +PhoenixPlayground.start( + live: DemoStatic, + plug: DemoPlug +) diff --git a/examples/demo_static_files/demo_static_files_test.exs b/examples/demo_static_files/demo_static_files_test.exs new file mode 100644 index 0000000..d9e7bce --- /dev/null +++ b/examples/demo_static_files/demo_static_files_test.exs @@ -0,0 +1,52 @@ +Mix.install([ + # TODO: Update when stable/released? + # {:phoenix_playground, "~> 0.1.9"} + {:phoenix_playground, path: Path.expand("../..", __DIR__)} +]) + +defmodule DemoStatic do + use Phoenix.LiveView + + def mount(_params, _session, socket) do + {:ok, assign(socket, count: 0)} + end + + def render(assigns) do + ~H""" + {@count} + + + + """ + end + + def handle_event("inc", _params, socket) do + {:noreply, assign(socket, count: socket.assigns.count + 1)} + end +end + +defmodule DemoPlug do + use Plug.Builder + + plug Plug.Static, at: "/assets", from: Path.expand("assets", __DIR__) +end + +Logger.configure(level: :warning) +ExUnit.start() + +defmodule DemoStaticTest do + use ExUnit.Case + use PhoenixPlayground.Test, live: DemoStatic, plug: DemoPlug + + test "static assets are served" do + conn = get(build_conn(), "/assets/inc.svg") + assert response(conn, 200) =~ " PhoenixPlayground.Router.LiveRouter.call(conn, []) @@ -23,25 +38,29 @@ defmodule PhoenixPlayground.Router do PhoenixPlayground.Router.ControllerRouter.call(conn, []) options[:plug] -> - # always fetch plug from app env to allow code reloading anonymous functions - plug = Application.fetch_env!(:phoenix_playground, :plug) + conn # already handled - case plug do - module when is_atom(module) -> - module.call(conn, module.init([])) + true -> + raise ArgumentError, "expected :live, :controller, or :plug, got: #{inspect(options)}" + end + end - {module, options} when is_atom(module) -> - module.call(conn, module.init(options)) + defp call_custom_plug(conn, _plug) do + # always fetch plug from app env to allow code reloading anonymous functions + plug = Application.fetch_env!(:phoenix_playground, :plug) - fun when is_function(fun, 1) -> - fun.(conn) + case plug do + module when is_atom(module) -> + module.call(conn, module.init([])) - fun when is_function(fun, 2) -> - fun.(conn, []) - end + {module, options} when is_atom(module) -> + module.call(conn, module.init(options)) - true -> - raise ArgumentError, "expected :live, :controller, or :plug, got: #{inspect(options)}" + fun when is_function(fun, 1) -> + fun.(conn) + + fun when is_function(fun, 2) -> + fun.(conn, []) end end diff --git a/lib/phoenix_playground/test.ex b/lib/phoenix_playground/test.ex index 481d8ff..92e8349 100644 --- a/lib/phoenix_playground/test.ex +++ b/lib/phoenix_playground/test.ex @@ -51,6 +51,7 @@ defmodule PhoenixPlayground.Test do Keyword.validate!(options, [ :live, :controller, + :plug, endpoint: PhoenixPlayground.Endpoint ]) @@ -70,9 +71,11 @@ defmodule PhoenixPlayground.Test do setup do options = unquote(options) - if live = options[:live] do - Application.put_env(:phoenix_playground, :live, live) - end + Enum.each([:live, :plug], fn key -> + if config = options[key] do + Application.put_env(:phoenix_playground, key, config) + end + end) start_supervised!( {@endpoint, diff --git a/test/examples_test.exs b/test/examples_test.exs index f76d579..c2a4882 100644 --- a/test/examples_test.exs +++ b/test/examples_test.exs @@ -23,3 +23,4 @@ end Examples.run("#{__DIR__}/../examples/demo_controller_test.exs") Examples.run("#{__DIR__}/../examples/demo_live_test.exs") +Examples.run("#{__DIR__}/../examples/demo_static_files/demo_static_files_test.exs")