makeover-webview 0.74.0

//! Tests for [`super`].

use super::*;
use makeover_layout::{Accepted, Curve, Family};

fn field(kind: FieldKind) -> Field<'static> {
    Field::new(kind, "title", "Title")
}

#[test]
fn a_value_cannot_break_out_of_the_attribute_it_sits_in() {
    // The payload from goingson's own CHRONIC-XSS regression test.
    let filling = Filling::of(Value::Text("x\" onfocus=alert(1) autofocus=\""));
    let html = field_html(&field(FieldKind::Text), &filling, &Emit::default());
    // The payload survives as text, which is the point: it is inert
    // because the quote that would have closed the attribute is encoded,
    // not because the words were filtered.
    assert!(!html.contains("\" onfocus"), "{html}");
    assert!(
        html.contains("value=\"x&quot; onfocus=alert(1) autofocus=&quot;\""),
        "{html}"
    );
}

/// The seam quasi's suggestion source needs: a host's own attributes land
/// on the control, unescaped, and after everything this crate decided.
#[test]
fn a_host_can_write_its_own_attributes_onto_the_control() {
    let mut filling = Filling::of(Value::Text("ru"));
    filling.control_attrs = Some(Markup(
        r#"role="combobox" aria-expanded="false" aria-controls="title-suggestions""#,
    ));
    let html = field_html(&field(FieldKind::Text), &filling, &Emit::default());
    assert!(html.contains(r#"role="combobox""#), "{html}");
    assert!(
        html.contains(r#"aria-controls="title-suggestions""#),
        "{html}"
    );
    // After the id, which is what "last" buys: a host can read what this
    // emitter wrote and cannot be overwritten by it.
    let id = html.find(r#"id="title""#).expect("id");
    let role = html.find(r#"role="combobox""#).expect("role");
    assert!(id < role, "{html}");
}

/// A radio group has no one control element, so there is nowhere honest to
/// put an attribute meant for the control. Documented on the member.
#[test]
fn a_radio_group_drops_control_attributes() {
    let mut f = field(FieldKind::Radio);
    let options = [Choice::new("a", "A")];
    f.options = &options;
    let filling = Filling {
        control_attrs: Some(Markup(r#"data-host="1""#)),
        ..Filling::default()
    };
    let html = field_html(&f, &filling, &Emit::default());
    assert!(!html.contains("data-host"), "{html}");
}

#[test]
fn a_label_cannot_open_a_tag() {
    let mut f = field(FieldKind::Text);
    f.label = "<script>alert(1)</script>";
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(!html.contains("<script>"), "{html}");
    assert!(html.contains("&lt;script&gt;"), "{html}");
}

#[test]
fn every_escaped_sink_is_covered_by_the_one_escaper() {
    assert_eq!(escape("&<>\"'"), "&amp;&lt;&gt;&quot;&#39;");
    // The character `textContent` serialization leaves alone, which is why
    // the app needs two escapers and this needs one.
    assert!(escape("\"").contains("&quot;"));
}

/// The streaming escaper is the one the emitters call and [`escape`] is a
/// buffer around it, so the two cannot be allowed to drift. It copies in
/// runs between the encoded characters, which is where a multi-byte
/// character would break it if the scan were not restricted to ASCII.
#[test]
fn the_streaming_escaper_appends_what_the_returning_one_returns() {
    for text in [
        "",
        "plain",
        "&<>\"'",
        "&&&",
        "a & b",
        "trailing&",
        "&leading",
        "é世 & <b>naïve</b> \u{1f600}",
    ] {
        let mut out = String::from("kept: ");
        escape_into(text, &mut out);
        assert_eq!(out, format!("kept: {}", escape(text)), "{text:?}");
    }
}

/// Same obligation one layer up: a form is a run of fields appended into one
/// buffer, and the two ways to get one have to agree byte for byte.
#[test]
fn a_streamed_field_is_the_field_the_other_form_returns() {
    let kinds = [
        FieldKind::Text,
        FieldKind::Secret,
        FieldKind::Number,
        FieldKind::Checkbox,
        FieldKind::Radio,
        FieldKind::Select,
        FieldKind::Textarea,
        FieldKind::File,
        FieldKind::Hidden,
    ];
    let choices = [Choice::plain("one"), Choice::plain("two")];
    let opts = Emit {
        class_prefix: "mk-",
        ..Emit::default()
    };
    for kind in kinds {
        let described = Field {
            hint: Some("a hint"),
            error: Some("wrong <here>"),
            placeholder: Some("x\" y"),
            options: &choices,
            required: true,
            max_length: Some(40),
            min: Some("1"),
            max: Some("9"),
            extended: true,
            ..Field::new(kind, "the & name", "The <label>")
        };
        let filling = Filling {
            value: Value::Text("one"),
            trailing: Some(Markup("<i>t</i>")),
            control_attrs: Some(Markup(r#"data-host="1""#)),
            id_prefix: Some("modal"),
        };
        let mut streamed = String::new();
        field_html_into(&described, &filling, &opts, &mut streamed);
        assert_eq!(
            streamed,
            field_html(&described, &filling, &opts),
            "{kind:?}"
        );

        // And the bare field, where every optional half is absent.
        let plain = Field::new(kind, "name", "Label");
        let mut streamed = String::new();
        field_html_into(&plain, &Filling::default(), &opts, &mut streamed);
        assert_eq!(
            streamed,
            field_html(&plain, &Filling::default(), &opts),
            "{kind:?}"
        );
    }
}

#[test]
fn markup_is_the_only_way_past_the_escaping() {
    let filling = Filling {
        trailing: Some(Markup("<div class=\"recurrence-config\"></div>")),
        ..Filling::default()
    };
    let html = field_html(&field(FieldKind::Text), &filling, &Emit::default());
    assert!(
        html.contains("<div class=\"recurrence-config\"></div>"),
        "{html}"
    );
}

#[test]
fn an_invalid_field_carries_the_attribute_its_own_stylesheet_keys_on() {
    let mut f = field(FieldKind::Text);
    f.error = Some("Required");
    let opts = Emit::default();
    let html = field_html(&f, &Filling::default(), &opts);
    assert!(html.contains("aria-invalid=\"true\""), "{html}");
    // The selector the CSS side emits for exactly this state.
    assert!(crate::stylesheet(&opts).contains("[aria-invalid=\"true\"]"));
    // And the group is marked too, which a renderer without descendant
    // selectors depends on.
    assert!(html.contains("has-error"), "{html}");
}

#[test]
fn a_valid_field_claims_nothing_about_being_invalid() {
    let html = field_html(
        &field(FieldKind::Text),
        &Filling::default(),
        &Emit::default(),
    );
    assert!(!html.contains("aria-invalid"), "{html}");
    assert!(!html.contains("has-error"), "{html}");
}

#[test]
fn a_note_sits_between_the_hint_and_the_error_and_carries_its_tone() {
    let mut f = field(FieldKind::Text);
    f.hint = Some("Keep it short");
    f.note = Some((Tone::Warning, "Re-encoding drops embedded BWF"));
    f.error = Some("Required");
    let html = field_html(&f, &Filling::default(), &Emit::default());

    // All three associated, in the order they are drawn.
    assert!(
        html.contains(r#"aria-describedby="title-hint title-note title-error""#),
        "{html}"
    );
    assert!(
        html.contains(r#"id="title-note" role="alert" data-tone="warning""#),
        "{html}"
    );
    // And in that order in the document, so the reading order matches.
    let hint = html.find("title-hint").unwrap();
    let note = html.rfind("title-note").unwrap();
    let err = html.rfind("title-error").unwrap();
    assert!(hint < note && note < err, "{html}");
}

#[test]
fn a_quiet_note_is_polite_and_wears_no_tone_attribute() {
    // Neutral is the bare class, matching every other toned component
    // here, and only Warning and Danger interrupt.
    let mut f = field(FieldKind::Text);
    f.note = Some((Tone::Info, "This is what that setting implies"));
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains(r#"role="status" data-tone="info""#), "{html}");

    f.note = Some((Tone::Neutral, "An ordinary fact"));
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains(r#"id="title-note" role="status">"#), "{html}");
    assert!(!html.contains("data-tone"), "{html}");
}

#[test]
fn a_note_does_not_mark_the_group_invalid() {
    // `Field::invalid` stays `error.is_some()`, and the renderer's
    // `has-error` follows it rather than any message being present.
    let mut f = field(FieldKind::Text);
    f.note = Some((Tone::Danger, "This cannot be undone"));
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(!html.contains("has-error"), "{html}");
    assert!(!html.contains(r#"aria-invalid="true""#), "{html}");
}

#[test]
fn the_hint_survives_an_error_arriving() {
    let mut f = field(FieldKind::Text);
    f.hint = Some("Keep it short");
    f.error = Some("Required");
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(
        html.contains("aria-describedby=\"title-hint title-error\""),
        "{html}"
    );
}

#[test]
fn a_secret_never_carries_its_value_into_the_markup() {
    let filling = Filling::of(Value::Text("hunter2"));
    let html = field_html(&field(FieldKind::Secret), &filling, &Emit::default());
    assert!(!html.contains("hunter2"), "{html}");
    assert!(html.contains("type=\"password\""), "{html}");
}

#[test]
fn a_hidden_field_is_the_input_and_nothing_else() {
    let filling = Filling::of(Value::Text("42"));
    let html = field_html(&field(FieldKind::Hidden), &filling, &Emit::default());
    assert_eq!(html, "<input type=\"hidden\" name=\"title\" value=\"42\">");
}

#[test]
fn a_checkbox_labels_itself_and_takes_no_separate_label() {
    let html = field_html(
        &field(FieldKind::Checkbox),
        &Filling::of(Value::On(true)),
        &Emit::default(),
    );
    assert!(!html.contains("form-label"), "{html}");
    assert!(html.contains("checked"), "{html}");
    assert!(html.contains("<span>Title</span>"), "{html}");
}

#[test]
fn a_select_keeps_a_value_no_option_carries() {
    let options = [Choice::plain("1"), Choice::plain("3"), Choice::plain("7")];
    let f = Field::select("title", "Title", &options);
    let html = field_html(&f, &Filling::of(Value::Text("10")), &Emit::default());
    assert!(html.contains("data-unmatched=\"true\""), "{html}");
    // Selected, so the next save round-trips it rather than writing the
    // first option over the top of it.
    assert!(html.contains("<option value=\"10\" selected"), "{html}");
}

#[test]
fn a_select_with_no_options_emits_an_empty_select() {
    // The description says a select with no options is sayable, because an
    // app whose option list has not loaded has exactly that. Emitting the
    // empty select reports it on screen rather than in a log.
    let f = Field::select("title", "Title", &[]);
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("<select"), "{html}");
    assert!(!html.contains("<option"), "{html}");
}

#[test]
fn an_unanswered_select_shows_its_ghost_text_and_cannot_be_chosen_back() {
    let options = [Choice::new("sp404", "SP-404")];
    let f = Field {
        placeholder: Some("Select device..."),
        ..Field::select("device", "Conform for device", &options)
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert!(
        html.contains("<option value=\"\" disabled selected>Select device...</option>"),
        "{html}"
    );
    // First, so the closed control reads it rather than the first real
    // option.
    assert!(
        html.find("Select device...") < html.find("SP-404"),
        "{html}"
    );
}

#[test]
fn an_answered_select_drops_the_ghost_text() {
    // It is an instruction about an empty field, so it has nothing to say
    // once the field is answered, and leaving it in the list is one dead
    // row every time the control is opened afterwards.
    let options = [Choice::new("sp404", "SP-404")];
    let f = Field {
        placeholder: Some("Select device..."),
        ..Field::select("device", "Conform for device", &options)
    };
    let html = field_html(&f, &Filling::of(Value::Text("sp404")), &Emit::default());
    assert!(!html.contains("Select device..."), "{html}");
}

#[test]
fn a_wrong_answer_is_kept_and_is_not_the_ghost_text() {
    // The two paths through `push_options` meet here. An unmatched value is
    // an answer that is wrong and stays visible as itself; only the empty
    // value is unanswered.
    let options = [Choice::plain("1"), Choice::plain("7")];
    let f = Field {
        placeholder: Some("Pick one"),
        ..Field::select("retention", "Keep backups for", &options)
    };
    let html = field_html(&f, &Filling::of(Value::Text("10")), &Emit::default());
    assert!(html.contains("data-unmatched=\"true\""), "{html}");
    assert!(!html.contains("Pick one"), "{html}");
}

#[test]
fn a_range_is_a_range_input_and_carries_its_extent() {
    let f = Field {
        curve: Curve::Linear { step: Some("0.01") },
        ..Field::range("review", "Review above", "0", "1")
    };
    let html = field_html(&f, &Filling::of(Value::Text("0.72")), &Emit::default());
    assert!(html.contains("type=\"range\""), "{html}");
    assert!(html.contains("min=\"0\""), "{html}");
    assert!(html.contains("max=\"1\""), "{html}");
    // Without it the browser steps by 1 and a 0-to-1 question becomes a
    // two-position control.
    assert!(html.contains("step=\"0.01\""), "{html}");
}

#[test]
fn a_range_reads_its_granularity_off_the_curve_and_not_off_field_step() {
    // The 0.32.0 narrowing, at the renderer. `Field::step` on a range is a
    // site that has not been moved over, and emitting it would make the
    // control step by a number the curve never agreed to.
    let f = Field {
        step: Some("99"),
        ..Field::range("review", "Review above", "0", "1")
    };
    let html = field_html(&f, &Filling::of(Value::Text("0.5")), &Emit::default());
    assert!(!html.contains("step="), "{html}");
}

#[test]
fn a_unit_is_adjacent_text_and_the_control_points_at_it() {
    // Not decoration: the number and what it is measured in are one fact,
    // so the association is what makes this worth emitting at all.
    let f = Field {
        unit: Some("dBFS"),
        ..Field::range("threshold", "Threshold", "-96", "-20")
    };
    let html = field_html(&f, &Filling::of(Value::Text("-40")), &Emit::default());
    assert!(html.contains(r#"id="threshold-unit""#), "{html}");
    assert!(html.contains(">dBFS</span>"), "{html}");
    assert!(
        html.contains(r#"aria-describedby="threshold-unit""#),
        "{html}"
    );
    // The label is the question's name and keeps no unit in it.
    assert!(html.contains(">Threshold</label>"), "{html}");
}

#[test]
fn a_unit_takes_its_place_between_the_hint_and_the_error() {
    let f = Field {
        unit: Some("ms"),
        hint: Some("How long the fade runs."),
        error: Some("Too long."),
        ..Field::new(FieldKind::Number, "fade", "Fade")
    };
    let html = field_html(&f, &Filling::of(Value::Text("50")), &Emit::default());
    assert!(
        html.contains(r#"aria-describedby="fade-hint fade-unit fade-error""#),
        "{html}"
    );
}

#[test]
fn a_unit_on_a_kind_that_is_not_a_quantity_is_ignored() {
    // Sayable and ignored, the way `options` is on a kind that offers none.
    // The renderer asks the description which kinds are measurable rather
    // than keeping its own list.
    let f = Field {
        unit: Some("s"),
        ..Field::new(FieldKind::Text, "name", "Name")
    };
    let html = field_html(&f, &Filling::of(Value::Text("kick")), &Emit::default());
    assert!(!html.contains("name-unit"), "{html}");
    assert!(!html.contains("aria-describedby"), "{html}");
}

#[test]
fn a_unit_cannot_break_out_of_the_span_it_sits_in() {
    let f = Field {
        unit: Some("</span><script>"),
        ..Field::new(FieldKind::Number, "n", "N")
    };
    let html = field_html(&f, &Filling::of(Value::Text("1")), &Emit::default());
    assert!(!html.contains("<script>"), "{html}");
    assert!(html.contains("&lt;script&gt;"), "{html}");
}

#[test]
fn a_constant_ratio_curve_is_answered_with_a_linear_track() {
    // The decided answer, not a shortfall: HTML has no logarithmic range
    // input, so the browser draws the extent linearly. The value it submits
    // is still a value in the field's own units, which is what every
    // handler on this path reads. See the crate header.
    let f = Field {
        curve: Curve::Logarithmic {
            step: Some("0.001"),
        },
        ..Field::range("attack", "Attack", "0.001", "5")
    };
    let html = field_html(&f, &Filling::of(Value::Text("0.005")), &Emit::default());
    assert!(html.contains("type=\"range\""), "{html}");
    assert!(html.contains("min=\"0.001\""), "{html}");
    assert!(html.contains("max=\"5\""), "{html}");
    assert!(html.contains("step=\"0.001\""), "{html}");
}

#[test]
fn a_number_with_bounds_is_still_typed_into() {
    // The distinction the kind exists for, at the renderer where getting it
    // wrong is most visible: goingson's `min="1"` duration must not come
    // back as a slider.
    let f = Field {
        min: Some("1"),
        ..Field::new(FieldKind::Number, "minutes", "Minutes")
    };
    let html = field_html(&f, &Filling::of(Value::Text("30")), &Emit::default());
    assert!(html.contains("type=\"number\""), "{html}");
    assert!(!html.contains("type=\"range\""), "{html}");
    // And nothing invents a step for it.
    assert!(!html.contains("step="), "{html}");
}

#[test]
fn an_unavailable_option_is_disabled_and_says_why() {
    let options = [
        Choice::new("chromatic", "Chromatic"),
        Choice::new("multi", "Multi-sample").unless("Drop a second sample."),
    ];
    let f = Field::radio("mode", "Mode", &options);
    let html = field_html(&f, &Filling::of(Value::Text("chromatic")), &Emit::default());

    assert!(html.contains(" disabled"), "{html}");
    assert!(html.contains("Drop a second sample."), "{html}");
    // The option is still offered: dropping it is what costs the user the
    // knowledge that the mode exists.
    assert!(html.contains("value=\"multi\""), "{html}");
    // And the reason is its own element, not run into the label.
    assert!(html.contains("form-option-reason"), "{html}");
}

#[test]
fn an_unavailable_select_option_carries_its_reason_in_its_text() {
    // A `<select>` gives an option no room for a second element, so the
    // reason has to be in the text or be unreadable without a pointer.
    let options = [Choice::new("multi", "Multi-sample").unless("Drop a second sample.")];
    let f = Field::select("mode", "Mode", &options);
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(
        html.contains(">Multi-sample: Drop a second sample.</option>"),
        "{html}"
    );
    assert!(html.contains("disabled"), "{html}");
}

#[test]
fn an_option_can_say_what_picking_it_means() {
    // makeover-layout 0.39.0. A radio group has room, so the line gets its
    // own element under the label, and it is muted rather than unruled: an
    // unruled second line renders identically to the label above it, which
    // is a worse default than the markup this replaces.
    let options = [
        Choice::new("16", "Basic").detailing("$16/mo. Fits text, blogs, newsletters."),
        Choice::new("24", "Small Files"),
    ];
    let f = Field::radio("tier", "Content tier", &options);
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert!(html.contains("form-option-detail"), "{html}");
    assert!(
        html.contains(">$16/mo. Fits text, blogs, newsletters.</span>"),
        "{html}"
    );
    // One option carries it and the other does not, so the class appears
    // once rather than on every label.
    assert_eq!(html.matches("form-option-detail").count(), 1, "{html}");
    assert!(
        option_detail_rules(&Emit::default()).contains("var(--content-muted)"),
        "the line orients the label rather than competing with it"
    );
}

#[test]
fn an_option_reads_what_it_is_before_why_it_cannot_be_picked() {
    // Two different sentences, drawn in the order they read in. A tier that
    // is sold out is still a tier the reader is owed a description of.
    let options = [Choice::new("24", "Small Files")
        .detailing("$24/mo. Fits audio, plugins, binaries.")
        .unless("Sold out while the founder window is open.")];
    let f = Field::radio("tier", "Content tier", &options);
    let html = field_html(&f, &Filling::default(), &Emit::default());

    let detail = html.find("form-option-detail").expect("the detail");
    let reason = html.find("form-option-reason").expect("the reason");
    assert!(detail < reason, "{html}");
    assert!(html.contains(" disabled"), "{html}");

    // A `<select>` has room for neither element, so both run into the
    // row's own text in the same order.
    let f = Field::select("tier", "Content tier", &options);
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(
        html.contains(concat!(
            ">Small Files: $24/mo. Fits audio, plugins, binaries.",
            ": Sold out while the founder window is open.</option>"
        )),
        "{html}"
    );
}

#[test]
fn a_radio_group_is_named_by_its_label_instead_of_pointing_at_it() {
    // The association inverts, and getting it wrong is silent: a
    // `<label for>` aimed at a group points at no element, so the group
    // simply has no accessible name and nothing reports that.
    let options = [Choice::plain("copy"), Choice::plain("reference")];
    let f = Field::radio("storage", "Storage style", &options);
    let html = field_html(&f, &Filling::of(Value::Text("copy")), &Emit::default());

    assert!(html.contains("id=\"storage-label\""), "{html}");
    assert!(!html.contains("for=\"storage\""), "{html}");
    assert!(html.contains("role=\"radiogroup\""), "{html}");
    assert!(html.contains("aria-labelledby=\"storage-label\""), "{html}");
}

#[test]
fn an_interval_is_one_labelled_group_holding_both_ends() {
    // The markup MNW's discover sidebar writes by hand, which is the
    // measurement that decided the member: `role="group"` naming the
    // question, two number boxes under it.
    let f = Field::interval("min_price", "max_price", "Price");
    let html = field_html(
        &f,
        &Filling::of(Value::Between {
            lower: "5",
            upper: "40",
        }),
        &Emit::default(),
    );

    assert!(html.contains("role=\"group\""), "{html}");
    assert!(
        html.contains("aria-labelledby=\"min_price-label\""),
        "{html}"
    );
    assert!(html.contains("id=\"min_price-label\""), "{html}");
    assert!(!html.contains("for=\"min_price\""), "{html}");
    assert!(html.contains("name=\"min_price\""), "{html}");
    assert!(html.contains("name=\"max_price\""), "{html}");
    assert!(html.contains("value=\"5\""), "{html}");
    assert!(html.contains("value=\"40\""), "{html}");
    assert_eq!(html.matches("type=\"number\"").count(), 2, "{html}");
}

#[test]
fn both_ends_of_an_interval_take_the_whole_extent() {
    // The extent describes the axis rather than either end of it, so a
    // browser refuses the same values in both boxes.
    let f = Field {
        min: Some("0"),
        max: Some("300"),
        step: Some("1"),
        ..Field::interval("bpm_min", "bpm_max", "BPM")
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert_eq!(html.matches("min=\"0\"").count(), 2, "{html}");
    assert_eq!(html.matches("max=\"300\"").count(), 2, "{html}");
    assert_eq!(html.matches("step=\"1\"").count(), 2, "{html}");
    // Neither box holds anything, which is the open interval rather than an
    // empty form: no filter on this axis at all.
    assert_eq!(html.matches("value=\"\"").count(), 2, "{html}");
}

#[test]
fn an_interval_carries_the_fault_on_the_group_and_not_on_one_end() {
    // A crossed interval is wrong about the answer, and the answer is the
    // pair. This is the half two `Number` fields could not say.
    let f = Field {
        error: Some("The high end is below the low one."),
        hint: Some("Leave an end empty for no bound."),
        ..Field::interval("bpm_min", "bpm_max", "BPM")
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert_eq!(html.matches("aria-invalid=\"true\"").count(), 1, "{html}");
    let group = html.find("role=\"group\"").expect("group");
    let invalid = html.find("aria-invalid").expect("invalid");
    let first_input = html.find("<input").expect("input");
    assert!(invalid > group && invalid < first_input, "{html}");
    assert!(
        html.contains("aria-describedby=\"bpm_min-hint bpm_min-error\""),
        "{html}"
    );
}

#[test]
fn an_interval_with_one_end_named_draws_one_box() {
    // Drawn as described rather than repaired. Inventing a name for the
    // upper end would submit a parameter no handler reads, and
    // `Field::interval` is what makes the omission unsayable at the source.
    let f = Field::new(FieldKind::Interval, "bpm_min", "BPM");
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert_eq!(html.matches("<input").count(), 1, "{html}");
    assert!(html.contains("name=\"bpm_min\""), "{html}");
}

#[test]
fn every_option_shares_the_name_and_only_the_current_one_is_checked() {
    // One `name` is what makes them one answer rather than three; distinct
    // ids are what keep each `<label>` wrapping its own input.
    let options = [
        Choice::plain("copy"),
        Choice::plain("reference"),
        Choice::plain("link"),
    ];
    let f = Field::radio("storage", "Storage style", &options);
    let html = field_html(&f, &Filling::of(Value::Text("reference")), &Emit::default());

    assert_eq!(html.matches("name=\"storage\"").count(), 3, "{html}");
    assert_eq!(html.matches(" checked").count(), 1, "{html}");
    assert!(
        html.contains("value=\"reference\" checked"),
        "the checked one is the one held: {html}"
    );
    for index in 0..3 {
        assert!(html.contains(&format!("id=\"storage-{index}\"")), "{html}");
    }
}

#[test]
fn a_radio_group_carries_the_error_rather_than_any_one_option() {
    // What is wrong is the answer, not one of the alternatives, so marking
    // a single input invalid would say something false. Same reading
    // `Field::invalid` gives one level up.
    let options = [Choice::plain("copy"), Choice::plain("reference")];
    let f = Field {
        error: Some("Pick one."),
        hint: Some("Cannot be changed later."),
        ..Field::radio("storage", "Storage style", &options)
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert_eq!(html.matches("aria-invalid=\"true\"").count(), 1, "{html}");
    assert!(
        html.contains("aria-describedby=\"storage-hint storage-error\""),
        "{html}"
    );
    // The group is the element that carries them, so they land before the
    // first option rather than on it.
    let group = html.find("role=\"radiogroup\"").expect("group");
    let first = html.find("type=\"radio\"").expect("an option");
    assert!(group < first, "{html}");
}

#[test]
fn a_compulsory_radio_group_marks_every_option() {
    // How HTML says a group is compulsory: the constraint reads as
    // satisfied when any one of them is checked.
    let options = [Choice::plain("copy"), Choice::plain("reference")];
    let f = Field {
        required: true,
        ..Field::radio("storage", "Storage style", &options)
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert_eq!(html.matches(" required").count(), 2, "{html}");
}

#[test]
fn a_radio_option_cannot_break_out_of_its_attribute() {
    // Values are `&str` and carry whatever the app put in them. The ids are
    // numbered rather than derived from the value for the same reason.
    let hostile = [Choice::new(
        "x\" onclick=alert(1) data-x=\"",
        "<script>alert(1)</script>",
    )];
    let f = Field::radio("storage", "Storage style", &hostile);
    let html = field_html(&f, &Filling::default(), &Emit::default());

    // The payload survives as text; what must not survive is the quote
    // that would end the attribute and let the rest of it become markup.
    assert!(html.contains("value=\"x&quot; onclick=alert(1)"), "{html}");
    assert!(!html.contains("<script>"), "{html}");
    assert!(html.contains("id=\"storage-0\""), "{html}");
}

#[test]
fn a_radio_group_with_no_options_emits_an_empty_group() {
    // Same position the select takes, and the description's own.
    let f = Field::radio("storage", "Storage style", &[]);
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("role=\"radiogroup\""), "{html}");
    assert!(!html.contains("type=\"radio\""), "{html}");
}

#[test]
fn a_placeholder_comes_off_the_description_and_is_escaped() {
    // It arrived in `Filling` until makeover-layout 0.8.0 and was never
    // covered here; it is a value in an attribute like any other.
    let f = Field {
        placeholder: Some("x\" onfocus=alert(1) autofocus=\""),
        ..field(FieldKind::Text)
    };
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("placeholder=\""), "{html}");
    assert!(!html.contains("\" onfocus"), "{html}");
}

#[test]
fn a_select_marks_the_option_that_matches() {
    let options = [Choice::plain("1"), Choice::plain("3")];
    let f = Field::select("title", "Title", &options);
    let html = field_html(&f, &Filling::of(Value::Text("3")), &Emit::default());
    assert!(
        html.contains("<option value=\"3\" selected>3</option>"),
        "{html}"
    );
    assert!(html.contains("<option value=\"1\">1</option>"), "{html}");
    assert!(!html.contains("data-unmatched"), "{html}");
}

#[test]
fn a_textarea_carries_its_value_as_text_and_not_as_an_attribute() {
    let filling = Filling::of(Value::Text("two\nlines"));
    let html = field_html(&field(FieldKind::Textarea), &filling, &Emit::default());
    assert!(html.contains(">two\nlines</textarea>"), "{html}");
}

#[test]
fn a_markdown_field_is_a_textarea_that_says_what_its_value_is() {
    // The mark is the whole difference. Without it a described editor is a
    // plain box, and an enhancement looking for editors to upgrade has
    // nothing to find -- which is the state MNW's four hand-written section
    // editors would have had to keep living in.
    let filling = Filling::of(Value::Text("# Heading"));
    let html = field_html(&field(FieldKind::Rich), &filling, &Emit::default());
    assert!(html.contains("<textarea"), "{html}");
    assert!(html.contains(r#"data-format="markdown""#), "{html}");
    assert!(html.contains("># Heading</textarea>"), "{html}");

    // A plain textarea claims nothing about its value, so the marker has to
    // be absent rather than present-and-different.
    let plain = field_html(&field(FieldKind::Textarea), &filling, &Emit::default());
    assert!(!plain.contains("data-format"), "{plain}");

    // And it is not an input: the catch-all in `input_type` would have
    // degraded it to a single-line text box, which is the wrong shape for
    // markdown rather than a lossless fallback.
    assert!(!html.contains("<input"), "{html}");
}

#[test]
fn a_markdown_field_gets_the_preview_the_member_permits() {
    // The mark on its own is what 0.50.0 shipped, and nothing read it. What
    // a conversion needs is the pair MNW's `partial-item-text-editor.js`
    // already draws, so describing the field is not a way to lose it.
    let filling = Filling::of(Value::Text("# Heading"));
    let html = field_html(&field(FieldKind::Rich), &filling, &Emit::default());
    assert!(html.contains("data-editor-mode=\"write\""), "{html}");
    assert!(html.contains("data-editor-mode=\"preview\""), "{html}");
    assert!(html.contains("data-editor-preview"), "{html}");
    // Write is the mode a fresh editor is in, and the segment says so twice
    // because the sheet reads one and a screen reader reads the other.
    assert!(
        html.contains("class=\"segment chosen\" data-editor-mode=\"write\" aria-pressed=\"true\""),
        "{html}"
    );
    assert!(
        html.contains("data-editor-mode=\"preview\" aria-pressed=\"false\""),
        "{html}"
    );
    // The value is still the textarea's, and still text rather than an
    // attribute. The chrome sits around the control, not in place of it.
    assert!(html.contains("># Heading</textarea>"), "{html}");
}

#[test]
fn a_plain_textarea_gets_no_editor_chrome() {
    let filling = Filling::of(Value::Text("plain"));
    let html = field_html(&field(FieldKind::Textarea), &filling, &Emit::default());
    assert!(!html.contains("data-editor-mode"), "{html}");
    assert!(!html.contains("data-editor-preview"), "{html}");
    assert!(!html.contains("segment"), "{html}");
}

#[test]
fn nothing_the_editor_emits_renders_the_value_as_markup() {
    // The whole of this crate's half of the sanitising question: the pane is
    // empty, so no value reaches markup through it, and the host's own
    // renderer keeps the guarantee it already has.
    let filling = Filling::of(Value::Text("<img src=x onerror=alert(1)>"));
    let html = field_html(&field(FieldKind::Rich), &filling, &Emit::default());
    assert!(html.contains("data-editor-preview></div>"), "{html}");
    assert!(!html.contains("<img"), "{html}");
    assert!(
        html.contains("&lt;img src=x onerror=alert(1)&gt;"),
        "{html}"
    );
}

#[test]
fn the_editor_rules_gate_on_the_attribute_and_on_a_binding() {
    let css = editor_rules(&Emit::default());
    // Behind the attribute, which is the reason the mark is an attribute:
    // a class-keyed gate would be prefixed away from the enhancement that
    // selects on it.
    for line in css.lines().filter(|line| line.contains('{')) {
        assert!(line.contains("[data-format=\"markdown\"]"), "{line}");
    }
    // Nothing is hidden and no control appears until something binds the
    // editor. A reader with no script gets the textarea alone.
    assert!(
        css.contains("[data-format=\"markdown\"] > .form-editor-modes {\n    display: none;\n}")
    );
    assert!(css.contains(
        "[data-format=\"markdown\"][data-ready] > .form-editor-modes {\n    display: block;\n}"
    ));
    assert!(css.contains(
        "[data-ready][data-mode=\"preview\"] > .form-editor-preview {\n    display: block;\n}"
    ));
    assert!(css.contains("[data-ready][data-mode=\"preview\"] > .field {\n    display: none;\n}"));
    // No magnitude, the line this crate holds everywhere else.
    assert!(!css.contains("px"), "{css}");
    assert!(!css.contains("rem"), "{css}");
}

/// The prefix reaches the chrome as well, and the gate deliberately does
/// not: an app assembling the sheet with its own prefix still has the
/// selector an enhancement finds the editors by.
#[test]
fn the_editor_chrome_is_prefixed_and_its_gate_is_not() {
    let opts = Emit {
        class_prefix: "mk-",
        ..Emit::default()
    };
    let html = field_html(&field(FieldKind::Rich), &Filling::default(), &opts);
    assert!(html.contains("class=\"mk-form-editor-modes\""), "{html}");
    assert!(html.contains("class=\"mk-form-editor-preview\""), "{html}");
    assert!(html.contains("class=\"mk-segment chosen\""), "{html}");
    assert!(html.contains("data-format=\"markdown\""), "{html}");

    let css = editor_rules(&opts);
    assert!(css.contains(".mk-form-editor-modes"), "{css}");
    assert!(css.contains("[data-format=\"markdown\"]"), "{css}");
}

/// Every class the editor puts in markup is one the generated sheet rules,
/// which is `FACET_CLASSES`' obligation without a list to keep: these two
/// have rules, so the vocabulary seal picks them up from the sheet itself.
#[test]
fn the_editor_classes_are_in_the_vocabulary() {
    let opts = Emit::default();
    let names = crate::vocabulary::names(&opts);
    for name in ["form-editor-modes", "form-editor-preview", "segment"] {
        assert!(names.contains(name), "{name} is not in the vocabulary");
    }
}

#[test]
fn the_class_prefix_reaches_the_markup_as_well_as_the_stylesheet() {
    let opts = Emit {
        class_prefix: "mk-",
        ..Emit::default()
    };
    let html = field_html(&field(FieldKind::Text), &Filling::default(), &opts);
    assert!(html.contains("class=\"mk-form-group\""), "{html}");
    assert!(html.contains("class=\"mk-field\""), "{html}");
}

#[test]
fn a_datetime_asking_for_an_instant_is_marked_for_the_script_that_converts_it() {
    let mut f = field(FieldKind::DateTime);
    f.as_instant = true;
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("data-instant=\"true\""), "{html}");
    // The control is unchanged: the flag says what is submitted, not what
    // is drawn.
    assert!(html.contains("type=\"datetime-local\""), "{html}");
}

#[test]
fn only_a_datetime_can_name_a_moment_so_only_a_datetime_is_marked() {
    for kind in [FieldKind::Date, FieldKind::Text, FieldKind::Number] {
        let mut f = field(kind);
        f.as_instant = true;
        let html = field_html(&f, &Filling::default(), &Emit::default());
        assert!(!html.contains("data-instant"), "{kind:?}: {html}");
    }
}

#[test]
fn a_datetime_that_did_not_ask_carries_no_mark() {
    let html = field_html(
        &field(FieldKind::DateTime),
        &Filling::default(),
        &Emit::default(),
    );
    assert!(!html.contains("data-instant"), "{html}");
}

#[test]
fn an_extended_field_says_so_and_leaves_the_disclosure_to_the_form() {
    let mut f = field(FieldKind::Text);
    f.extended = true;
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("data-extended=\"true\""), "{html}");
}

/// The prefix scopes the id and leaves the name alone. Prefixing the name
/// too would change what the form submits, which is the failure this pair
/// of assertions exists to catch rather than describe.
#[test]
fn the_id_prefix_scopes_the_id_and_never_the_name() {
    let mut f = field(FieldKind::Text);
    f.hint = Some("Keep it short");
    f.error = Some("Required");
    let filling = Filling {
        id_prefix: Some("form-modal-task-edit"),
        ..Filling::default()
    };
    let html = field_html(&f, &filling, &Emit::default());

    assert!(
        html.contains(r#"id="form-modal-task-edit-title""#),
        "{html}"
    );
    assert!(html.contains(r#"name="title""#), "{html}");
    assert!(
        !html.contains(r#"name="form-modal-task-edit-title""#),
        "{html}"
    );

    // The label and both associations follow the id, or they point at
    // nothing once the same form is on screen twice.
    assert!(
        html.contains(r#"for="form-modal-task-edit-title""#),
        "{html}"
    );
    assert!(
        html.contains(
            r#"aria-describedby="form-modal-task-edit-title-hint form-modal-task-edit-title-error""#
        ),
        "{html}"
    );
    assert!(
        html.contains(r#"id="form-modal-task-edit-title-hint""#),
        "{html}"
    );
}

#[test]
fn a_hidden_field_submits_its_bare_name_under_a_prefix() {
    let filling = Filling {
        value: Value::Text("42"),
        id_prefix: Some("scoped"),
        ..Filling::default()
    };
    let html = field_html(&field(FieldKind::Hidden), &filling, &Emit::default());
    assert_eq!(html, r#"<input type="hidden" name="title" value="42">"#);
}

/// These three exist so a touch keyboard and the platform's validation
/// arrive with the field. Emitting text for any of them is the regression
/// the variants were added to prevent, so the type is asserted directly.
#[test]
fn a_constraint_becomes_the_browsers_own_attribute() {
    // makeover-layout 0.11.0's model: the description carries the rule and
    // each renderer emits its host's idiom for it. Enforcement is still
    // whoever validated's, and arrives back as `error`.
    let html = field_html(
        &Field {
            max_length: Some(100),
            min: Some("1"),
            max: Some("240"),
            required: true,
            ..Field::new(FieldKind::Number, "minutes", "Minutes")
        },
        &Filling::default(),
        &Emit::default(),
    );
    assert!(html.contains(r#"maxlength="100""#));
    assert!(html.contains(r#"min="1""#));
    assert!(html.contains(r#"max="240""#));
    assert!(html.contains(" required"));
}

#[test]
fn a_bound_is_emitted_as_written_and_escaped_like_anything_else() {
    // The bound is text because it is only a number for some of the kinds
    // that take one; goingson's own sites are a duration and a datetime.
    let html = field_html(
        &Field {
            min: Some("2026-08-09T14:30"),
            ..Field::new(FieldKind::Text, "starts", "Starts")
        },
        &Filling::default(),
        &Emit::default(),
    );
    assert!(html.contains(r#"min="2026-08-09T14:30""#));
}

#[test]
fn a_file_field_is_a_file_input() {
    // `844b5ae0`. A field that takes any file emits no `accept` at all,
    // which is the browser's own "any file". `accept=""` is a filter that
    // means nothing on one browser and everything on another.
    let html = field_html(
        &Field::new(FieldKind::File, "attachment", "Attachment"),
        &Filling::default(),
        &Emit::default(),
    );
    assert!(html.contains(r#"type="file""#));
    assert!(!html.contains("accept="));
    assert!(!html.contains("multiple"));
    // And it never carries a value: a file input's value is not settable
    // from markup, and the browser refuses one that tries.
    assert!(!html.contains("value="));
}

#[test]
fn an_accept_list_is_comma_joined_in_the_attributes_own_format() {
    // `f7261a5a`, makeover-layout 0.31.0. Each entry writes itself: a
    // family is its wildcard, a media type is itself, a suffix keeps its
    // leading dot and however many more it has.
    const MIXED: &[Accepted<'_>] = &[
        Accepted::Family(Family::Image),
        Accepted::Type("text/csv"),
        Accepted::Suffix(".tar.gz"),
    ];
    let html = field_html(
        &Field {
            multiple: true,
            ..Field::upload("drop", "Drop files", MIXED)
        },
        &Filling::default(),
        &Emit::default(),
    );
    assert!(
        html.contains(r#"accept="image/*,text/csv,.tar.gz""#),
        "{html}"
    );
    assert!(html.contains(" multiple"), "{html}");
}

#[test]
fn an_accept_entry_cannot_end_the_attribute_it_sits_in() {
    // The list reaches an attribute value, so it is escaped like every
    // other string that does. Nothing in the tree writes a quote into one;
    // that it cannot is the point.
    const HOSTILE: &[Accepted<'_>] = &[Accepted::Type(r#"image/x" onload="x"#)];
    let html = field_html(
        &Field::upload("cover", "Cover", HOSTILE),
        &Filling::default(),
        &Emit::default(),
    );
    assert!(!html.contains(r#"onload="x"#), "{html}");
}

#[test]
fn the_typed_text_kinds_keep_their_input_type() {
    for (kind, expected) in [
        (FieldKind::Email, "email"),
        (FieldKind::Url, "url"),
        (FieldKind::Tel, "tel"),
        (FieldKind::Date, "date"),
        (FieldKind::DateTime, "datetime-local"),
    ] {
        let html = field_html(&field(kind), &Filling::default(), &Emit::default());
        assert!(
            html.contains(&format!(r#"type="{expected}""#)),
            "{kind:?} emitted {html}"
        );
    }
}

#[test]
fn a_temporal_field_is_a_native_control_and_not_a_hinted_text_box() {
    // The regression this closes: described as text with a hint reading
    // "YYYY-MM-DD", which loses the picker, the platform's validation and
    // the touch keyboard, and asks prose to do all three.
    for kind in [FieldKind::Date, FieldKind::DateTime] {
        let html = field_html(&field(kind), &Filling::default(), &Emit::default());
        assert!(!html.contains(r#"type="text""#), "{kind:?} emitted {html}");
    }
}

#[test]
fn no_prefix_leaves_the_id_as_the_name() {
    let html = field_html(
        &field(FieldKind::Text),
        &Filling::default(),
        &Emit::default(),
    );
    assert!(html.contains(r#"id="title" name="title""#), "{html}");
}

/// Two variants and two tiers, which is the smallest list that can show
/// where a group opens and that two badges differ.
const THEMES: &[makeover_layout::ThemeChoice<'_>] = &[
    makeover_layout::ThemeChoice::new(
        "goingson",
        "GoingsOn",
        ThemeVariant::Light,
        makeover_layout::Contrast::High,
    ),
    makeover_layout::ThemeChoice::new(
        "ayu-light",
        "Ayu Light",
        ThemeVariant::Light,
        makeover_layout::Contrast::Low,
    ),
    makeover_layout::ThemeChoice::new(
        "carbonfox",
        "Carbonfox",
        ThemeVariant::Dark,
        makeover_layout::Contrast::High,
    ),
];

#[test]
fn a_theme_picker_opens_one_optgroup_per_variant() {
    let f = Field::theme("theme", "Theme", THEMES);
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert_eq!(html.matches("<optgroup").count(), 2, "{html}");
    assert_eq!(html.matches("</optgroup>").count(), 2, "{html}");
    assert!(
        html.contains(r#"<optgroup label="Light" data-variant="light">"#),
        "{html}"
    );
    assert!(
        html.contains(r#"<optgroup label="Dark" data-variant="dark">"#),
        "{html}"
    );
    // The two light themes share one group: a new group opens on a change
    // of variant and on nothing else.
    assert!(
        html.find("Ayu Light") < html.find("<optgroup label=\"Dark\""),
        "{html}"
    );
}

#[test]
fn every_theme_carries_its_measured_tier() {
    // The fact the three hand-written pickers lost. It rides in the text
    // because a `<select>`'s options take no elements, and in an attribute
    // because a stylesheet cannot read text.
    let f = Field::theme("theme", "Theme", THEMES);
    let html = field_html(&f, &Filling::default(), &Emit::default());

    assert!(html.contains(r#"data-contrast="high""#), "{html}");
    assert!(html.contains(r#"data-contrast="low""#), "{html}");
    assert!(html.contains("GoingsOn (AA)"), "{html}");
    assert!(html.contains("Ayu Light (low)"), "{html}");
}

#[test]
fn the_follow_row_is_first_and_sits_in_no_group() {
    // It names no theme and belongs to no variant, so grouping it would be
    // inventing a fourth variant for one row.
    let f =
        Field::theme("theme", "Theme", THEMES).following(Choice::new("system", "Follow System"));
    let html = field_html(&f, &Filling::default(), &Emit::default());

    let follow = html.find("Follow System").expect("the row was offered");
    assert!(follow < html.find("<optgroup").expect("groups"), "{html}");
}

#[test]
fn the_stored_theme_is_the_selected_one() {
    let f =
        Field::theme("theme", "Theme", THEMES).following(Choice::new("system", "Follow System"));

    let named = field_html(&f, &Filling::of(Value::Text("carbonfox")), &Emit::default());
    assert!(
        named.contains(r#"value="carbonfox" data-contrast="high" selected"#),
        "{named}"
    );
    assert!(!named.contains(r#"value="system" selected"#), "{named}");

    let following = field_html(&f, &Filling::of(Value::Text("system")), &Emit::default());
    assert!(
        following.contains(r#"value="system" selected"#),
        "{following}"
    );
}

#[test]
fn a_theme_that_is_no_longer_installed_keeps_its_value() {
    // `push_options`' rule, met again: a value no row carries is a wrong
    // answer rather than an absent one, and dropping it would save a
    // different theme over the user's on the next write.
    let f = Field::theme("theme", "Theme", THEMES);
    let html = field_html(
        &f,
        &Filling::of(Value::Text("deleted-theme")),
        &Emit::default(),
    );
    assert!(html.contains(r#"data-unmatched="true""#), "{html}");
    assert!(
        html.contains(r#"<option value="deleted-theme" selected"#),
        "{html}"
    );
}

#[test]
fn the_follow_row_is_not_a_stray_value() {
    // The near-miss: `system` is carried by no `ThemeChoice`, so a check
    // that only walked the theme list would emit a duplicate unmatched row
    // beside the real one.
    let f =
        Field::theme("theme", "Theme", THEMES).following(Choice::new("system", "Follow System"));
    let html = field_html(&f, &Filling::of(Value::Text("system")), &Emit::default());
    assert!(!html.contains("data-unmatched"), "{html}");
}

#[test]
fn a_machine_with_no_themes_still_gets_a_picker() {
    // `Field::themes`' own position: an app whose theme directories hold
    // nothing has exactly this, and the empty control says so on screen.
    let f = Field::theme("theme", "Theme", &[]).following(Choice::new("system", "Follow System"));
    let html = field_html(&f, &Filling::default(), &Emit::default());
    assert!(html.contains("<select"), "{html}");
    assert!(!html.contains("<optgroup"), "{html}");
    assert!(html.contains("Follow System"), "{html}");
}