tor-browser

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

css-selector-warnings-tooltip-helper.js (2084B)

      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      4 
      5 "use strict";
      6 
      7 const XHTML_NS = "http://www.w3.org/1999/xhtml";
      8 
      9 const SELECTOR_WARNINGS = {
     10  UnconstrainedHas: {
     11    l10nId: "css-selector-warning-unconstrained-has",
     12    // There could be a specific section on the MDN :has page for this: https://github.com/mdn/mdn/issues/469
     13    learnMoreUrl: null,
     14  },
     15  SiblingCombinatorAfterScope: {
     16    l10nId: "css-selector-warning-sibling-combinator-after-scope",
     17    // Add the link to MDN when https://github.com/mdn/content/issues/42364 is addressed
     18    learnMoreUrl: null,
     19  },
     20 };
     21 
     22 class CssSelectorWarningsTooltipHelper {
     23  /**
     24   * Fill the tooltip with selector warnings.
     25   */
     26  async setContent(data, tooltip) {
     27    const fragment = this.#getTemplate(data, tooltip);
     28    await tooltip.setLocalizedFragment(fragment, { width: 267 });
     29  }
     30 
     31  /**
     32   * Get the template of the tooltip.
     33   *
     34   * @param {Array<string>} data: Array of selector warning kind returned by
     35   *        CSSRule#getSelectorWarnings
     36   * @param {HTMLTooltip} tooltip
     37   *        The tooltip we are targetting.
     38   */
     39  #getTemplate(data, tooltip) {
     40    const { doc } = tooltip;
     41 
     42    const templateNode = doc.createElementNS(XHTML_NS, "template");
     43 
     44    const tooltipContainer = doc.createElementNS(XHTML_NS, "ul");
     45    tooltipContainer.classList.add("devtools-tooltip-selector-warnings");
     46    templateNode.content.appendChild(tooltipContainer);
     47 
     48    for (const selectorWarningKind of data) {
     49      if (!SELECTOR_WARNINGS[selectorWarningKind]) {
     50        console.error("Unknown selector warning kind", data);
     51        continue;
     52      }
     53 
     54      const { l10nId } = SELECTOR_WARNINGS[selectorWarningKind];
     55 
     56      const li = doc.createElementNS(XHTML_NS, "li");
     57      li.setAttribute("data-l10n-id", l10nId);
     58      tooltipContainer.append(li);
     59    }
     60 
     61    return doc.importNode(templateNode.content, true);
     62  }
     63 }
     64 
     65 module.exports = CssSelectorWarningsTooltipHelper;