aboutsummaryrefslogtreecommitdiff
path: root/files/de/tools/firefox_os_1.1_simulator/index.html
blob: 0051b054b3949dfaad6ab4540a5e82912189e5ee (plain)
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
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
---
title: Firefox OS 1.1 Simulator
slug: Tools/Firefox_OS_1.1_Simulator
translation_of: Tools/Firefox_OS_1.1_Simulator
---
<div>{{ToolsSidebar}}</div><div id="doc-content">
<div class="page-content boxed">
<div class="note">
<p>Diese Seite beschreibt den "alten" Firefox OS Simulator. Dieser sollte nur verwendet werden, falls man Apps für Firefox 1.1 entwickelt und er kann daher auch nur auf Firefox 24 oder Firefox 25 installiert werden.</p>

<p>Wenn man Apps für Firefox OS 1.2 oder später entwickelt, muß stattdessen der <a href="/en-US/Firefox_OS/Using_the_App_Manager">App Manager </a>verwendet werden.</p>

<p>Falls Hilfe benötigt wird, kann man in der <a href="https://lists.mozilla.org/listinfo/dev-developer-tools">dev-developer-tools mailing list </a>oder bei <a href="irc://irc.mozilla.org/#devtools">#devtools auf irc.mozilla.org</a> nachfragen.</p>
</div>

<p>Die Firefox OS Simulator-Erweiterung ist ein Werkzeug, welches es ermöglicht, eigene <a href="https://developer.mozilla.org/en-US/docs/Apps" title="/en-US/docs/Apps">Firefox OS Apps</a> auf dem Desktop zu testen und zu debuggen. Der Code-Test-Debug-Zyklus ist sehr viel schneller mit dem Simulator als mit dem echten Gerät und dieses braucht man dafür natürlich dann auch nicht.</p>

<p>Im Wesentlichen enthält die Simulator-Erweiterung:</p>

<ul>
 <li><strong>den Simulator</strong>: dieser beinhaltet den <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client">Firefox OS Desktop Client</a>, welcher eine Version der höheren Schichten des <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> ist, das auf dem Desktop läuft. Der Simulator enthält auch einige <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Simulator-toolbar" title="#Simulator-toolbar">zusätzliche Features in der Emulation</a>, die in den Standard Firefox OS Desktop Builds nicht enthalten sind.</li>
 <li><strong>das Dashboard</strong>: ein Werkzeug, welches durch den Firefox-Browser gehostet wird und Start und Stop des Simulators ermöglicht, sowie das Installieren, Deinstallieren und Debuggen von Apps, die darin laufen. Das Dashboard hilft ebenfalls, die Apps auf ein reales Gerät zu übetragen und überprüft die App-Manifests auf die geläufigsten Probleme.</li>
</ul>

<p>Der Screenshot im Folgenden zeigt eine Debugging-Sitzung unter Verwendung des Simulators.</p>

<p>Das Dashboard ist oben rechts innerhalb eines Firefox-Tabs. Wir haben eine App hinzugefügt, eine "Packaged App", die wir "Wo bin ich? (Where am I?)" genannt haben. Links oben läuft die App im Simulator. Wir haben ebenfalls die Debugger-Werkzeuge eingebunden, die im Panel weiter unten sind. Man kann sehen, daß das Konsolenfeld Meldungen über die App anzeigt.</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5513/Simulator-overview-4.0.png"></p>

<p>Dieses Handbuch behandelt folgende Themen:</p>

<ul>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Installing" title="#Installing">Wie man die Simulator-Erweiterung installiert</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Adding-updating-removing" title="#Adding-updating-removing">Wie man Apps hinzufügt, entfernt und auffrischt</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Manifest-validation" title="#Manifest-validation">Überprüfung eines Manifests</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Running-the-Simulator" title="#Running-the-Simulator">Wie man den Simulator startet</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Attaching-developer-tools" title="#Attaching-developer-tools">Wie man Entwickler-Werkzeuge in im Simulator laufende Apps einbindet, wie z.B. den JS debugger</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Simulator-receipts" title="#Simulator-receipts">Wie man Testergebnisse für eine "paid App" bekommt</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Push-to-device" title="#Push-to-device">Wie man Apps auf ein verbundenes Gerät überträgt</a></li>
 <li><a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Limitations" title="#Limitations">Die Beschränkungen des Simulators im Vergleich zu einem echten Firefox OS-Gerät</a></li>
