Revision Content

What is Chrome?

Chrome is the set of user interface elements of the application window that are outside of a window's content area. Toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome.

The root chrome.manifest is the only thing read for most bundles. XULRunner application bundles also read any additional chrome/chrome.manifest file, but that's "special".

Chrome Providers

A supplier of chrome for a given window type (e.g. for the browser window) is called a chrome provider. The providers work together to supply a complete set of chrome for a particular window, from the images on the toolbar buttons to the files that describe the text, content and appearance of the window itself.

There are three basic types of chrome providers:

Content

The main source file for a window description comes from the content provider, and it can be any file type viewable from within Mozilla. It will typically be a XUL file, since XUL is designed for describing the contents of windows and dialogs. The JavaScript files that define the user interface are also contained within the content packages, as well as most XBL binding files.

Locale

Localizable applications keep all their localized information in locale providers. This allows translators to plug in a different chrome package to translate an application without altering the rest of the source code. The two main types of localizable files are DTD files and Java-style properties files.

Skin

A skin provider is responsible for providing a complete set of files that describe the visual appearance of the chrome. Typically a skin provider will provide CSS files and images.

Note: Scripts (including those found in XBL) loaded from skin packages will not execute.

The Chrome Registry

The Gecko runtime maintains a service known as the chrome registry that provides mappings from chrome package names to the physical location of chrome packages on disk.

This chrome registry is configurable and persistent, and thus a user can install different chrome providers, and select a preferred skin and locale. This is accomplished through xpinstall and the extension manager.

