Testing

For convinience, Surface provides a render_surface/1 macro that allows developers to test component's markup directly. You should use this macro whenever testing regular rendering of stateless components or live components that don't require a parent live view during tests.

Example

# Import conveniences for testing
use Surface.LiveViewTest

# The default endpoint for testing
@endpoint Endpoint

test "creates a <button> with class" do
  html =
    render_surface do
      ~H"""
      <Button class="btn">
        Ok
      </Button>
      """
    end

  assert html =~ """
        <button type="button" class="btn">
          Ok
        </button>
        """
end

Initializing assigns

You can initialize any assign you need by defining an assigns variable before calling render_surface/1:

test "creates a <button> with class" do
  assigns = %{class: "btn"}

  html =
    render_surface do
      ~H"""
      <Button class={{ @class }}>
        Ok
      </Button>
      """
    end

  assert html =~ """
         <button type="button" class="btn">
           Ok
         </button>
         """
end

Testing stateful components

For tests depending on the existence of a parent live view, e.g. testing events on live components and its side-effects, you should use Phoenix's built-in live/2 or live_isolated/3.

For a complete guide on testing LiveViews, including testing events, see LiveView Testing.