Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: browsingData.settings()
slug: Mozilla/Add-ons/WebExtensions/API/browsingData/settings
page-type: webextension-api-property
page-type: webextension-api-function
browser-compat: webextensions.api.browsingData.settings
sidebar: addonsidebar
---
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/mozilla/firefox/releases/157/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ No notable changes.

#### General

- From now on, the recommended preferences will be restored at a different stage to avoid them being restored in the wrong profile.
- From now on, the recommended preferences will be restored at a different stage during shutdown.
([Firefox bug 2066531](https://bugzil.la/2066531)).

#### WebDriver BiDi
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,33 +22,25 @@ ARIA tree views are navigated primarily with arrow keys on the keyboard instead
> [!WARNING]
> Tree views use navigation more similar to native applications than to web applications. For this reason, consider alternative options to address the functionality you need before creating a tree view.

For more information about how individual tree nodes should be marked up, see [`treeitem`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/treeitem_role).

### Single and multiple select trees

Trees can be "single-select", allowing users to choose just one item for an action, or "multi-select", where users are able to select more than one item for an action. In multi-select trees, the `tree` has [`aria-multiselectable`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-multiselectable) set to true. Otherwise, `aria-multiselectable` is either set to `false` or the default value of `false` is implied. In both cases, to be keyboard accessible, focus must be managed for all tree descendants.

In some implementations of single-select tree, the focused item also has a selected state; this is known as "selection follows focus". When a single-select tree receives focus, if none of the tree items are selected before the tree receives focus, focus is set on the first node. If a tree item is selected before the tree receives focus, focus is set on the selected tree item. In single-select trees, [`aria-selected`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-selected) is set to `true` for the selected tree items and it is not present on any other tree item in the tree.

In multi-select trees, all selected tree items have `aria-selected="true"` set and all tree item nodes that are selectable but not currently selected have `aria-selected="false"` set. Do not include the `aria-selected` attribute on tree items that are not selectable.
In some implementations of single-select tree, the focused item also has a selected state; this is known as "selection follows focus". When a single-select tree receives focus, if none of the tree items are selected before the tree receives focus, focus is set on the first node. If a tree item is selected before the tree receives focus, focus is set on the selected tree item.

When a multi-select tree receives focus, if none of the tree items are selected before the tree receives focus, focus is set on the first tree item. If one or more tree items are selected before the tree receives focus, focus is set on the first selected node.

In multi-select trees, the selected state is always independent of the focus. For example, in a typical file system navigator, the user can move focus to select any number of files for an action, such as copy or move. The visual design should make it clear which items are selected and which item has focus.

### Tree hierarchy

In a tree view, the `tree` node is the root node; it can have child, grandchild, and further descendant `treeitem` nodes.

Each element serving as a tree node has role `treeitem`, except for the root tree node which has a role of `tree`. A `tree` does not have a parent `tree` node - it is the root node. If a node is both nested in a tree and has descendant tree items, then it has the role `treeitem` and the [`aria-expanded`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded) attribute; `aria-expanded="false"` is set when the node is in a closed state, `aria-expanded="true"` is set when the node is in an open state.

`treeitem` nodes can be direct children of the `tree` root node, nested within a `treeitem` node, or, optionally nested in a [`group`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/group_role) element, which, when nested in a `tree` is an expandable collection of treeitem elements.

Do not include `aria-expanded` on end nodes — those without tree item children — as that would incorrectly describe the node as a parent node to assistive technologies.
In a tree view, the `tree` element is the container for the hierarchy of `treeitem` nodes. Each element serving as a tree node has role `treeitem`. The top-level tree items are root nodes; they can have child, grandchild, and further descendant tree items.

### DOM placement and presence

All treeitems are contained in or owned by an element with role `tree`. If there are any tree items that are not direct descendants of the `tree` in the markup, include [`aria-owns`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-owns) on the owning tree container to include elements that are not DOM children of the container. These non-child owned elements will appear in the reading order in the sequence they are referenced and after any tree items that are DOM children. Scripts that manage focus need to ensure the visual focus order matches this assistive technology reading order.

If the complete set of available nodes is not present in the DOM due to dynamic loading as the user moves focus in or scrolls the tree, each node has [`aria-level`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-level), [`aria-setsize`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-setsize), and [`aria-posinset`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-posinset) specified.
All treeitems are contained in or owned by an element with role `tree`. If there are any root nodes that are not contained in the `tree` in the DOM, include [`aria-owns`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-owns) on the owning tree container to reference them. These non-descendant owned elements will appear in the reading order in the sequence they are referenced and after any tree items that are DOM descendants. Scripts that manage focus need to ensure the visual focus order matches this assistive technology reading order.

### Accessible name

Expand Down Expand Up @@ -92,8 +84,8 @@ For a vertically oriented `tree`, which is the default orientation:
<td>
<ul>
<li>When focus is on an open node, closes the node.
<li>When focus is on a root node that is also either an end node or a closed node, does nothing.
<li>When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
<li>When focus is on a closed tree, does nothing.
</td>
</tr>
<tr>
Expand All @@ -118,7 +110,7 @@ For a vertically oriented `tree`, which is the default orientation:
</tr>
<tr>
<td><kbd>Enter</kbd></td>
<td>Performs the default action of the currently focused node. For parent nodes, it opens or closes the node. In single-select trees, if the node has no children, selects the current node if not already selected (which is the default action).
<td>Performs the default action of the currently focused node. For parent nodes, opening or closing the node is one possible default action. In single-select trees, where selection does not follow focus, the default action typically selects the current node if it is not already selected.
</td>
</tr>
<tr>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,26 +13,28 @@ A `treeitem` is an item in a `tree`.

## Description

A [`tree`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/tree_role) is a hierarchical list with parent and child nodes that can expand and collapse. A `treeitem` is a node in a `tree`. The root of the tree is `tree`, but all tree nodes are `treeitem` elements, even if they themselves have nested `treeitem` nodes.
A [`tree`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/tree_role) is a hierarchical list with parent and child nodes that can expand and collapse. A `treeitem` is a node in a `tree`. The container for the tree has role `tree`, but all tree nodes are `treeitem` elements, even if they themselves have nested `treeitem` nodes.

An example of a `tree` is a file system selection user interface: a tree view displaying folders and files. Each folder and file is a `treeitem`. Folder items, which are `treeitem` elements, can be expanded to reveal the contents of the folder—which may be files, folders, or both, and are all `treeitems`—and collapsed, hiding its contents.

In a tree hierarchy, the _root node_ has the role `tree`. All other nodes, other than the root node, have the role of `treeitem`, whether or not they have children. A `treeitem` that is a parent is a **parent node**. A `treeitem` that is not a parent is an _end node_.
In a tree hierarchy, the top-level `treeitem` nodes are _root nodes_. A `treeitem` that is a parent is a **parent node**. A `treeitem` that is not a parent is an _end node_.

Tree items that have children can be expanded or collapsed, showing and hiding their children. A parent node that is expanded so its child nodes are visible is an **open node**. A parent node that is collapsed so the child nodes are not visible is a **closed node**.

Each parent node contains or owns an element with role [`group`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/group_role). A parent node is an expandable collection of `treeitem` elements. These child nodes are not direct descendants of the parent node: rather, they should be enclosed in an element with the `group` role.
Each parent node contains or owns an element with role [`group`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/group_role). The group is an expandable collection of `treeitem` elements. These child nodes are not direct children of the parent node: rather, they should be contained in or owned by the element with the `group` role.

Each parent node should include the [`aria-expanded`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded) attribute. It is set to `false` when closed `true` when open. End nodes should not have the `aria-expanded` attribute included as the presence of the attribute indicates to assistive technologies that the node is a parent.
Each parent node should include the [`aria-expanded`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded) attribute. It is set to `false` when closed and `true` when open. End nodes should not have the `aria-expanded` attribute included as the presence of the attribute indicates to assistive technologies that the node is a parent.

> [!NOTE]
> ARIA tree views use navigation more similar to native applications than to web applications and are navigated primarily with arrow keys on the keyboard instead of the <kbd>Tab</kbd>. This form of navigation is not common for most browser content, though normal and expected for native applications. For this reason, consider alternative options to address the functionality you need before creating a tree view.

Any element with a `treeitem` role must be nested in, or owned by, an element with role `tree`. Tree items can be a child of `tree`, `treeitem`, or an element with role `group` that is contained in, or owned by, an element with role `tree` or `treeitem`. If a `treeitem` is not nested within a `tree`, or nested in a `group` that is owned by a `tree`, include the [`id`](/en-US/docs/Web/HTML/Reference/Global_attributes/id) of the `treeitem` in the [`aria-owns`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-owns) attribute value on the owning `tree`, `treeitem` or `group` element.
Every `treeitem` must belong to a `tree`. Nest root items inside the `tree` element and child items inside their parent item's `group` element.

If a tree item is outside its `tree` or `group` container in the DOM, add its [`id`](/en-US/docs/Web/HTML/Reference/Global_attributes/id) to the container's [`aria-owns`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-owns) attribute.

Trees can be "single-select", allowing users to choose just one `treeitem` for an action, or "multi-select", where users are able to select more than one `treeitem` nodes for an action. In both cases, to be keyboard accessible, focus must be managed for all tree descendants.

In single-select trees, only one treeitem can have [`aria-selected`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-selected) (or [`aria-checked`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-checked)) set to `true`. When a single-select tree receives focus, if no `treeitem` is selected before the tree receives focus, focus is set on the first `treeitem`. If a `treeitem` is selected before the tree receives focus, focus is set on the single `treeitem` that has `aria-selected="true"` set.
In single-select trees, only one treeitem can have [`aria-selected`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-selected) (or [`aria-checked`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-checked)) set to `true`. When a single-select tree receives focus, if no `treeitem` is selected before the tree receives focus, focus is set on the first `treeitem`. If a `treeitem` is selected before the tree receives focus, focus is set on the selected `treeitem`.

All nodes that are selectable but not selected have either `aria-selected` or `aria-checked` set to `false`. If the tree contains nodes that are not selectable, do not include either `aria-selected` or `aria-checked`, as the presence of either attribute indicates to assistive technologies the node is selectable.

Expand All @@ -44,7 +46,7 @@ In multi-select trees, all selected tree items have either `aria-selected="true"

Either `aria-selected` or `aria-checked` can be used to indicate selection for `treeitem` elements. Some user interfaces indicate selection with `aria-selected` in single-select trees and with `aria-checked` in multi-select trees.

Using both `aria-selected` and `aria-checked` in the same `tree` is strongly discouraged. Don't use both `aria-selected` and `aria-checked` on treeitems in a single tree unless the meaning and purpose of `aria-selected` is different from the meaning and purpose of `aria-checked`, the meaning and purpose of each state apparent, and the user interface provides a separate method for controlling each state.
Using both `aria-selected` and `aria-checked` in the same `tree` is strongly discouraged. Don't use both `aria-selected` and `aria-checked` on treeitems in a single tree unless the meaning and purpose of `aria-selected` is different from the meaning and purpose of `aria-checked`, the meaning and purpose of each state is apparent, and the user interface provides a separate method for controlling each state.

In multi-select trees, the selected state should be independent of the focus. For example, in a typical file system navigator, the user can move focus to select any number of files for an action, such as copy or move. The visual design should make it clear which items are selected and which item has focus.

Expand All @@ -55,11 +57,11 @@ A `treeitem` is required to have an accessible name. Generally, that name comes
### Associated WAI-ARIA roles, states, and properties

- [`tree`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/tree_role) role
- : The root node for the hierarchical list of parent and child `treeitem` nodes that can expand and collapse
- : The container for the hierarchical list of parent and child `treeitem` nodes that can expand and collapse.
- [`group`](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/group_role) role
- : Identifies a set of `treeitem` child nodes.
- [`aria-expanded`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded)
- : Set on the root `tree` and on `group` nodes that are parents of `treeitem` nodes, to indicate whether the tree view is expanded (`true`) or collapsed (`false`).
- : Set on parent `treeitem` nodes to indicate whether their child group is expanded (`true`) or collapsed (`false`).
- [`aria-selected`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-selected)
- : Set to `true` or `false`, indicates a `treeitem` is selectable, and whether or not it is currently selected.
- [`aria-checked`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-checked)
Expand All @@ -85,7 +87,7 @@ For a vertically oriented `tree`, which is the default orientation:
<ul>
<li>When focus is on an open node, closes the node.
<li>When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
<li>When focus is on a closed tree, does nothing.
<li>When focus is on a root node that is also either an end node or a closed node, does nothing.
</td>
</tr>
<tr>
Expand All @@ -110,7 +112,7 @@ For a vertically oriented `tree`, which is the default orientation:
</tr>
<tr>
<td><kbd>Enter</kbd></td>
<td>Performs the default action of the currently focused node. For parent nodes, it opens or closes the node. In single-select trees, if the node has no children, selects the current node if not already selected (which is the default action).
<td>Performs the default action of the currently focused node. For parent nodes, opening or closing the node is one possible default action. In single-select trees where selection does not follow focus, the default action typically selects the current node if not already selected.
</td>
</tr>
<tr>
Expand Down Expand Up @@ -187,10 +189,10 @@ The following is how one might mark up a directory listing of web development co
<ul role="group">
<li role="treeitem" aria-expanded="false">
<span>Languages</span>
<ul role="group">
<ul role="group" hidden>
<li role="treeitem" aria-expanded="false">
<span>HTML</span>
<ul role="group">
<ul role="group" hidden>
<li role="treeitem">Document structure</li>
<li role="treeitem">Head elements</li>
<li role="treeitem">Semantic elements</li>
Expand All @@ -204,15 +206,15 @@ The following is how one might mark up a directory listing of web development co
</li>
<li role="treeitem" aria-expanded="false">
<span>Accessibility</span>
<ul role="group">
<ul role="group" hidden>
<li role="treeitem" aria-label="accessibility object model">AOM</li>
<li role="treeitem">WCAG</li>
<li role="treeitem">ARIA</li>
</ul>
</li>
<li role="treeitem" aria-expanded="false">
<span>Web Performance</span>
<ul role="group">
<ul role="group" hidden>
<li role="treeitem">Load time</li>
</ul>
</li>
Expand All @@ -225,7 +227,7 @@ The following is how one might mark up a directory listing of web development co

The above provides the semantics for a tree view, but does not provide any of the interactivity. That must be added in with JavaScript.

If the tree items aren't by default focusable, JavaScript can be used [`tabIndex="-1"`](/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex) to all the treeitems except the one that should receive focus when the user tabs into the tree which should be set to `tabIndex="0"`.
If the tree items aren't by default focusable, JavaScript can be used to set [`tabIndex="-1"`](/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex) on all the treeitems except the one that should receive focus when the user tabs into the tree, which should be set to `tabIndex="0"`.

All the keyboard functionality in Keyboard interactions and all pointer events need to be programmed, including focus management, going up and down the tree, expanding and collapsing parent nodes, and selection management.

Expand Down
Loading
Loading