Zimlet Developers Guide:Firefox and Firebug: Difference between revisions

No edit summary
 
(11 intermediate revisions by 5 users not shown)
Line 1: Line 1:
{{BC|Community Sandbox}}
__FORCETOC__
<div class="col-md-12 ibox-content">
= Zimlet Developers Guide: Firefox and Firebug =
{{KB|{{Unsupported}}|{{ZCS 8.0}}|{{ZCS 7.0}}|}}
{{Archive}}
{| cellspacing="0" cellpadding="5" style="border: 1px solid rgb(153, 153, 170); margin: 0pt 0.5em 0.5em 0pt; float: none; background-color: rgb(249, 249, 255);"
{| cellspacing="0" cellpadding="5" style="border: 1px solid rgb(153, 153, 170); margin: 0pt 0.5em 0.5em 0pt; float: none; background-color: rgb(249, 249, 255);"
|[[Image:zdg-6-menu-icon-zimbra.jpg|20px]]
|[[Image:zdg-6-menu-icon-zimbra.jpg|20px]]
|[[ZCS 6.0:Zimlet Developers Guide:Introduction|Introduction]]
|[[Zimlet Developers Guide:Introduction|Introduction]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-green-flag.png|20px]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-green-flag.png|20px]]
|[[ZCS 6.0:Zimlet Developers Guide:Getting Started|Getting Started]]
|[[Zimlet Developers Guide:Getting Started|Getting Started]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-terminal.png|20px]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-terminal.png|20px]]
|[[ZCS 6.0:Zimlet Developers Guide:Dev Environment Setup|Dev Environment Setup]]
|[[Zimlet Developers Guide:Dev Environment Setup|Dev Environment Setup]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-gear.png|20px]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-gear.png|20px]]
|
|


     {|
     {|
     |[[ZCS 6.0:Zimlet Developers Guide:Developing Zimlets|Developing Zimlets]]
     |[[Zimlet Developers Guide:Developing Zimlets|Developing Zimlets]]
     |-
     |-
     |[[ZCS 6.0:Zimlet Developers Guide:Proxy Servlet Setup|Proxy Servlet Setup]]
     |[[Zimlet Developers Guide:Proxy Servlet Setup|Proxy Servlet Setup]]
     |-
     |-
     |'''Firefox and Firebug'''
     |'''Firefox and Firebug'''
     |-
     |-
     |[[ZCS 6.0:Zimlet Developers Guide:Troubleshooting|Troubleshooting]]
     |[[Zimlet Developers Guide:Troubleshooting|Troubleshooting]]
     |}
     |}


|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-advanced.jpg|20px]]
|[[Zimlet Developers Guide:Advanced Concepts|Advanced Concepts]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-library.jpg|20px]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-library.jpg|20px]]
|[[ZCS 6.0:Zimlet Developers Guide:Zimlet API Specifications|API Specifications]]
|[[Zimlet Developers Guide:Zimlet API Specifications|API Specifications]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-checkbox.jpg|20px]]
|style="border-left: 1px solid rgb(153, 153, 170);"|[[Image:zdg-6-menu-icon-checkbox.jpg|20px]]
|[[ZCS 6.0:Zimlet Developers Guide:Example Zimlets|Example Zimlets]]
|[[Zimlet Developers Guide:Example Zimlets|Example Zimlets]]
|}
|}


== Mozilla Firefox Settings ==
== Mozilla Firefox Settings ==
Line 89: Line 97:
}
}
</pre>
</pre>
'''Note:''' ensure that console.log statements are removed prior to deploying your Zimlet. Browsers without a console object (IE, Firefox without Firebug, etc) will throw an error when encountering a console.log() statement and halt execution of the Zimlet.


=== Network ===
=== Network ===
Line 98: Line 108:
<li>Error 500 == your request is incorrect; i.e.the url or some parameter isnt properly formatted or constructed</li>
<li>Error 500 == your request is incorrect; i.e.the url or some parameter isnt properly formatted or constructed</li>
</ul>
</ul>
{{Article Footer|Zimbra Collaboration Server 7.0|12/22/2009}}
[[Category:Developers]]
[[Category:Zimlets]]
[[Category:ZCS 7.0]]
[[Category:ZCS 6.0]]

