BugReporter

What is it?

BugReporter allows you to report bugs when building a web site with a few people. If you, for instance, are working on a website with a team, other members can easily report errors, mistakes, bugs etcetera with two clicks.

BugReporter is mainly a JavaScript that can be embedded into your template or pages.

Features

• AJAX sending of the bugs;
• Fixed positioned window that can be switched transparent/solid by double-clicking (absolute positioned in IE6 automatically);
• User-selected text can be easily reported as bug, just select some text and hit the 'Bug' button;
• Browsers supported: Internet Explorer 6 and higher, Firefox, Safari, Opera.

Requirements

• PHP on your server (other server-side languages are possible, see customization of the server-side);
• JavaScript enabled, optional cookies too.

Demo

A demo says more than 1,000 words. So you can try the BugReporter at the demo page, and you can see the list of bugs reported as well.

Download

BugReporter version 1.0 (RAR-file, 6.33 kB)

Implementation info

Implementing can be done in a few steps:

1. Download and unpack the RAR-file;
2. Upload it, and be sure that bugs.txt is writable;
   • If you not want the bugs being stored in a plain text file (for example in a database), or using another server-side language, you should write that by yourself. See customization of the server-side.
3. Add the following line to your template: <script type="text/javascript" src="/path/to/the/bugreporter.file.js"></script>;
4. If another script or library on your web page already uses the window.onload event handler to trigger a function, you have to change bugreporter.js. At the bottom of the file you have to completely remove the window.onload statement. Then add the bugReporter() function to your window.onload, or place the following code at the bottom of your page too: <script type="text/javascript">bugReporter()</script>.

Customization of the server-side

Since I only know PHP, and needed only storage in a text-file, the server-side of the script is very small. But with the following information you might be able to customize the server-side:

• Variables are sent with POST data, and named as following:
  • name - the name of the person who submits the bug;
  • bug - the bug;
  • comments - the comments;
  • location - URL of the page with the bug.
• The script outputs only two integers: 0 when there occurs an error, and 1 when everything is ok.

Special thanks

• Kilian Valkhof - for comments and testing

• Copyright Arjan Eising 2007