1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
|
---
title: Preparando um ambiente para o desenvolvimento de extensões
slug: Preparando_um_ambiente_para_desenvolvimento_de_extensoes
translation_of: Archive/Add-ons/Setting_up_extension_development_environment
---
<p>Esse artigo dá sugestões de como preparar seu aplicativo Mozilla para o desenvolvimento de extensões. A menos que seja dito o contrário, essas sugestões se aplicam tanto ao Firefox quanto ao Thunderbird, assim como ao SeaMonkey versão 2.0 e superior.</p>
<h3 id="Visão_Geral">Visão Geral</h3>
<ul>
<li>Crie um <a href="#Development_profile">peril de usuário</a> para desenvolvimento para executar sua sessão de desenvolvimento do Firefox, com <a href="#Development_preferences">preferência de desenvolvimento</a> especiais em <code>about:config</code>.</li>
<li>Instale alumas <a href="#Development_extensions">extensões de desenvolvimento</a> para Firefox em seu perfil de desenvolvimento.</li>
<li>Edite arquivos na pasta de extensões de seu perfil e reinicie o aplicativo com o perfil de desenvolvimento.</li>
</ul>
<h3 id="Perfil_de_Desenvolvimento">Perfil de Desenvolvimento</h3>
<p>Para evitar a degradação de desempenho das extensões e prefs relacionadas ao desenvolvimento, e para evitar perder seus dados pessoais, você pode usar um perfil a parte para o trabalho de desenvolvimento.</p>
<p>Você pode executar duas instâncias do Thunderbird ou do Firefox ao mesmo tempo usando perfis diferentes e iniciando o aplicativo com o parâmetro <code>-no-remote</code>. Por exemplo, o seguinte comando vai iniciar o Firfox com um perfil chamado "dev" quer uma instância do firefox já esteja em execução ou não.</p>
<p>No Ubuntu (e muitas outras distro do Linux):</p>
<pre>/usr/bin/firefox -no-remote -P dev</pre>
<p>Em algumas outras distros do Linux/Unix:</p>
<pre>/usr/local/bin/firefox -no-remote -P dev
</pre>
<p>No Mac OS Snow Leopard (10.6) e mais recentes:</p>
<pre class="eval">/Applications/Firefox.app/Contents/MacOS/firefox-bin -no-remote -P dev &
</pre>
<p>No Mac OS Leopard (10.5) e versões mais antigas, você requisitar a porção de 32-bit portion do Binário Universal (Universal Binary) (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=622970" title="https://bugzilla.mozilla.org/show_bug.cgi?id=622970">https://bugzilla.mozilla.org/show_bug.cgi?id=622970</a>):</p>
<pre class="eval">arch -arch i386 /Applications/Firefox.app/Contents/MacOS/firefox-bin -no-remote -P dev &
</pre>
<p>No Windows:</p>
<pre class="eval">Start -> Run "%ProgramFiles%\Mozilla Firefox\firefox.exe" -no-remote -P dev
</pre>
<p>No Windows 64 bit:</p>
<pre class="eval">Start -> Run "%ProgramFiles(x86)%\Mozilla Firefox\firefox.exe" -no-remote -P dev</pre>
<p>Para inicar o Thunderbird ou o SeaMonkey ao invés do Firefox, substitua "firefox" por "thunderbird" ou "seamonkey" nos exemplos acima.</p>
<p>Se o perfil especificado não existir (ou se nennhum perfill for especificado), o Thunderbird ou Firefox irá exibir o Profile Manager (Gerenciador de Perfis). Para executar com o perfil padrão (default), especifique "default" como sendo o perfil (ou omita a chave "-P" ).</p>
<p>(Existe uma linha (thread) no <a class="external" href="http://forums.mozillazine.org/" title="http://forums.mozillazine.org/">Mozillazine forums</a> que explica como usar tanto a versão estável como a de desenvolvimento do Firefox para verificar a compatibilidade da extensão Veja <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=613873">Instalando o Firefox 3 ou Campo minado ao se manter o Firefox 2</a>.)</p>
<p>Para tornar as numerosas reinicializações mais suaves, você pode criar um para ler a documentação / para uso regular, e o outro para testar as extensões, e executar ambos ao mesmo tempo usando a chave de comando <code>no-remote </code>como descrito em <a class="external" href="http://kb.mozillazine.org/Command_line_arguments" title="http://kb.mozillazine.org/Command_line_arguments">http://<span>kb.mozillazine.org/Command_line_arguments</span></a> .<span> O segundo geralmente requer muitas reinicializações, e você pode abrir ambos ao mesmo tempo, ccomo nesses dois atalhos no Windows:</span></p>
<p><code><span>...firefox.exe -no-remote -p "profile1"</span></code></p>
<p><code><span>...firefox.exe -no-remote -p "profile2"</span></code></p>
<div class="note">Essas linhas são específicas do Windows. Se você encontrar as mesmas instruções para Linux / Mac OS / etc , por favor coloque-as aqui também.</div>
<p>No Mac, crie um bash script, nomei-o com a extensão (de arquivo) ".command". A opção de perfil é "-P" (maiúsculo).</p>
<p><code>#!/bin/bash</code></p>
<p><code>"..."/Contents/MacOS/firefox -P "profile1"</code></p>
<p>substitua os "..." com o caminho verdadeiro (para a pasta de instalação do seu aplicativo mozilla - firefox, thunderbird, etc.). É simples - basta dois atalhos na Área de Trabalho (desktop) - e você fica com um dos perfis sempre aberto.</p>
<h3 id="Sinalizadores_(flags)_de_comando_para_desenvolvimento">Sinalizadores (flags) de comando para desenvolvimento</h3>
<p>A partir do Gecko 2 (Firefox 4), os arquivos JavaScript files são postos em cache ("fastload" - "carga rápida"). O sinalizador de comando <code>-purgecaches</code> disablita esse comportamento. Como alternativa, você pode ajustar a variável de ambiente MOZ_PURGE_CACHES. See <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=531886" title="https://bugzilla.mozilla.org/show_bug.cgi?id=531886">esse bug</a> para mais informações.</p>
<h3 id="Preferências_para_desenvolvimento">Preferências para desenvolvimento</h3>
<p>Instarlar a extensão <a href="https://addons.mozilla.org/en-US/firefox/addon/developer-profile/" title="https://addons.mozilla.org/en-US/firefox/addon/developer-profile/">Developer Profile (Perfil do Desenvolvedor)</a> ajusta a maior parte do ambiente de desenvolvimento descrito abaixo.</p>
<p>Há um conjunto de preferências de desenvolvimento que quando habilitadas permitem que você veja mais informação sobre a atividade do aplicativo, tornando, dessa forma, a depuração mais fácil. Contudo, essas preferências podem degradar o desempenho, de modo que você pode preferir usar um perfil diferente para desenvolvimento aonde você habilita essas preferências. Para mais informações sobre as preferências do Mozilla, veja o artigo da mozillaZine sobre "<a class="external" href="http://kb.mozillazine.org/About:config" title="http://kb.mozillazine.org/About:config">about:config</a>".</p>
<p>Nem todas as preferências estão definidas por princípio, e portanto, nãos estão listadas em <code>about:config</code> a princípio. Você terá que criar novas entradas booleanas para elas.</p>
<ul>
<li><strong>javascript.options.showInConsole</strong> = <strong>true</strong>. Envia os errors nos arquivos do chrome para o <a href="/en/Error_Console" title="en/Error_Console">Error Console (Console de Erros)</a>.</li>
<li><strong>nglayout.debug.disable_xul_cache</strong> = <strong>true</strong>. Desabilita o cache dos arquivos XUL de modo que as mudanças nas janelas e caixas de diálogos não exijam a reinicialização do aplicativo. Supõe-se que você esteja <a href="#Using_directories_rather_than_JARs">trabalhnado com diretórios ao invés de arquivos JAR</a>. Mudanças nos XUL overlays ainda exigirão que o documento seja carregado novamente.</li>
<li><strong>browser.dom.window.dump.enabled</strong> = <strong>true</strong>. Habilita o uso da função <span style="font-family: Courier New;">dump()</span> para imprimir no console padrão. Veja <span style="font-family: Courier New;">{{ Domxref("window.dump") }}</span> para mais informações. Você pode usar a interface <span style="font-family: Courier New;">{{ Interface("nsIConsoleService") }}</span> ao invés <code>dump()</code> a partir de um script privilegiado.</li>
<li><strong>javascript.options.strict</strong> = <strong>true</strong>. Habilita os avisos de modo strict de JavaScript no Console de Erro. Observe que muitas pessoas tem essa aspecto desabililtado ao desenvolver seus aplicativos, por isso você verá muitos avisos de problemas com os códigos deles além dos de sua própria extensão. Você poderá filtrá-los com a extensão <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1815">Console<sup>2</sup></a>.</li>
<li><strong>devtools.chrome.enabled = true.</strong> Isso possibilita executar fragmentos de código JavaScript no contexto do chrome do Scratchpad a partir do menu Ferramentas. Não se esqueça de alterna o contexto de conteúdo para navegador.</li>
<li><strong>devtools.debugger.remote-enabled = true.</strong> Isso acrescenta uma entrada "Depurar" no submenu do menu "Desenvolvedor Web". O <a href="/en/Tools/Debugger" title="/en/Tools/Debugger">Browser Debugger (Depurador do Navegador)</a> pode ser usado para depurar o código JavaScript das extensões.</li>
<li><strong>extensions.logging.enabled</strong> = <strong>true</strong>. This will send more detailed information about installation and update problems to the <a href="/en/Error_Console" title="en/Error Console">Error Console</a>. (Note that the extension manager automatically restarts the application at startup sometimes, which may mean you won't have time to see the messages logged before the automatic restart happens. To see them, prevent the automatic restart by setting the environment NO_EM_RESTART to 1 before starting the application.)</li>
<li><strong>nglayout.debug.disable_xul_fastload = true</strong>. For Gecko 2.0+ (Firefox 4.0+). See <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=531886" title="https://bugzilla.mozilla.org/show_bug.cgi?id=531886">this bug</a> for more information. Although the bug has been closed, it is believed that this pref is still relevant.</li>
<li>You might also want to set <strong>dom.report_all_js_exceptions = true</strong>. See <a class="internal" href="/en/Exception_logging_in_JavaScript" title="en/Exception logging in JavaScript">Exception logging in JavaScript</a> for details.</li>
<li><strong>devtools.errorconsole.deprecation_warnings</strong>. Detect deprecated code use.</li>
</ul>
<p></p><div class="warning"><strong>Never</strong> set {{pref("nglayout.debug.disable_xul_fastload")}} to true in a production environment; it exists solely to aid in debugging. In particular, add-ons should never change this preference.</div>.<p></p>
<div class="geckoVersionNote">
<p>{{ gecko_callout_heading("2.0") }}</p>
<p>The Error Console is disabled by default starting in Firefox 4. You can re-enable it by changing the <code>devtools.errorconsole.enabled</code> preference to <code>true</code> and restarting the browser. With this, <code>javascript.options.showInConsole</code> is also set to <code>true</code> by default.</p>
</div>
<h4 id="Accessing_Firefox_development_preferences">Accessing Firefox development preferences</h4>
<p>To change preference settings in Firefox or SeaMonkey, type <code>about:config </code>in the Location Bar. Alternatively, use the <a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/7434/" title="http://addons.mozilla.org/en-US/firefox/addon/7434/">Extension Developer's Extension</a>, which provides a menu interface for Firefox settings.</p>
<h4 id="Accessing_Thunderbird_development_preferences">Accessing Thunderbird development preferences</h4>
<p>To change preference settings in Thunderbird, open the "Preferences" (Unix) or "Options" (Windows) interface. On the "Advanced" page, select the "General" tab then click the "Config Editor" button.</p>
<h3 id="Extensões_para_Desenvolvimento">Extensões para Desenvolvimento</h3>
<p>Essas extensões podem te ajudar com o desenvolvimento de extensões.</p>
<ul>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622">DOM Inspector</a>, usada para inspecionar e editar o DOM vivo (em tempo real) de qualquer documento da web ou aplicativo XUL (Firefox and Thunderbird)</li>
<li><a class="external" href="http://www.hacksrus.com/%7Eginda/venkman/">Venkman</a>, um Depurador (Debugger) de JavaScript (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/216" title="http://addons.mozilla.org/en-US/firefox/addon/216">versão para Firefox</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/216" title="http://addons.mozilla.org/en-US/thunderbird/addon/216">versão para Thunderbird</a>)</li>
<li><a href="http://kewisch.wordpress.com/2013/09/22/thunderbird-developer-tools-wrapup/">Thunderbird Developer Tools</a>, permite depurar o Thunderbird remotamente usando as ferramentas de desenvolvimento do Firefox</li>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/7434/">Extension Developer's Extension</a> a suite of tools for extension development (Firefox)</li>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/extension-test/">Extension Test</a> an add-on which makes it easier to detect problems which will lead to rejection by addons.mozilla.org</li>
<li><a class="external" href="http://console2.mozdev.org/">Console²</a> enhanced JavaScript console (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/1815" title="http://addons.mozilla.org/en-US/firefox/addon/1815">Firefox version</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/1815" title="http://addons.mozilla.org/en-US/thunderbird/addon/1815">Thunderbird version</a>)</li>
<li><a class="link-https" href="https://addons.mozilla.org/firefox/addon/5058">Javascript Command</a> for writing/testing javascript on Firefox windows</li>
<li><a class="link-https" href="https://addons.mozilla.org/firefox/addon/5058">Inspect Context</a> Open <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622">DOM Inspector</a> at this node from Inspect on context menu.</li>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/4453/">Chrome List</a> navigate and view files in chrome:// (<a class="external" href="http://addons.mozilla.org/en-US/firefox/addon/4453" title="http://addons.mozilla.org/en-US/firefox/addon/4453">Firefox version</a>, <a class="external" href="http://addons.mozilla.org/en-US/thunderbird/addon/4453" title="http://addons.mozilla.org/en-US/thunderbird/addon/4453">Thunderbird version</a>)</li>
<li><a class="external" href="http://webdesigns.ms11.net/chromeditp.html">Chrome Edit Plus</a> a user file editor (Firefox and Thunderbird)</li>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/developers/tools/builder">Add-on Builder</a> a web-based application that generates an extension skeleton (Firefox, Thunderbird, and others)</li>
<li><a class="link-https" href="https://addons.mozilla.org/firefox/addon/1843">Firebug</a> a variety of development tools (Firefox)</li>
<li><a class="external" href="http://dactyl.sf.net/pentadactyl/">Pentadactyl</a>, a general purpose extension with builtin tools for extension development, including a command line with chrome JavaScript evaluation (including property and function argument completion) and the ability to demand-load external JavaScript and CSS files into window chrome.</li>
<li><a class="external" href="http://getfirebug.com/releases/chromebug/">Chromebug</a> combines elements of a JavaScript debugger and DOM (Firefox, "kinda works for Thunderbird")</li>
<li><a class="link-https" href="https://github.com/bard/mozrepl/wiki">MozRepl</a> explore and modify Firefox and other Mozilla apps while they run (Firefox, Thunderbird version is <a href="https://github.com/bard/mozrepl/issues/47">not working</a>)</li>
<li><a class="external" href="http://www.mouseless.de/index.php?/content/view/18/31/">ExecuteJS</a> an enhanced JavaScript console (<a class="link-https" href="https://addons.mozilla.org/firefox/addon/1729">Firefox version</a>, <a class="external" href="http://xsidebar.mozdev.org/modifiedmisc.html#executejs">Thunderbird version</a> is <a href="https://code.google.com/p/executejs/issues/detail?id=6">not working</a>)</li>
<li><a class="external" href="http://xpcomviewer.mozdev.org">XPCOMViewer</a> an XPCOM inspector (Firefox and Thunderbird)</li>
<li><a class="internal" href="/en/JavaScript/Shells" title="En/JavaScript shells">JavaScript shells</a> to test snippets of JavaScript (Firefox and Thunderbird)</li>
<li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/5817">SQLite Manager</a> to manage the SQLite database (Firefox and Thunderbird)</li>
<li><a class="external" href="http://www.rumblingedge.com/viewabout/">ViewAbout</a> enables access to various about: dialogs from the View menu (<a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/9695">Firefox version</a>, <a class="link-https" href="https://addons.mozilla.org/en-US/thunderbird/addon/9695">Thunderbird version</a> )</li>
<li><a class="external" href="http://code.google.com/p/crashme/">Crash Me Now!</a> useful for testing debug symbols and the crash reporting system (Firefox and Thunderbird)</li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/javascript-object-examiner/" title="https://addons.mozilla.org/en-US/firefox/addon/javascript-object-examiner/">Javascript Object Examiner</a> displays JavaScript object methods and properties for any available scope</li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/developer-profile/" title="https://addons.mozilla.org/en-US/firefox/addon/developer-profile/">Developer Profile</a> sets up the development environment described above when installed (Firefox and Fennec)</li>
</ul>
<h3 id="Firefox_extension_proxy_file">Firefox extension proxy file</h3>
<p>Extension files are normally installed in the user profile. However, it is usually easier to place extension files in a temporary location, which also protects source files from accidental deletion. This section explains how to create a proxy file that points to an extension that is installed in a location other than the user profile.</p>
<ol>
<li>Get the extension ID from the extension's install.rdf file.</li>
<li>Create a file in the "<code>extensions</code>" directory under your profile directory with the extension's ID as the file name (for example "<code>your_profile_directory/extensions/{46D1B3C0-DB7A-4b1a-863A-6EE6F77ECB58}</code>"). (<a class="external" href="http://kb.mozillazine.org/Profile_folder">How to find your profile directory</a>) Alternatively, rather than using a GUID, create a unique ID using the format "name@yourdomain" (for example <span class="nowiki"><code>chromebug@mydomain.com</code></span>) - then the proxy filename will be same as that ID, with no curly brackets {}.</li>
<li>
<p>The contents of this file should be the path to the directory that contains your install.rdf file, for example <code><span class="nowiki">/full/path/to/yourExtension/</span></code> on Mac and Linux, and <code><span class="nowiki">C:\full\path\to\yourExtension\</span></code> on Windows. Remember to include the closing slash and remove any trailing whitespace.</p>
<ul>
<li>Note: If you already installed the extension via XPI, you should uninstall it first before creating the pointer file.</li>
<li>Also note that the use of proxy files requires that the extension's chrome.manifest defines its chrome urls using traditional directories, rather than a JARed structure. See below.</li>
</ul>
</li>
<li>Place the file in the extensions folder of your profile and restart the application.</li>
</ol>
<h3 id="Using_directories_rather_than_JARs">Using directories rather than JARs</h3>
<p>Regardless of whether you choose to eventually package your extension's chrome in a JAR or in directories, developing in directories is simpler. If you choose a JARed structure for releasing, you can still develop with a directory structure by editing your chrome.manifest. For example, rather than having</p>
<pre class="eval">content myExtension jar:chrome/myExtension.jar!/content/
</pre>
<p>use</p>
<pre class="eval">content myExtension chrome/content/
</pre>
<p>{{ h1_gecko_minversion("Preventing the first launch extension selector", "8.0") }}</p>
<p>Starting in Firefox 8, on the first launch of a new version of Firefox, it presents user interface letting users select which third party add-ons to keep. This lets them weed out add-ons that were installed without their knowledge, or that are no longer needed.</p>
<p>However, this interface can be disruptive when debugging add-ons. You can avoid this by setting the preference <code>extensions.autoDisableScopes</code> to 14.</p>
<p>{{ languages( { "de": "de/Einrichten_einer_Entwicklungsumgebung_für_Erweiterungen", "fr": "fr/Configuration_d'un_environnement_de_développement_d'extensions", "ja": "ja/Setting_up_extension_development_environment", "zh-cn": "cn/Setting_up_extension_development_environment", "pl": "pl/Przygotowanie_środowiska_programowania_rozszerzenia", "ru": "ru/Настройка_среды_разработки_расширений" } ) }}</p>
|