Latest revision as of 12:23, 16 July 2015

Zimlet Developers Guide: Firefox and Firebug

   KB 3211        Last updated on 2015-07-16  




0.00
(0 votes)


Zdg-6-menu-icon-zimbra.jpg Introduction Zdg-6-menu-icon-green-flag.png Getting Started Zdg-6-menu-icon-terminal.png Dev Environment Setup Zdg-6-menu-icon-gear.png
Developing Zimlets
Proxy Servlet Setup
Firefox and Firebug
Troubleshooting
Zdg-6-menu-icon-advanced.jpg Advanced Concepts Zdg-6-menu-icon-library.jpg API Specifications Zdg-6-menu-icon-checkbox.jpg Example Zimlets

Mozilla Firefox Settings

Everytime the browser load zimlets, the zimlet code is cached in the browser. When doing development, you are often changing the zimlet JavaScript code and therefore, do not want the browser to cache. Note: You still want the browser to keep cookies and authtokens.

To accomplish the above, perform the following configuration settings:

On Windows

  1. Launch Firefox.
  2. Browse to Tools > Options > Privacy
  3. Click the "Settings" button in the "Private Data" section.
  4. Check "Cache".
  5. Uncheck "Authenticated Sessions".
  6. Uncheck "Cookies".
  7. Press "OK".
  8. Check "Always clear my private data when i close Firefox". This will help in clearing cache whenever we press Refresh.
  9. Uncheck "Ask me before clearing private data".
  10. Press "OK".

On MacOS

  1. Launch Firefox.
  2. Browse to Firefox > Preferences > Privacy
  3. Check "Clear history when Firefox closes".
  4. Click the "Setting" button
  5. Check "Cache".
  6. Uncheck "Active Logins".
  7. Uncheck "Cookies".
  8. Press "OK".

Getting Firebug

Firebug is a Mozilla Firefox Add-on and is a great JavaScript debugging tool. Download it at [1]

Useful Firebug Utilities

Debugger

One of the most useful utilities in Firebug is the debugger; statement. Simply write the debugger; statement anywhere in your zimlet JavaScript code and when reached, execution will halt and open the Firebug script debug window. When in the Firebug debug window, you can step through the code, into and over methods and instruct the code to continue.

Example usage:

com_zimbra_test.prototype.function = function() {
 var i =0;
 debugger;  // javascript halts at this line
 doSomethingWith(i);
}

Console Logging

Similar to a System.out.println() in Java, console.log(something) in Firebug allows you to log to the console window. More information is available at [2].

Example usage:

com_zimbra_test.prototype.function = function() {
 var i =0;
 console.log("I want to write something to the console");  // will write this line to the Firebug console
 doSomethingWith(i);
}

Note: ensure that console.log statements are removed prior to deploying your Zimlet. Browsers without a console object (IE, Firefox without Firebug, etc) will throw an error when encountering a console.log() statement and halt execution of the Zimlet.

Network

Firebug allows you to see network traffic between the web client browser and the server. When accessing services from your zimlet, the two common network responses/errors you will see are 403 and 500. In Firebug, you can easily debug errors.

  • Error 403 == permission denied; or access it not allowed
  • Error 500 == your request is incorrect; i.e.the url or some parameter isnt properly formatted or constructed


Verified Against: Zimbra Collaboration Server 7.0 Date Created: 12/22/2009
Article ID: https://wiki.zimbra.com/index.php?title=Zimlet_Developers_Guide:Firefox_and_Firebug Date Modified: 2015-07-16



Try Zimbra

Try Zimbra Collaboration with a 60-day free trial.
Get it now »

Want to get involved?

You can contribute in the Community, Wiki, Code, or development of Zimlets.
Find out more. »

Looking for a Video?

Visit our YouTube channel to get the latest webinars, technology news, product overviews, and so much more.
Go to the YouTube channel »

Jump to: navigation, search