</ul>

<div class="note">For a practical walkthrough that shows how to use the Simulator to debug a real web app, see the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough" title="/en-US/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough">Simulator Walkthrough</a> page.</div>

<h2 id="Die_Simulator-Erweiterung_installieren"><a name="Installing">Die Simulator-Erweiterung installieren</a></h2>

<p>Der Simulator kommt als Firefox Erweiterung. So wird er insatlliert:</p>

<ol>
 <li>Besuche mit Firefox die folgende Seite: <a href="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/">Simulator's page on addons.mozilla.org</a>.</li>
 <li>Klicke "Add to Firefox".</li>
 <li>Nach dem Download wirst Du aufgefordert, es zu installieren: Klicke "Install Now".</li>
</ol>

<p>Aufgrund der Größe der Erweiertung kann Firefox für einige Sekunden einfrieren. Falls ein Dialog mit der Warnung: "Unresponsive script" erscheint, klicke "Continue" um die Installation vollständig auszuführen. Das sollte aber nicht mit Firefox ab Version 27 passieren.<br>
 <br>
 Firefox wird nach der Installation regelmäßig nach Aktualisierungen des Simulators suchen und diese automatisch installieren.</p>

<p>Das Dashboard des Simulators öffnet sich bei der Insatllation automatisch, und Du kannst es jederzeit erneut öffnen im "Firefox" Menü (oder dem "Extras" Menü unter OS X und Linux), dann "Web-Entwickler", dann "Firefox OS Simulator":</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5141/simulator-open-on-windows-7.png" style="display: block; margin-left: auto; margin-right: auto;"><br>
 Das Dashboard ist das Werkzeug, mit dem Du Deine App dem Simularot hinzufügst und laufen lässt. So sieht es aus: <img alt="" src="https://mdn.mozillademos.org/files/5491/dashboard-4.0.png" style="height: 650px; width: 1212px;"></p>

<h2 id="Adding_removing_and_refreshing_apps"><a name="Adding-updating-removing">Adding, removing and refreshing apps</a></h2>

<h3 id="Adding_apps">Adding apps</h3>

<p>To add a <a href="https://developer.mozilla.org/en-US/docs/Apps/Packaged_apps" title="/en-US/docs/Apps/Packaged_apps">packaged app</a> to the Simulator, open the Dashboard, click "Add Directory" and select the <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest" title="/en-US/docs/Apps/Manifest">manifest file</a> for your app.<br>
 <br>
 To add a hosted app, enter a URL in the textbox where it says "URL for page or manifest.webapp", then click "Add URL". If the URL points to a manifest, then that manifest will be used. If it doesn't, the Dashboard will generate a manifest for the URL: so you can add any website as an app just by entering its URL.<br>
 <br>
 When you add an app, the Dashboard will run a series of tests on your manifest file, checking for common problems. See the section on <a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Manifest-validation" title="#Manifest-validation">Manifest Validation</a> for details on what tests are run.</p>

<p>The Dashboard will then automatically run your app in the Simulator unless the Manifest Validation Process discovers an error in your app.</p>

<h3 id="Managing_apps">Managing apps</h3>

<p>Once you have added an app, it will appear in the Manager's list of installed apps:<br>
 <img alt="" src="https://mdn.mozillademos.org/files/5493/dashboard-list-apps-4.0.png"><br>
 Each entry gives us the following information about the app:</p>

<ul>
 <li>its name, taken from the manifest</li>
 <li>its type, which will be one of "Packaged", "Hosted", or "Generated"</li>
 <li>a link to its manifest file</li>
 <li>the result of manifest validation</li>
</ul>

