tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

browser_accessibility_relation_navigation.js (4462B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 * http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 const {
      7  L10N,
      8 } = require("resource://devtools/client/accessibility/utils/l10n.js");
      9 
     10 const TEST_URI = `<html>
     11  <head>
     12    <meta charset="utf-8"/>
     13    <title>Accessibility Panel Test</title>
     14  </head>
     15  <body>
     16    <h1>Top level header</h1>
     17    <p>This is a paragraph.</p>
     18  </body>
     19 </html>`;
     20 
     21 /**
     22 * Test data has the format of:
     23 * {
     24 *   desc     {String}    description for better logging
     25 *   setup   {Function}  An optional setup that needs to be performed before
     26 *                        the state of the tree and the sidebar can be checked.
     27 *   expected {JSON}      An expected states for the tree and the sidebar.
     28 * }
     29 */
     30 const tests = [
     31  {
     32    desc: "Test the initial accessibility tree and sidebar states.",
     33    expected: {
     34      tree: [
     35        {
     36          role: "document",
     37          name: `"Accessibility Panel Test"`,
     38        },
     39      ],
     40      sidebar: {
     41        name: "Accessibility Panel Test",
     42        role: "document",
     43        actions: [],
     44        value: "",
     45        description: "",
     46        keyboardShortcut: "",
     47        childCount: 2,
     48        indexInParent: 0,
     49        states: [
     50          // The focused state is an outdated state, since the toolbox should now
     51          // have the focus and not the content page. See Bug 1702709.
     52          "focused",
     53          "readonly",
     54          "focusable",
     55          "selectable text",
     56          "opaque",
     57          "enabled",
     58          "sensitive",
     59        ],
     60      },
     61    },
     62  },
     63  {
     64    desc: "Expand first tree node.",
     65    setup: ({ doc }) => toggleRow(doc, 0),
     66    expected: {
     67      tree: [
     68        {
     69          role: "document",
     70          name: `"Accessibility Panel Test"`,
     71        },
     72        {
     73          role: "heading",
     74          name: `"Top level header"`,
     75        },
     76        {
     77          role: "paragraph",
     78          name: `""`,
     79        },
     80      ],
     81    },
     82  },
     83  {
     84    desc: "Select second tree node.",
     85    setup: ({ doc }) => selectRow(doc, 1),
     86    expected: {
     87      sidebar: {
     88        name: "Top level header",
     89        role: "heading",
     90        actions: [],
     91        value: "",
     92        description: "",
     93        keyboardShortcut: "",
     94        childCount: 1,
     95        indexInParent: 0,
     96        relations: {
     97          "containing document": {
     98            role: "document",
     99            name: "Accessibility Panel Test",
    100          },
    101        },
    102        states: ["selectable text", "opaque", "enabled", "sensitive"],
    103      },
    104    },
    105  },
    106  {
    107    desc: "Select containing document.",
    108    setup: async ({ doc, win }) => {
    109      const relations = await selectProperty(doc, "/relations");
    110      AccessibilityUtils.setEnv({
    111        // Keyboard navigation is handled on the container level using arrow
    112        // keys.
    113        mustHaveAccessibleRule: false,
    114      });
    115      EventUtils.sendMouseEvent(
    116        { type: "click" },
    117        relations.querySelector(".theme-twisty"),
    118        win
    119      );
    120      AccessibilityUtils.resetEnv();
    121      const containingDocRelation = await selectProperty(
    122        doc,
    123        "/relations/containing document"
    124      );
    125      AccessibilityUtils.setEnv({
    126        // Keyboard interaction is only enabled when the row is selected and
    127        // activated.
    128        nonNegativeTabIndexRule: false,
    129      });
    130 
    131      const selectElementInTreeButton = containingDocRelation.querySelector(
    132        ".open-accessibility-inspector"
    133      );
    134      ok(!!selectElementInTreeButton, "There's a button to select the element");
    135      is(
    136        selectElementInTreeButton.getAttribute("title"),
    137        L10N.getStr("accessibility.accessible.selectElement.title"),
    138        "The button has the expected title"
    139      );
    140      EventUtils.sendMouseEvent(
    141        { type: "click" },
    142        selectElementInTreeButton,
    143        win
    144      );
    145      AccessibilityUtils.resetEnv();
    146    },
    147    expected: {
    148      sidebar: {
    149        name: "Accessibility Panel Test",
    150        role: "document",
    151        actions: [],
    152        value: "",
    153        description: "",
    154        keyboardShortcut: "",
    155        childCount: 2,
    156        indexInParent: 0,
    157        states: [
    158          "readonly",
    159          "focusable",
    160          "selectable text",
    161          "opaque",
    162          "enabled",
    163          "sensitive",
    164        ],
    165      },
    166    },
    167  },
    168 ];
    169 
    170 /**
    171 * Check navigation within the tree.
    172 */
    173 addA11yPanelTestsTask(
    174  tests,
    175  TEST_URI,
    176  "Test Accessibility panel relation navigation."
    177 );