summaryrefslogtreecommitdiffstats
path: root/comm/suite/locales/en-US/chrome/common/help/developer_tools.xhtml
blob: baff9415431c75558a25bdff86068104530fd1dc (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
<?xml version="1.0" encoding="UTF-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"[
  <!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd" >
  %brandDTD;
]>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>&brandShortName; Tools and Development</title>
<link rel="stylesheet" href="helpFileLayout.css"
  type="text/css"/>
</head>
<body>

<h1 id="web_development_tools">Web Development Tools</h1>

<p>For web developers, &brandShortName; provides several tools to aid in
  developing and debugging <a href="glossary.xhtml#web_application">web
  applications</a>. Some of these are optional installs. To access these
  tools, open the Tools menu and choose Web Development.</p>

<ul class="separate">
  <li id="js_console">
    <strong>Error Console</strong>: a console window that reports problems
    with <a href="glossary.xhtml#javascript">JavaScript</a> and CSS code in
    web applications and the &brandShortName; application itself. By default, 
    CSS parsing errors and JavaScript errors are displayed. The console can 
    also be used to display logged messages from <a href="glossary.xhtml#xul">
    XUL</a> and JavaScript code.
  </li>
  <li id="inspector">
    <strong>DOM Inspector</strong>: a tool that can be
    used to inspect and edit the DOM of any web document or XUL
    application.

    <p>Online resources:</p>
    
    <ul>
      <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Add-ons/DOM_Inspector">DOM
        Inspector</a>(developer.mozilla.org)</li>
      <li>Creating Applications with Mozilla - Appendix B3:
        <a href="http://books.mozdev.org/html/mozilla-app-b-sect-3.html">The
        DOM Inspector</a></li>
    </ul>
  </li>
  <li id="devtools">
    <strong>Developer Tools</strong>: &brandShortName; includes a set of
    developer tools that can be docked to the bottom of a browser window or
    used in a separate window. The <strong>Toggle Tools</strong> command in
    the Web Development menu can be used to open and close the Developer Tools.

    The Developer Tools are shared with Firefox. To learn more about the
    Developer Tools, visit the <a href="https://developer.mozilla.org/docs/Tools">
    Firefox Developer Tools site</a>.
  </li>
  <li id="webide">
    <strong>WebIDE</strong>: &brandShortName; includes Developer Tools WebIDE,
    which can be used to debug other web sites or Gecko-based applications
    running on the same computer, or on another device (such as a smartphone)
    through a USB or network connection. To learn more, visit the
    <a href="https://developer.mozilla.org/docs/Tools/Remote_Debugging">Remote
    Debugging</a> page at MDN. Note that you may not be able to debug
    applications that are newer than the included version of WebIDE.
  </li>
</ul>

</body>
</html>