I am testing elements in my navbar, and it currently fails to recognise an item. I first checked with save_and_open_page, and the page really looked correct, so I could not understand why my test failed. Then I checked with save_and_open_screenshot, and saw to my surprise that the navbar was collapsed and I only saw the hamburger menu. So it made sense that the test failed. But how to handle this? Why did it render a collapsed navbar?
Could this be due to running the specs in a headless browser? The strange thing is that these tests used to run, and I can't see what change caused this to fail now.
My spec:
# frozen_string_literal: true
feature "Users can view their data", js: true do
let!(:user) { create(:user) }
before do
login_as(user)
visit root_path
end
scenario "with valid credentials" do
click_link t(:user_profile)
fill_in t("activerecord.attributes.user.email"), with: user.email
fill_in t("activerecord.attributes.user.password"), with: "password"
click_button t(:update)
expect(page).to have_content(t("activerecord.attributes.user.username"))
expect(page).to have_content(t("activerecord.attributes.user.email"))
expect(page).to have_content(t("activerecord.attributes.user.password"))
end
end
My rendered HTML:
<div class='collapse navbar-collapse' id='navbarSupportedContent'>
<ul class='navbar-nav mr-auto'>
<li class='nav-item active'>
<a class='nav-link' href='#'>
Home
<span class='sr-only'>(current)</span>
</a>
</li>
<li class='nav-item'>
<a class='nav-link' href='/pages/about'>About</a>
</li>
<li class='nav-item'>
<a class='nav-link' href='/users/edit'>Mijn profiel</a>
</li>
<li class='nav-item'>
<a class="nav-link" rel="nofollow" data-method="delete" href="/users/sign_out">Log uit</a>
</li>
</ul>
</div>