browser_tester 1.5.0

Deterministic lightweight browser runtime for Rust tests
Documentation
use super::*;

#[test]
fn nav_has_implicit_navigation_role_and_link_content_work() -> Result<()> {
    let html = r#"
        <nav id='crumbs' class='crumbs'>
          <ol>
            <li class='crumb'><a id='bikes' href='/bikes'>Bikes</a></li>
            <li class='crumb'><a id='bmx' href='/bmx'>BMX</a></li>
            <li class='crumb'>Jump Bike 3000</li>
          </ol>
        </nav>

        <h1>Jump Bike 3000</h1>
        <p>This BMX bike is a solid step into the pro world.</p>

        <button id='run' type='button'>run</button>
        <p id='result'></p>
        <script>
          document.getElementById('run').addEventListener('click', () => {
            const crumbs = document.getElementById('crumbs');
            document.getElementById('result').textContent =
              crumbs.role + ':' +
              crumbs.tagName + ':' +
              crumbs.querySelectorAll('a').length + ':' +
              crumbs.querySelectorAll('li').length + ':' +
              crumbs.querySelector('.crumb:last-child').textContent.trim() + ':' +
              document.getElementById('bikes').href + ':' +
              document.links.length;
          });
        </script>
        "#;

    let mut h = Harness::from_html_with_url("https://app.local/shop/index.html", html)?;
    h.click("#run")?;
    h.assert_text(
        "#result",
        "navigation:NAV:2:3:Jump Bike 3000:https://app.local/bikes:2",
    )?;
    Ok(())
}

#[test]
fn nav_role_override_and_scoped_header_footer_roles_work() -> Result<()> {
    let html = r#"
        <nav id='primary-nav' aria-labelledby='primary-navigation'>
          <header id='nav-header'>
            <h2 id='primary-navigation'>Primary navigation</h2>
          </header>
          <ul>
            <li><a href='/home'>Home</a></li>
            <li><a href='/about'>About</a></li>
          </ul>
          <footer id='nav-footer'>
            <small>Quick links</small>
          </footer>
        </nav>

        <nav id='footer-nav' aria-labelledby='footer-navigation'>
          <h2 id='footer-navigation'>Footer navigation</h2>
          <a href='/privacy'>Privacy</a>
        </nav>

        <button id='run' type='button'>run</button>
        <p id='result'></p>
        <script>
          document.getElementById('run').addEventListener('click', () => {
            const primaryNav = document.getElementById('primary-nav');
            const footerNav = document.getElementById('footer-nav');
            const navHeader = document.getElementById('nav-header');
            const navFooter = document.getElementById('nav-footer');

            const initial =
              primaryNav.role + ':' +
              footerNav.role + ':' +
              navHeader.role + ':' +
              navFooter.role + ':' +
              document.getElementById(primaryNav.getAttribute('aria-labelledby')).textContent.trim() + ':' +
              document.getElementById(footerNav.getAttribute('aria-labelledby')).textContent.trim();

            primaryNav.role = 'none';
            const assigned = primaryNav.role + ':' + primaryNav.getAttribute('role');

            primaryNav.removeAttribute('role');
            const restored = primaryNav.role + ':' + (primaryNav.getAttribute('role') === null);

            document.getElementById('result').textContent =
              initial + '|' + assigned + '|' + restored;
          });
        </script>
        "#;

    let mut h = Harness::from_html(html)?;
    h.click("#run")?;
    h.assert_text(
        "#result",
        "navigation:navigation:generic:generic:Primary navigation:Footer navigation|none:none|navigation:true",
    )?;
    Ok(())
}