In order to inform the chrome registry of the available chrome, a text manifest is used: this manifest is "chrome.manifest" in the root of an extension, or theme, and chrome/*.manifest in a XULRunner application.

The plaintext chrome manifests are in a simple line-based format. Each line is parsed individually; if the line is parsable the chrome registry takes the action identified by that line; otherwise the chrome registry ignores that line (and prints a warning message in the runtime error console).

Firefox 2 will not find the chrome when <tt>packagename</tt> is mixed case. If the above example had a <tt>packagename</tt> of CamelCasePackage, you would get an error message similar to "No chrome registered for chrome://camelcasepackage/path/to/files". Firefox 3 supports mixed case.

Manifest Instructions

comments

A line is a comment if it begins with the character '#'; any other characters on the line are ignored.

# this line is a comment - you can put whatever you want here

content

A content package is registered with the line

content packagenameuri/to/files/[flags]

This will register a location to use when resolving the URI <tt>chrome://packagename/content/...</tt>. The URI may be absolute or relative to the location of the manifest file. Note, that it must end with an '/'.

locale

A locale package is registered with the line

locale packagenamelocalenameuri/to/files/[flags]

This will register a locale package when resolving the URI chrome://packagename/locale/... . The localename is usually a plain language identifier "en" or a language-country identifier "en-US". If more than one locale is registered for a package, the chrome registry will select the best-fit locale using the user's preferences.

skin

A skin package is registered with the line

skin packagenameskinnameuri/to/files/[flags]

This will register a skin package when resolving the URI chrome://packagename/skin/... . The skinname is an opaque string identifying an installed skin. If more than one skin is registered for a package, the chrome registry will select the best-fit skin using the user's preferences.

override

In some cases an extension or embedder may wish to override a chrome file provided by the application or XULRunner. In order to allow for this, the chrome registration manifest allows for "override" instructions:

There was a bug in the Gecko 1.8.1.5 (Firefox 2.0.0.5) and earlier where you could not use a relative URL for the new-resolved-URI parameter. You needed to provide an absolute URL. See {{ Bug("323455") }}.

This will create an mapping for the res://<aliasname>/ to the path given.

Note that there are no security restrictions preventing web content from including content at resource uris so take care with what you make visible there.

Manifest Flags

Manifest lines can have multiple, space-delimited flags added at the end of the registration line. These flags mark special attributes of chrome in that package, or limit the conditions under which the line is used.

application

Extensions may install into multiple applications. There may be chrome registration lines which only apply to one particular application. The flag

application=app-ID

indicates that the instruction should only be applied if the extension is installed into the application identified by app-ID is running. Multiple application flags may be included on a single line, in which case the line is applied if any of the flags match.

appversion

Extensions may install into multiple versions of an application. There may be chrome registration lines which only apply to a particular application version. The flag

indicates that the instruction should only be applied if the extension is installed into the application version identified. Multiple appversion flags may be included on a single line, in which case the line is applied if any of the flags match. The version string must conform to the Toolkit version format.

Versions of Gecko before 1.8.0.13 and 1.8.1.5 contained a bug where if you use the comparisons <, > or = then the version string had be 2 characters or more long. If not you would get a message in the error console that the appversion flag was not recognized. See {{ Bug("380398") }}.

contentaccessible

{{ Fx_minversion_inline("3") }} Chrome resources can no longer be referenced from within <img>, <script>, or other elements contained in, or added to, content that was loaded from an untrusted source. This
restriction applies to both elements defined by the untrusted source and
to elements added by trusted extensions.
If such references need to be explicitly allowed, set the contentaccessible flag to yes to obtain the behavior found in older versions of Firefox.
See {{ bug|436989 }}.

The contentaccessible flag applies only to content packages: it is not recognized for locale or skin registration. However, the matching locale and skin packages will also be exposed to content.

n.b.: Because older versions of Firefox do not understand the contentaccessible flag, any extension designed to work with both Firefox 3 and older versions of Firefox will need to provide a fallback. For example:

os

{{ Fx_minversion_inline("3") }} Extensions (or themes) may offer different features depending on the operating system on which Firefox is running. The value is compared to the value of OS_TARGET for the platform.

os=WINNT
os=Darwin

See OS_TARGET for a more complete list of os names. The os name is case insensitive.

osversion

{{ Fx_minversion_inline("3") }} An extension or theme may need to operate differently depending on which version of an operating system is running. For example, a theme may wish to adopt a different look on Mac OS X 10.5 than 10.4:

osversion>=10.5

platform (Platform-specific packages)

Some packages are marked with a special flag indicating that they are platform specific. Some parts of content, skin, locales may be different based on the platform being run. These packages contain three different sets of files, for Windows and OS/2, Macintosh, and Unix-like platforms. For example, the order of the "OK" and "Cancel" buttons in a dialog is different, as well as the names of some items.

The "platform" modifier is only parsed for content registration, it is not recognized for locale or skin registration. However it applies to content, locale, and skin parts of the package, when specified.

To indicate that a package is platform-specific, add the "platform" modifier to the "content" line after the path, for example:

Once that is specified in your manifest you then ensure that under the directory global-platform are subdirectories win (Windows/OS2), mac (OS9/OSX), or unix (Everything Else). Anything residing outside of these subdirectories will be ignored.

xpcnativewrappers

Chrome packages can decide whether to use the xpcnativewrappers security mechanism to protect their code against malicious content that they might access. See Safely accessing content DOM from chrome for details.

As of Firefox 1.5 alpha releases (Deer Park alphas), this flag is *off* by default, and must be explicitly enabled by specifying xpcnativewrappers=yes.

As of the first Firefox 1.5 beta release, this flag will be enabled by default, and extensions that need insecure access to the content objects will be required to specify xpcnativewrappers=no.

The xpcnativewrappers flag applies only to content packages: it is not recognized for locale or skin registration.

Debugging a Chrome Manifest file

The Chrome List extension shows all registered chrome. This is very helpful when trying to write a chrome.manifest file as you can inspect where the files are being mapped from (jar files, local directory, etc.)

Old-style contents.rdf manifests

Before the plaintext manifests were introduced (which happened in Firefox 1.5, Toolkit 1.8), RDF manifests named "contents.rdf" were used to register chrome. This format is deprecated; however, the Mozilla Suite (SeaMonkey) does not support the plaintext manifest format yet, so contents.rdf manifests are required for extensions that wish to maintain backwards compatibility with Firefox 1.0 or the suite.

Revision Source

<p>
</p>
<h3 name="What_is_Chrome.3F"> What is Chrome? </h3>
<p><a href="en/Chrome">Chrome</a> is the set of user interface elements of the application window that are outside of a window's content area. Toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome.
</p><p>The root chrome.manifest is the only thing read for most bundles. XULRunner application bundles also read any additional chrome/chrome.manifest file, but that's "special".
</p>
<h3 name="Chrome_Providers">Chrome Providers</h3>
<p>A supplier of chrome for a given window type (e.g. for the browser window) is called a chrome provider. The providers work together to supply a complete set of chrome for a particular window, from the images on the toolbar buttons to the files that describe the text, content and appearance of the window itself.
</p><p>There are three basic types of chrome providers:
</p>
<h4 name="Content"> Content </h4>
<p>The main source file for a window description comes from the content provider, and it can be any file type viewable from within Mozilla. It will typically be a XUL file, since XUL is designed for describing the contents of windows and dialogs. The JavaScript files that define the user interface are also contained within the content packages, as well as most XBL binding files. </p>
<h4 name="Locale"> Locale </h4>
<p>Localizable applications keep all their localized information in locale providers. This allows translators to plug in a different chrome package to translate an application without altering the rest of the source code. The two main types of localizable files are DTD files and Java-style properties files.
</p>
<h4 name="Skin"> Skin </h4>
<p>A skin provider is responsible for providing a complete set of files that describe the visual appearance of the chrome. Typically a skin provider will provide CSS files and images.
</p><p><i>Note</i>: Scripts (including those found in <a href="en/XBL">XBL</a>) loaded from skin packages will not execute.
</p>
<h3 name="The_Chrome_Registry"> The Chrome Registry </h3>
<p>The Gecko runtime maintains a service known as the chrome registry that provides mappings from chrome package names to the physical location of chrome packages on disk.
</p><p>This chrome registry is configurable and persistent, and thus a user can install different chrome providers, and select a preferred skin and locale. This is accomplished through xpinstall and the extension manager.
</p><p>In order to inform the chrome registry of the available chrome, a text manifest is used: this manifest is "chrome.manifest" in the root of an extension, or theme, and chrome/*.manifest in a XULRunner application.
</p><p>The plaintext chrome manifests are in a simple line-based format. Each line is parsed individually; if the line is parsable the chrome registry takes the action identified by that line; otherwise the chrome registry ignores that line (and prints a warning message in the runtime error console).
</p>
<pre class="eval">locale packagename localename path/to/files
skin packagename skinname path/to/files
</pre>
<p>Firefox 2 will not find the chrome when <tt>packagename</tt> is mixed case. If the above example had a <tt>packagename</tt> of <b>C</b>amel<b>C</b>ase<b>P</b>ackage, you would get an error message similar to "No chrome registered for <a class=" external" href="chrome://" rel="freelink">chrome://</a><b>c</b>amel<b>c</b>ase<b>p</b>ackage/path/to/files". Firefox 3 supports mixed case.
</p>
<h3 name="Manifest_Instructions"> Manifest Instructions </h3>
<h4 name="comments"> comments </h4>
<p>A line is a comment if it begins with the character '#'; any other characters on the line are ignored.
</p>
<pre class="eval"># this line is a comment - you can put whatever you want here
</pre>
<h4 name="content"> content </h4>
<p>A content package is registered with the line
</p>
<pre class="eval">content <i>packagename</i> <i>uri/to/files/</i> <i>[flags]</i>
</pre>
<p>This will register a location to use when resolving the URI <tt><a class=" external" href="chrome://" rel="freelink">chrome://</a><i>packagename</i>/content/...</tt>. The URI may be absolute or relative to the location of the manifest file. Note, that it must end with an '/'.
</p>
<h4 name="locale"> locale </h4>
<p>A locale package is registered with the line
</p>
<pre class="eval">locale <i>packagename</i> <i>localename</i> <i>uri/to/files/</i> <i>[flags]</i>
</pre>
<p>This will register a locale package when resolving the URI <a class=" external" href="chrome://" rel="freelink">chrome://</a><i>packagename</i>/locale/... . The <i>localename</i> is usually a plain language identifier "en" or a language-country identifier "en-US". If more than one locale is registered for a package, the chrome registry will select the best-fit locale using the user's preferences.
</p>
<h4 name="skin"> skin </h4>
<p>A skin package is registered with the line
</p>
<pre class="eval">skin <i>packagename</i> <i>skinname</i> <i>uri/to/files/</i> <i>[flags]</i>
</pre>
<p>This will register a skin package when resolving the URI <a class=" external" href="chrome://packagename/skin/" rel="freelink">chrome://packagename/skin/</a>... . The <i>skinname</i> is an opaque string identifying an installed skin. If more than one skin is registered for a package, the chrome registry will select the best-fit skin using the user's preferences.
</p>
<h4 name="overlay"> overlay </h4>
<p>XUL overlays are registered with the following syntax:
</p>
<pre class="eval">overlay <a class=" external" href="chrome://" rel="freelink">chrome://</a><i>URI-to-be-overlaid</i> <a class=" external" href="chrome://" rel="freelink">chrome://</a><i>overlay-URI</i> <i>[flags]</i>
</pre>
<h4 name="style"> style </h4>
<p>Style overlays (custom CSS which will be applied to a chrome page) are registered with the following syntax:
</p>
<pre class="eval">style <a class=" external" href="chrome://" rel="freelink">chrome://</a><i>URI-to-style</i> <a class=" external" href="chrome://" rel="freelink">chrome://</a><i>stylesheet-URI</i> <i>[flags]</i>
</pre>
<div class="note">Note that only stylesheets at chrome URIs can be applied in this way.</div>
<h4 name="override">override</h4>
<p>In some cases an extension or embedder may wish to override a chrome file provided by the application or XULRunner. In order to allow for this, the chrome registration manifest allows for "override" instructions:</p>
<pre class="eval">override <a class=" external" href="chrome://" rel="freelink">chrome://</a><em>package</em>/<em>type</em>/<em>original-uri.whatever</em> <em>new-resolved-URI</em> <em>[flags]</em>
</pre>
<p>Note: overrides are not recursive (so overriding <a class=" external" href="chrome://foo/content/bar/" rel="freelink">chrome://foo/content/bar/</a> with <a class=" external" href="file:///home/john/blah/" rel="freelink">file:///home/john/blah/</a> will not usually do what you want or expect it to do).</p>
<div class="note">
<p>There was a bug in the Gecko 1.8.1.5 (Firefox 2.0.0.5) and earlier where you could not use a relative URL for the <em>new-resolved-URI</em> parameter. You needed to provide an absolute URL. See {{ Bug("323455") }}.</p>
</div><h4 name="resource"> resource </h4>
<p>{{ Fx_minversion_inline("3") }}
</p><p>When using <a href="en/Using_JavaScript_code_modules">JavaScript code modules</a> it may be necessary to create resource protocol aliases so extensions and applications can load modules using <a href="en/Components.utils.import">Components.utils.import</a>. Aliases can be created using the <code>resource</code> instruction:
</p>
<pre class="eval">resource <i>aliasname</i> <i>uri/to/files/</i> <i>[flags]</i>
</pre>
<p>This will create an mapping for the <code><a class=" external" href="res://" rel="freelink">res://</a>&lt;aliasname&gt;/</code> to the path given.
</p>
<div class="note">
<p>Note that there are no security restrictions preventing web content from including content at resource uris so take care with what you make visible there.
</p>
</div>
<h3 name="Manifest_Flags"> Manifest Flags </h3>
<p>Manifest lines can have multiple, space-delimited flags added at the end of the registration line. These flags mark special attributes of chrome in that package, or limit the conditions under which the line is used.
</p>
<h4 name="application"> application </h4>
<p>Extensions may install into multiple applications. There may be chrome registration lines which only apply to one particular application. The flag
</p>
<pre class="eval">application=<i>app-ID</i>
</pre>
<p>indicates that the instruction should only be applied if the extension is installed into the application identified by <i>app-ID</i> is running. Multiple application flags may be included on a single line, in which case the line is applied if any of the flags match.
</p>
<h4 name="appversion"> appversion </h4>
<p>Extensions may install into multiple versions of an application. There may be chrome registration lines which only apply to a particular application version. The flag
</p>
<pre class="eval">appversion=<i>version</i>
appversion&lt;<i>version</i>
appversion&lt;=<i>version</i>
appversion&gt;<i>version</i>
appversion&gt;=<i>version</i>
</pre>
<p>indicates that the instruction should only be applied if the extension is installed into the application version identified. Multiple <code>appversion</code> flags may be included on a single line, in which case the line is applied if any of the flags match. The version string must conform to the <a href="en/Toolkit_version_format">Toolkit version format</a>.
</p>
<div class="note">
<p>Versions of Gecko before 1.8.0.13 and 1.8.1.5 contained a bug where if you use the comparisons &lt;, &gt; or = then the version string had be 2 characters or more long. If not you would get a message in the error console that the <code>appversion</code> flag was not recognized. See {{ Bug("380398") }}.
</p>
</div>
<h4 name="contentaccessible"> contentaccessible </h4>
<p>{{ Fx_minversion_inline("3") }} Chrome resources can no longer be referenced from within &lt;img&gt;, &lt;script&gt;, or other elements contained in, or added to, content that was loaded from an untrusted source. This
restriction applies to both elements defined by the untrusted source and
to elements added by trusted extensions.
If such references need to be explicitly allowed, set the <code>contentaccessible</code> flag to <code>yes</code> to obtain the behavior found in older versions of Firefox.
<span class="comment">See {{ bug|436989 }}.</span>
</p><p>The <code>contentaccessible</code> flag applies only to content packages: it is not recognized for locale or skin registration. However, the matching locale and skin packages will also be exposed to content.
</p><p><b>n.b.:</b> Because older versions of Firefox do not understand the <code>contentaccessible</code> flag, any extension designed to work with both Firefox 3 and older versions of Firefox will need to provide a fallback. For example:
</p>
<pre>content packagename chrome/path/
content packagename chrome/path/ contentaccessible=yes
</pre>
<p><span class="comment">Changed for Firefox 3 RC 1 for {{ bug|292789 }}.</span>
</p>
<h4 name="os"> os </h4>
<p>{{ Fx_minversion_inline("3") }} Extensions (or themes) may offer different features depending on the operating system on which Firefox is running. The value is compared to the value of <a href="en/OS_TARGET">OS_TARGET</a> for the platform.
</p>
<pre class="eval">os=WINNT
os=Darwin
</pre>
<p>See <a href="en/OS_TARGET">OS_TARGET</a> for a more complete list of os names. The os name is case insensitive.
</p>
<h4 name="osversion"> osversion </h4>
<p>{{ Fx_minversion_inline("3") }} An extension or theme may need to operate differently depending on which version of an operating system is running. For example, a theme may wish to adopt a different look on Mac OS X 10.5 than 10.4:
</p>
<pre class="eval">osversion&gt;=10.5
</pre>
<h4 name="platform_.28Platform-specific_packages.29"> platform (Platform-specific packages) </h4>
<p>Some packages are marked with a special flag indicating that they are platform specific. Some parts of content, skin, locales may be different based on the platform being run. These packages contain three different sets of files, for Windows and OS/2, Macintosh, and Unix-like platforms. For example, the order of the "OK" and "Cancel" buttons in a dialog is different, as well as the names of some items.
</p><p>The "platform" modifier is only parsed for content registration, it is not recognized for locale or skin registration. However it applies to content, locale, and skin parts of the package, when specified.
</p><p>To indicate that a package is platform-specific, add the "platform" modifier to the "content" line after the path, for example:
</p>
<pre class="eval">content global-platform jar:toolkit.jar!/toolkit/content/global-platform/ platform
</pre>
<p>Once that is specified in your manifest you then ensure that under the directory global-platform are subdirectories <code>win</code> (Windows/OS2), <code>mac</code> (OS9/OSX), or <code>unix</code> (Everything Else). Anything residing outside of these subdirectories will be ignored.
</p>
<h4 name="xpcnativewrappers"> xpcnativewrappers </h4>
<p>Chrome packages can decide whether to use the xpcnativewrappers security mechanism to protect their code against malicious content that they might access. See <a href="en/Safely_accessing_content_DOM_from_chrome">Safely accessing content DOM from chrome</a> for details.
</p><p>As of Firefox 1.5 alpha releases (Deer Park alphas), this flag is *off* by default, and must be explicitly enabled by specifying xpcnativewrappers=yes.
</p><p>As of the first Firefox 1.5 beta release, this flag will be enabled by default, and extensions that need insecure access to the content objects will be required to specify xpcnativewrappers=no.
</p><p>The xpcnativewrappers flag applies only to content packages: it is not recognized for locale or skin registration.
</p><p><br>
</p>
<h3 name="Example_Chrome_Manifest"> Example Chrome Manifest </h3>
<pre class="eval">content necko jar:comm.jar!/content/necko/ xpcnativewrappers=yes
locale necko en-US jar:en-US.jar!/locale/en-US/necko/
content xbl-marquee jar:comm.jar!/content/xbl-marquee/
content pipnss jar:pipnss.jar!/content/pipnss/
locale pipnss en-US jar:en-US.jar!/locale/en-US/pipnss/
# Firefox-only
overlay <a class=" external" href="chrome://browser/content/pageInfo.xul" rel="freelink">chrome://browser/content/pageInfo.xul</a> <a class=" external" href="chrome://pippki/content/PageInfoOverlay.xul" rel="freelink">chrome://pippki/content/PageInfoOverlay.xul</a> application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}
overlay <a class=" external" href="chrome://communicator/content/pref/preftree.xul" rel="freelink">chrome://communicator/content/pref/preftree.xul</a> <a class=" external" href="chrome://pippki/content/PrefOverlay.xul" rel="freelink">chrome://pippki/content/PrefOverlay.xul</a>
overlay <a class=" external" href="chrome://navigator/content/pageInfo.xul" rel="freelink">chrome://navigator/content/pageInfo.xul</a> <a class=" external" href="chrome://pippki/content/PageInfoOverlay.xul" rel="freelink">chrome://pippki/content/PageInfoOverlay.xul</a> <a class=" link-mailto" href="mailto:application=seamonkey@applications.mozilla.org" rel="freelink">application=seamonkey@applications.mozilla.org</a>
content pippki jar:pippki.jar!/content/pippki/ xpcnativewrappers=yes
locale pippki en-US jar:en-US.jar!/locale/en-US/pippki/
content global-platform jar:toolkit.jar!/content/global-platform/ platform
skin global classic/1.0 jar:classic.jar!/skin/classic/global/
override <a class=" external" href="chrome://global/content/netError.xhtml" rel="freelink">chrome://global/content/netError.xhtml</a> jar:embedder.jar!/global/content/netError.xhtml
content inspector jar:inspector.jar!/content/inspector/ xpcnativewrappers=no
</pre>
<h3 name="Debugging_a_Chrome_Manifest_file"> Debugging a Chrome Manifest file </h3>
<p>The <a class="link-https" href="https://addons.mozilla.org/firefox/4453">Chrome List</a> extension shows all registered chrome. This is very helpful when trying to write a <code>chrome.manifest</code> file as you can inspect where the files are being mapped from (jar files, local directory, etc.)
</p>
<h3 name="Old-style_contents.rdf_manifests"> Old-style contents.rdf manifests </h3>
<p>Before the plaintext manifests were introduced (which happened in Firefox 1.5, Toolkit 1.8), RDF manifests named "contents.rdf" were used to register chrome. This format is deprecated; however, the Mozilla Suite (SeaMonkey) does not support the plaintext manifest format yet, so contents.rdf manifests are required for extensions that wish to maintain backwards compatibility with Firefox 1.0 or the suite.
</p>
<h3 name="Official_References_for_Toolkit_API"> Official References for <a href="en/Toolkit_API">Toolkit API</a> </h3>
<p>{{ :en/Toolkit_API/Official_References() }}
</p>
<div class="noinclude">
</div>
{{ languages( { "fr": "fr/Enregistrement_chrome", "ja": "ja/Chrome_Registration", "pl": "pl/Rejestracja_Chrome" } ) }}