Skip to content
This repository has been archived by the owner on Jun 6, 2018. It is now read-only.

Browser Development Toolbar

Jump to bottom
Jason Benton edited this page Jan 14, 2016 · 3 revisions

To view details of elements in your web application, it is recommended to use a developer toolbar as it will provide element inspection functionality. These quickly show you the element attributes and properties you need to know to automate them with Watir.

The following browsers have development toolbars available:

Internet Explorer 8 and later

Windows Internet Explorer Developer Tools are included with the browser. Please see this article in MSDN for documentation.

Internet Explorer 7 and prior

  1. Log in as System Administrator
  2. Download the Developer Tools
  3. Run the install
  4. After installing the toolbar, select Tools -> Toolbars -> Explorer Bar -> IE DOM Explorer.

Firefox

Firefox has a built-in page inspector. Please see this article in the Mozilla Developer Network for documentation.

Another popular developer toolbar for Firefox is called Firebug, and is available as a plug-in.

  1. Visit http://getfirebug.com/
  2. Click Install Firebug
  3. Click Add to Firefox
  4. Follow prompts and restart Firefox to enable add on
  5. Click the bug icon to the right of the URL window of Firefox
  6. Click the Inspect icon then any element in your app to see its properties

Chrome

The Developer Toolbar for Chrome is included in the Chrome installation. Please see the Chrome Developer Tools documentation for more information.

Opera

The Developer Toolbar for Opera is included in the Opera installation and is called Dragonfly. Please see the Dragonfly documentation for more information.

Clone this wiki locally