browser_tester 1.5.0

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

#[test]
fn meter_has_implicit_role_and_range_attributes_roundtrip_work() -> Result<()> {
    let html = r#"
        <label id='fuel-label' for='fuel'>Fuel level:</label>
        <meter id='fuel' min='0' max='100' low='33' high='66' optimum='80' value='50'>
          at 50/100
        </meter>

        <button id='run' type='button'>run</button>
        <p id='result'></p>
        <script>
          document.getElementById('run').addEventListener('click', () => {
            const fuel = document.getElementById('fuel');
            const initial =
              fuel.role + ':' +
              fuel.tagName + ':' +
              fuel.value + ':' +
              fuel.getAttribute('value') + ':' +
              fuel.getAttribute('min') + ':' +
              fuel.getAttribute('max') + ':' +
              fuel.getAttribute('low') + ':' +
              fuel.getAttribute('high') + ':' +
              fuel.getAttribute('optimum') + ':' +
              document.querySelector('label[for="fuel"]').textContent.trim();

            fuel.setAttribute('value', '84');
            fuel.setAttribute('min', '10');
            fuel.setAttribute('max', '120');
            fuel.setAttribute('low', '40');
            fuel.setAttribute('high', '90');
            fuel.setAttribute('optimum', '95');

            const assigned =
              fuel.value + ':' +
              fuel.getAttribute('value') + ':' +
              fuel.getAttribute('min') + ':' +
              fuel.getAttribute('max') + ':' +
              fuel.getAttribute('low') + ':' +
              fuel.getAttribute('high') + ':' +
              fuel.getAttribute('optimum');

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

    let mut h = Harness::from_html(html)?;
    h.click("#run")?;
    h.assert_text(
        "#result",
        "meter:METER:50:50:0:100:33:66:80:Fuel level:|84:84:10:120:40:90:95",
    )?;
    Ok(())
}

#[test]
fn meter_role_override_and_value_property_assignment_work() -> Result<()> {
    let html = r#"
        <p id='line'>
          Battery level:
          <meter id='battery' min='0' max='1' value='0.75'>75%</meter>
        </p>
        <button id='run' type='button'>run</button>
        <p id='result'></p>
        <script>
          document.getElementById('run').addEventListener('click', () => {
            const battery = document.getElementById('battery');
            const line = document.getElementById('line');
            const initial =
              battery.role + ':' +
              line.childElementCount + ':' +
              battery.textContent.trim() + ':' +
              battery.getAttribute('value');

            battery.role = 'progressbar';
            const assigned = battery.role + ':' + battery.getAttribute('role');
            battery.removeAttribute('role');
            const restored = battery.role + ':' + (battery.getAttribute('role') === null);

            battery.value = 0.25;
            const valueByProp = battery.value;

            battery.setAttribute('value', '0.5');
            const valueByAttr = battery.value + ':' + battery.getAttribute('value');

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

    let mut h = Harness::from_html(html)?;
    h.click("#run")?;
    h.assert_text(
        "#result",
        "meter:1:75%:0.75|progressbar:progressbar|meter:true|0.25|0.5:0.5",
    )?;
    Ok(())
}