xul - 没有或错误的toolbarbutton图像

Question

我花了一整天的时间来处理这个如此微不足道的事情，但仍然不能 做这个工作。出现一个巨大的奇怪图像而不是我的图标。如果我取出toolbarbutton-1类，则根本不会出现任何图像。以下是重要的事情:(这将是一个非常长的帖子......）

我的XUL在toolbarpalette上只包含一个工具栏按钮：

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://ytweaks/skin/style.css" type="text/
css"?>
<overlay id="yTweaks" xmlns="http://www.mozilla.org/keymaster/
gatekeeper/there.is.only.xul">
    <script src="main.js" />
    <toolbarpalette id="BrowserToolbarPalette">
        <toolbarbutton id="ytweaks-main-button" class="toolbarbutton-1
chromeclass-toolbar-additional"
            type="menu"
            label="yTweaks"
            tooltiptext="yTweaks"
            state="enabled">
        </toolbarbutton>
    </toolbarpalette>
</overlay>

CSS与MDN教程中的CSS相同：

#ytweaks-main-button {
  list-style-image: url("chrome://ytweaks/skin/icon.large.png");
}

toolbar[iconsize="small"] #ytweaks-main-button {
  list-style-image: url("chrome://ytweaks/skin/icon.small.png");
}

清单文件如下所示：

content ytweaks chrome/content/
overlay chrome://browser/content/browser.xul chrome://ytweaks/content/ui.xul

skin ytweaks classic/1.0 skin/classic/ytweaks/
style chrome://global/content/customizeToolbar.xul chrome://ytweaks/skin/style.css

文件夹结构：

chrome
|-- content
|   |-- ui.xul
|   |-- main.js
|-- skin
    |-- classic
        |-- ytweaks
            |-- icon.large.png
            |-- icon.small.png
            |-- style.css

最后，结果如下：

完全不是我制作的相同图标。这是我应该出现的图标（ 大一）：

---

另外，我该如何调试这些东西？例如，我该如何浏览 chrome注册表。如果我在firefox中输入chrome URI没有任何反应。 除了浏览器的主要XUL文件加载另一个完整 浏览器。

Answer 1

原来这是由于路径无效：

skin ytweaks classic/1.0 skin/classic/ytweaks/

..应该是：

skin ytweaks classic/1.0 chrome/skin/classic/ytweaks/

Re：调试。我测试了3件事：

• 使用您知道必须匹配的最简单规则，然后使用DOM检查器检查相关元素的样式，以查看规则是否匹配。如果他们没有，你的样式表没有因某种原因被应用。
• 非常接近应用样式表的行（在您的情况下，它是chrome.manifest中的style行）。我不知道你怎么能在这里调试拼写错误。
• 通过位置栏打开时，检查样式​​表的chrome：// URL是否正常工作。它应该显示您的CSS文件的文本。
  • 如果您在错误控制台中收到No chrome package registered for chrome://aaa/skin/aaa.css消息，则Chrome.manifest中的skin声明未得到处理，或者我的示例中的“提供商”名称（aaa）与“skin”
  之后指定的“提供者”名称不匹配
  • 如果您收到内容错误页面File not found. Firefox can't find the file at chrome://aaa/skin/bbb.css（如您的情况），则表示skin声明的路径部分不正确。它应该是相对于chrome.manifest（和以/结尾的iirc）

Answer 2

根据您上面提供的信息，如果这是您的路径ytweaks/skin/icon.small.png，但您的文件夹结构是

 |-- ytweaks
     |-- icon.large.png
     |-- icon.small.png
     |-- style.css

然后我觉得你错过了skin中的ytweaks子文件夹，或者你的图片路径中不应该有这个。