<p>It also gives us four commands:</p>

<ul>
 <li><strong>"Refresh":</strong> use this to update and reload the app in the Simulator after you have made changes to it. This also makes the Dashboard validate the manifest again. If you make changes to your app they will not be reflected automatically in the installed app: you will need to refresh the app to apply the changes.</li>
 <li><strong>"Connect": </strong>use this to connect developer tools to the selected app. The Dashboard will start the Simulator and app if they aren't already running.</li>
 <li><strong>"Remove" ("X"):</strong> use this to remove the app from the Simulator and the Dashboard. You can undo this action as long as the Dashboard tab is open.</li>
 <li><strong>"Receipt":</strong> use this to test receipt verification for paid apps. After you select a type of receipt to test, the app will be reinstalled with a test receipt of the given type.</li>
</ul>

<div class="note">
<p><strong>Refresh App from the Simulator window</strong>: you can update and reload an app directly from the Simulator window <a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Simulator-menubar" title="#Simulator-menubar">using the menubar action or its associated shortcut</a> while the app is running.</p>
</div>

<h3 id="Manifest_validation"><a name="Manifest-validation">Manifest validation</a></h3>

<p>When you supply a manifest, the Manager will run some validation tests on it. It reports three categories of problems:</p>

<ul>
 <li>manifest errors: problems that will prevent your app from installing or running</li>
 <li>manifest warnings: problems that may prevent your app from working properly</li>
 <li>simulator-specific warnings: features your app is using that the Simulator doesn't yet support</li>
</ul>

<p>It summarises the problems encountered in the entry for the app: clicking on the summary provides more details.</p>

<h4 id="Manifest_errors">Manifest errors</h4>

<p>The Dashboard will report the following conditions as errors, meaning that you won't be able to run your app in the Simulator without fixing them:</p>

