[Editor] Make the text layer focusable before the editors (bug 1881746)

Keep the different layers in a constant order to avoid the use of a z-index
and a tab-index.
This commit is contained in:
Calixte Denizet 2024-03-11 17:03:44 +01:00
parent 0022310b9c
commit 1b00511301
14 changed files with 187 additions and 36 deletions

View file

@ -28,6 +28,7 @@ import { removeNullCharacters } from "./ui_utils.js";
* @property {TextHighlighter} highlighter - Optional object that will handle
* highlighting text from the find controller.
* @property {TextAccessibilityManager} [accessibilityManager]
* @property {function} [onAppend]
*/
/**
@ -38,6 +39,8 @@ import { removeNullCharacters } from "./ui_utils.js";
class TextLayerBuilder {
#enablePermissions = false;
#onAppend = null;
#rotation = 0;
#scale = 0;
@ -48,6 +51,7 @@ class TextLayerBuilder {
highlighter = null,
accessibilityManager = null,
enablePermissions = false,
onAppend = null,
}) {
this.textContentItemsStr = [];
this.renderingDone = false;
@ -57,14 +61,10 @@ class TextLayerBuilder {
this.highlighter = highlighter;
this.accessibilityManager = accessibilityManager;
this.#enablePermissions = enablePermissions === true;
/**
* Callback used to attach the textLayer to the DOM.
* @type {function}
*/
this.onAppend = null;
this.#onAppend = onAppend;
this.div = document.createElement("div");
this.div.tabIndex = 0;
this.div.className = "textLayer";
}
@ -132,7 +132,7 @@ class TextLayerBuilder {
this.#rotation = rotation;
// Ensure that the textLayer is appended to the DOM *before* handling
// e.g. a pending search operation.
this.onAppend(this.div);
this.#onAppend?.(this.div);
this.highlighter?.enable();
this.accessibilityManager?.enable();
}