Capybara::ElementNotFound - 切换导航栏中的导航栏项

Capybara::ElementNotFound - navbar item in toggled navbar

提问人:andreheijstek 提问时间:11/17/2023 更新时间:11/17/2023 访问量:8

问:

我正在测试导航栏中的元素,但它目前无法识别项目。 我首先与save_and_open_page进行了检查,页面看起来确实正确,所以我不明白为什么我的测试失败了。 然后我检查了save_and_open_screenshot,惊讶地发现导航栏折叠了,我只看到了汉堡菜单。因此,测试失败是有道理的。 但是如何处理呢?为什么它会呈现折叠的导航栏?

我的规格:

# 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

我渲染的 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>
Bootstrap-5 水豚

评论

0赞 aridlehoover 11/29/2023
我不确定无头浏览器是否是问题的根源。但是,找出答案的一个可靠方法是在实际浏览器中本地运行测试。
0赞 aridlehoover 11/29/2023
这也可能只是一个时机问题。我已经很久没有使用水豚了。但是,据我所知,它并不擅长处理时序问题。我记得不得不在我的规范中加入 sleep 语句,以确保异步 javascript 操作在规范中的下一行之前完成。
0赞 andreheijstek 12/6/2023
嗨,@aridlehoover,感谢您的帮助。我只是在没有无头浏览器的情况下运行了规范(使用有头浏览器?)并且它通过了。
0赞 andreheijstek 12/6/2023
顺便说一句,当我调整屏幕大小并出现汉堡包时,我看到汉堡包不起作用。当我单击它时,什么也没发生。也许这也解释了为什么测试失败。让我们看看我是否可以解决这个问题。
0赞 andreheijstek 12/6/2023
问题解决了。我仍然使用旧的引导类,名称中没有“br”。这使得汉堡包起作用了,现在测试通过了

答: 暂无答案