<ul>
 <li>the manifest does not include the mandatory "name" field</li>
 <li>the manifest is not valid JSON</li>
 <li>the app is a hosted app, but the <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a> field in its manifest is <a href="https://developer.mozilla.org/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps" title="/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps">"privileged" or "certified"</a>, which are only available to packaged apps</li>
 <li>common appCache errors (packaged apps can't use appCache, requests to the manifest URL return an HTTP redirect or an HTTP error status)</li>
</ul>

<p>Here's the result of trying to add a manifest file with a missing "name":<br>
 <img alt="" src="https://mdn.mozillademos.org/files/5495/dashboard-missing-name-4.0.png"></p>

<h4 id="Manifest_warnings">Manifest warnings</h4>

<p>The Dashboard will report the following manifest issues as warnings:</p>

<ul>
 <li>missing icons</li>
 <li>the icon is less than 128 pixels: all apps submitted to the Marketplace must have at least one icon that is at least 128 pixels square</li>
 <li>the <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a> field is unrecognized</li>
 <li>the manifest requests a <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">permission</a> that is unrecognized</li>
 <li>the manifest requests a <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">permission</a> which will be denied</li>
 <li>the manifest requests a <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">permission</a> for which access could not be determined</li>
</ul>

<h4 id="Simulator-specific_warnings">Simulator-specific warnings</h4>

<p>Finally, the Manager will emit warnings for apps that use features of Firefox OS not yet fully supported by the Simulator:</p>

<ul>
 <li>the <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a> field is "certified", but the Simulator does not yet fully support certified apps</li>
 <li>the manifest requests a <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">permission</a> to use an API that is <a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Unsupported-APIs" title="#Unsupported-APIs">not yet supported</a> by the Simulator</li>
</ul>

<h2 id="Running_the_Simulator"><a name="Running-the-Simulator">Running the Simulator</a></h2>

<p>There are two different ways the Simulator may be started:</p>

<ul>
 <li>if you add an app or click the "Refresh" or "Connect" button next to your app's entry, the Dashboard will automatically run your app in the Simulator</li>
 <li>if you click the button labeled "Stopped" on the left-hand side of the Dashboard, the Simulator will boot to the Home screen and you'll need to navigate to your app</li>
</ul>

<p>Either way, once the Simulator is running, the button labeled "Stopped" turns green and the label changes to "Running". To stop the Simulator, click this button again.<br>
 <br>
 The Simulator appears as a separate window, sized so the simulated screen area is 320x480 pixels, with a <a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Simulator-toolbar" title="#Simulator-toolbar">toolbar at the bottom</a> and a <a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator#Simulator-menubar" title="#Simulator-menubar">menubar at the top</a> that contains some extra features:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5505/simulator-bars.png" style="display: block; margin-left: auto; margin-right: auto;"></p>

<p>To simulate touch events you can click the mouse button and drag while holding the button down. So by clicking and dragging right-to-left from the Home Screen, you'll see the built-in apps, as well as any apps you have added:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5517/simulator-homescreen.png"></p>

<h3 id="Simulator_toolbar"><a name="Simulator-toolbar">Simulator toolbar</a></h3>

<p>In the bottom toolbar, from left to right, these are the <strong>Home button</strong>, the <strong>Screen Rotation button</strong>, and the <strong>Geolocation button</strong>.</p>

<ul>
 <li>the <strong>Home button</strong> takes you to the Home screen (or to the task list if you keep it pressed for a couple of seconds)</li>
 <li>the <strong>Screen Rotation button</strong> switches the device between portrait and landscape orientation. This will generate the <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Managing_screen_orientation#Listening_orientation_change" title="/en-US/docs/WebAPI/Detecting_device_orientation">orientationchange</a> event.</li>
 <li>the <strong>Geolocation button</strong> triggers a dialog asking you to share your geographic location, either using your current coordinates or supplying custom coordinates: this will be made available to your app via the <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Geolocation API</a>.</li>
</ul>

<p><a href="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png"><img alt="" src="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png" style="height: 309px; width: 520px;"></a><a href="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png"><img alt="" src="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png" style="height: 297px; width: 500px;"></a></p>

<h3 id="Simulator_menubar"><a name="Simulator-menubar"></a>Simulator menubar</h3>

<p>In the top menubar, you can access some useful commands to make development more efficient:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5525/simulator-menubar.png"></p>

<ul>
 <li><strong>File -&gt; Quit</strong> (<em>Ctrl/Cmd - Q</em>): shut down the Simulator</li>
 <li><strong>App -&gt; Refresh</strong> (<em>Ctrl/Cmd - R</em>): refresh the running app</li>
</ul>

<p>The keyboard shortcut for the <strong>"App Refresh"</strong> command makes it possible to iteratively develop an app much like a web page:</p>

<ul>
 <li>make a change to the code (and rerun your build tool if needed, e.g. volo / yeoman / grunt)</li>
 <li>type the keyboard shortcut to refresh the app running in the Simulator</li>
</ul>

<div class="note">
<p><strong>"Refresh App and Clear Data" hidden shortcut:</strong> sometimes it's useful to clear data that the Simulator has stored for an app, so the Simulator contains a hidden shortcut, <em>Shift - Ctrl/Cmd - R</em>, that will refresh the running app while clearing the following data:</p>

<ul>
 <li>
  <p>localStorage / sessionStorage</p>
 </li>
 <li>
  <p>cookies</p>
 </li>
 <li>
  <p>indexedDB</p>
 </li>
 <li>
  <p>appCache</p>
 </li>
</ul>
</div>

<h2 id="Attaching_developer_tools"><a name="Attaching-developer-tools">Attaching developer tools</a></h2>

<p>You can attach developer tools to the Simulator, to help debug your app. At the moment you can only attach the <a href="https://developer.mozilla.org/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Debugger">JavaScript Debugger</a>, the <a href="https://developer.mozilla.org/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">Web Console</a>, the <a href="https://developer.mozilla.org/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Style_Editor">Style Editor</a>, the <a href="https://developer.mozilla.org/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Profiler">Profiler</a> and the <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor" title="/en-US/docs/Tools/Network_Monitor">Network Monitor</a>, but we're working on adding support for more <a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window">developer tools</a>.</p>

<div class="geckoVersionNote">
<p>Some of these tools are only available in Beta, Aurora, or Nightly builds of Firefox.</p>
</div>

<p>To attach developer tools to the Simulator, click the <strong>"Connect"</strong> button for an app:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5497/connect-to-app-button.png" style="display: block; margin-left: auto; margin-right: auto;"></p>

<p>The Dashboard will then open a developer toolbox pane at the bottom of the Dashboard tab and connect it to the app:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5501/simulator-devtools-connected.png" style="display: block; margin-left: auto; margin-right: auto;"></p>

<h3 id="Web_Console">Web Console</h3>

<p>The app can log to this console using the global <a href="https://developer.mozilla.org/en-US/docs/DOM/console" title="/en-US/docs/DOM/console">console</a> object, and it displays various other messages generated by the app: network requests, CSS and JS warnings/errors, and security errors. (<a href="https://developer.mozilla.org/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">Learn more about the Web Console.</a>)</p>

<h3 id="Debugger">Debugger</h3>

<p>Using the Debugger, you can step through JavaScript code that is running in the connected app, manage breakpoints, and watch expressions to track down errors and problems faster. (<a href="https://developer.mozilla.org/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Web_Console">Learn more about the Debugger.</a>)</p>

<h3 id="Style_Editor">Style Editor</h3>

<p>You can view and edit CSS files referenced in the app using the connected Style Editor. Your changes will be applied to the app in real time, without needing to refresh the app. (<a href="https://developer.mozilla.org/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Web_Console">Learn more about the Style Editor.</a>)</p>

<h3 id="Profiler">Profiler</h3>

<p>Using the Profiler tool connected to the app, you can to find out where your JavaScript code is spending too much time. The Profiler periodically samples the current JavaScript call stack and compiles statistics about the samples. (<a href="https://developer.mozilla.org/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Web_Console">Learn more about the Profiler.</a>)</p>

<h3 id="Network_Monitor">Network Monitor</h3>

<p>Thanks to the new Network Monitor, you can analyze the status, headers, content and timing of all the network requests initiated by the app through a friendly interface. (<a href="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/">Learn more about the Network Monitor.</a>)</p>

<h2 id="Receipts"><a name="Simulator-receipts"></a>Receipts</h2>

<p>If you are developing a paid app, you should test your receipt validation code (e.g. the code that verifies that a user has already purchased the app or has been issued a refund and then informs the user and locks or unlocks app features accordingly) on a valid (cryptographically signed) receipt.</p>

<p>Thanks to the <strong>"Receipts"</strong> menu in each app entry on the Simulator Dashboard, you can install an app with a <strong>"Valid"</strong>, <strong>"Invalid"</strong>, or <strong>"Refunded"</strong> test receipt. Simply select the type of receipt you wish to test, and the Dashboard will retrieve a test receipt of that type from the Marketplace receipt service and reinstall the app with that receipt in the Simulator:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5523/simulator-receipts-selector-4.0.png"></p>

<h2 id="Push_to_device"><a name="Push-to-device">Push to device</a></h2>

<p>If you have a Firefox OS device you can connect it to the Simulator, and can then push apps from the Dashboard to the device.</p>

<h3 id="Connecting_a_device">Connecting a device</h3>

<p>To connect the device, follow the instructions in the guide to <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop">connecting a Firefox OS device to the desktop</a>. Note that you don't have to install ADB, as the Simulator add-on includes it already.</p>

<h3 id="Pushing_apps_to_the_device">Pushing apps to the device</h3>

<p>Once you've set up the device and desktop, and connected the device to your desktop via USB, you'll see the note <strong>"Device connected"</strong> appear on the left of the Dashboard, and a new command appear in the entry for each app labeled <strong>"Push"</strong>:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5521/simulator-push2device.png"></p>

<p>Click <strong>"Push"</strong>, and the app will be installed on the Firefox OS device.</p>

<div class="note">
<p><strong>Manual Steps:</strong></p>

<ul>
 <li>
  <p>Once you’ve pushed the app to the device, you need to manually close and restart it again, to get updated content</p>
 </li>
 <li>
  <p>If you update anything in the manifest (e.g. app name, orientation, type, permissions), you need to reboot the operating system for those changes to have effect</p>
 </li>
</ul>
</div>

<h3 id="Firefox_OS_Device_Connection_Confirmation">Firefox OS Device Connection Confirmation</h3>

<p>On every device reboot, the first <strong>"Push"</strong> request needs to be confirmed on the device:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/5527/device-push-confirmation.png" style="height: 480px; width: 320px;"></p>

<h3 id="Troubleshooting_on_Linux">Troubleshooting on Linux</h3>

<p>If you are unable to connect your device after creating udev rules, please see this <a href="https://github.com/mozilla/r2d2b2g/issues/515">bug</a>.</p>

<h2 id="Limitations_of_the_Simulator"><a name="Limitations">Limitations of the Simulator</a></h2>

<p>Note that the Firefox OS Simulator isn't a perfect simulation.</p>

<h3 id="Hardware_limitations">Hardware limitations</h3>

<p>Apart from screen size, the Simulator does not simulate the hardware limitations of a Firefox OS device such as available memory or CPU speed.</p>

<h3 id="Audiovideo_codecs">Audio/video codecs</h3>

<p>The following codecs depend on hardware-accelerated decoding and are therefore not yet supported:</p>

<ul>
 <li>MP3</li>
 <li>AAC</li>
 <li>H.264 (MP4)</li>
 <li>WebM</li>
</ul>

<p>This means it isn't possible to use the Simulator to test video playback in apps and on websites like Youtube that rely on these codecs.</p>

<h3 id="Unsupported_APIs"><a name="Unsupported-APIs">Unsupported APIs</a></h3>

<p>Certain APIs that work on the device won't work on the Simulator, generally because the supporting hardware is not available on the desktop. We've implemented simulations for some APIs such as geolocation, and expect to add more in future releases. However, at the moment the following APIs are not supported. Using them might throw errors or just return incorrect results:</p>

<ul>
 <li><a href="https://developer.mozilla.org/en-US/WebAPI/WebTelephony" title="/en-US/WebAPI/WebTelephony">Telephony</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/WebSMS" title="/en-US/docs/WebAPI/WebSMS">WebSMS</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/WebBluetooth" title="/en-US/docs/WebAPI/WebBluetooth">WebBluetooth</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Using_Light_Events" title="/en-US/docs/WebAPI/Using_Light_Events">Ambient Light</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Proximity" title="/en-US/docs/WebAPI/Proximity">Proximity</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Network_Information" title="/en-US/docs/WebAPI/Network_Information">Network Information</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">navigator.onLine and offline events</a></li>
 <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Vibration" title="/en-US/docs/WebAPI/Vibration">Vibration</a></li>
</ul>

<h2 id="Getting_help"><a name="Simulator-help"></a>Getting help</h2>

<p><span style="line-height: 1.572;">If you have a question, try asking us on the </span><a href="https://lists.mozilla.org/listinfo/dev-developer-tools" style="line-height: 1.572;">dev-developer-tools mailing list</a><span style="line-height: 1.572;"> or on </span><a href="irc://irc.mozilla.org/#devtools" style="line-height: 1.572;">#devtools on irc.mozilla.org</a><span style="line-height: 1.572;">.</span></p>

<h3 id="How_to_enable_verbose_logging"><a name="Simulator-verbose-logging"></a>How to enable verbose logging</h3>

<p>Use about:config to create the preference <a href="mailto:extensions.r2d2b2g@mozilla.org.sdk.console.logLevel">extensions.r2d2b2g@mozilla.org.sdk.console.logLevel</a>, set it to the integer value 0, and disable/reenable the addon. Additional messages about the Simulator's operation will appear in the Error Console (or Browser Console in newer versions of Firefox).</p>
</div>
</div>

<div class="note">
<p> </p>
</div>

<p> </p>