Symfony Panther : can't login with form

Question

I'm testing an application with Symfony Panther. I want to log in the user to have not provided elements in anonymous conditions. Here is my test class :

namespace App\Tests\Functional;

use Symfony\Component\Panther\PantherTestCase;

class SecurityControllerTest extends PantherTestCase
{
    public function testConnexion()
    {
        $client = static::createPantherClient('127.0.0.1', '9001');

        $crawler = $client->request('GET', '/connexion');

        $form = $crawler->selectButton('Se connecter')->form();
        $form['_email'] = 'email@domain.com';
        $form['_password'] = 'password';

        $crawler = $client->submit($form);

//        $link = $crawler->filter('a:contains("Déconnexion")')->link();
//        $crawler = $client->click($link);

        $link = $crawler->selectLink('Déconnexion');
        $link->click();
        $this->assertSame(self::$baseUri.'/', $client->getCurrentURL());
    }
}

The associated template ( connexion.html.twig ) :

{% extends "layout.html.twig" %}

{% block page_title 'Login' %}

{% block final_javascripts %}
    {{ encore_entry_script_tags('sendCredentials') }}
{% endblock %}


{% block content %}

        (...)

            <div class="row mt-4">
                <div class="col-md-6">
                    <form id="connexion-form" action="{{ path('security_connexion') }}" method="post">
                        <div class="form-group">
                            <label for="email">Email</label>
                            <input type="text" id="email" name="_email" class="form-control">
                        </div>

                        <div class="form-group">
                            <label for="password">Mot de passe</label>
                            <input type="password" id="password" name="_password" class="form-control">
                        </div>

                        <button type="submit" class="btn btn-primary button">Se connecter</button>
                    </form>
                </div>

            </div>
        </div>
    </div></div>
{% endblock %}

And the _nav.html.twig template which represents the navigation bar :

<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container">
        <a class="navbar-brand" href="{{ path("index") }}"><img src="{{ asset("images/temporary-logo.png") }}" alt="shinigami-laser-logo" style="max-height: 60px;"></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        (...)

            {% if is_granted('IS_AUTHENTICATED_FULLY') %}


                {% if is_granted('ROLE_USER') %}
                    <li>
                        <a href="{{ path('logged_infos') }}" class="nav-link  shogun-link">Mes infos</a>
                    </li>
                    <li>
                        <a href="#" class="nav-link  shogun-link">Gerer mes cartes</a>
                    </li>
                    <li>
                        <a href="#" class="nav-link  shogun-link">Mes stats</a>
                    </li>
                {% endif %}
                <li class="nav-item">
                    <a class="nav-link  shogun-link" href="{{ path('security_deconnexion') }}">Déconnexion</a>
                </li>
            {% else %}
                <li class="nav-item">
                    <a class="nav-link  shogun-link" href="{{ path('user_enregistrement') }}">S'enregistrer</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link  shogun-link" href="{{ path('security_connexion') }}">Se connecter</a>
                </li>
            {% endif %}
                </ul>
        </div>
    </div>
</nav>

In dev mode the user can authenticate and log out with the Déconnexion link in the navbar. But the command php bin/phpunit tests/Functional/SecurityControllerTest.php says : InvalidArgumentException: The current node list is empty. pointing on this line : $link->click(); revealing that the Déconnexion link is not visible. Is that user is not logged in ? How to fix that and access provided elements for authanticated user like the Déconnexion link ?

Answer 1

Try these methods:

$crawler->selectButton('.btn-primary');
$crawler->executeScript("document.querySelector('.btn-primary').click()");

https://symfony.com/doc/current/components/dom_crawler.html#forms