Quelle test_moz_toggle.html Sprache: HTML

products/Sources/formale Sprachen/C/Firefox/toolkit/content/tests/widgets/test_moz_toggle.html

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>MozToggle tests</title>
  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" href="chrome://mochikit/content/tests/SimpleTest/test.css"/>
  <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
  
  <link rel="stylesheet" href="chrome://global/skin/in-content/common.css">
  <script type="module" src="chrome://global/content/elements/moz-toggle.mjs"></script>
  <script src="input-test-helpers.js"></script>
</head>
<body>
<script class="testbody" type="application/javascript">
  let testHelpers = new InputTestHelpers();

  add_setup(async function setup() {
    let { html } = await testHelpers.setupLit();
    let templateFn = (attrs, children) => html`
      <moz-toggle ${attrs}>${children}</moz-toggle>
    `;
    await testHelpers.setupInputTests({ templateFn });
    testHelpers.activatedProperty = "pressed";
  });

  add_task(async function testMozToggleProperties() {
    await testHelpers.testCommonInputProperties("moz-toggle");
  });

  add_task(async function testMozToggleInteraction() {
    let { trackEvent, verifyEvents } = testHelpers.getInputEventHelpers();
    let interactionTemplate = testHelpers.templateFn({ value: "default", label: "Label" });
    let renderTarget = await testHelpers.renderInputElements(interactionTemplate);
    const mozToggle = renderTarget.querySelector("moz-toggle");
    const button = mozToggle.buttonEl;
    mozToggle.pressed = true;
    await mozToggle.updateComplete;

    mozToggle.addEventListener("click", trackEvent);
    mozToggle.addEventListener("toggle", trackEvent);

    is(mozToggle.pressed, true, "moz-toggle is pressed initially");
    is(button.getAttribute("aria-pressed"), "true", "aria-pressed reflects the pressed state");

    synthesizeMouseAtCenter(button, {});
    await TestUtils.waitForTick();

    verifyEvents([
      { type: "click", localName: "moz-toggle", pressed: false, value: "default" },
      { type: "toggle", localName: "moz-toggle", pressed: false, value: "default" },
    ]);

    is(mozToggle.pressed, false, "The toggle pressed state changes on click");
    is(button.getAttribute("aria-pressed"), "false", "aria-pressed reflects this change");

    synthesizeMouseAtCenter(mozToggle.labelEl, {});
    await TestUtils.waitForTick();

    // Clicking the label element emits an additional click event that doesn't update the pressed state.
    verifyEvents([
      { type: "click", localName: "moz-toggle", pressed: false, value: "default" },
      { type: "click", localName: "moz-toggle", pressed: true, value: "default" },
      { type: "toggle", localName: "moz-toggle", pressed: true, value: "default" },
    ]);

    is(mozToggle.pressed, true, "The toggle pressed state changes on label click");
    is(button.getAttribute("aria-pressed"), "true", "aria-pressed reflects this change");

    mozToggle.focus();
    synthesizeKey(" ", {});
    await TestUtils.waitForTick();

    verifyEvents([
      { type: "click", localName: "moz-toggle", pressed: false, value: "default" },
      { type: "toggle", localName: "moz-toggle", pressed: false, value: "default" },
    ]);

    is(mozToggle.pressed, false, "The toggle pressed state can be changed via space bar");
    is(button.getAttribute("aria-pressed"), "false", "aria-pressed reflects this change");

    synthesizeMouseAtCenter(mozToggle.descriptionEl, {});
    await TestUtils.waitForTick();

    verifyEvents([]);

    isnot(
      mozToggle.shadowRoot.activeElement,
      mozToggle.buttonEl,
      "Clicking the description should not focus the toggle button"
    );
  });

  add_task(async function testMozToggleWithoutVisibleLabel() {
    const ARIA_LABEL = "I'm not visible";
    let ariaLabelTemplate = testHelpers.templateFn({
      value: "default",
      "aria-label": ARIA_LABEL,
    });
    let renderTarget = await testHelpers.renderInputElements(ariaLabelTemplate);
    let mozToggle = renderTarget.querySelector("moz-toggle");

    let labelText = mozToggle.shadowRoot.querySelector(".text");
    ok(!labelText, "No visible label text is rendered.");
    ok(
      !mozToggle.getAttribute("aria-label"),
      "aria-label is not set on the outer toggle element."
    );
    is(
      mozToggle.buttonEl.getAttribute("aria-label"),
      ARIA_LABEL,
      "The aria-label is set on the button element."
    );
  });
</script>
</pre>
</body>
</html>

Messung V0.5

¤ Dauer der Verarbeitung: 0.15 Sekunden (vorverarbeitet) ¤

Wurzel

Suchen

Beweissystem der NASA

Beweissystem Isabelle

NIST Cobol Testsuite

Cephes Mathematical Library

Wiener Entwicklungsmethode

Haftungshinweis

Die Informationen auf dieser Webseite wurden nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit, noch Qualität der bereit gestellten Informationen zugesichert.

Bemerkung:

Die farbliche Syntaxdarstellung und die Messung sind noch experimentell.