dynaTrace is happy to announce that The Best Web 2.0 Diagnostics Tool now supports Internet Explorer and Firefox and is available for free download on the dynaTrace Ajax Website.
For feedback please use the dynaTrace Ajax Edition 3.0 Public Beta Forum.
The final release will follow in a couple of weeks and will be announced ahead of time on the Dynatrace Website. In this blog I want to show you 4 main Use Cases that will help Developers, Testers and Test Automation Engineers with the challenging aspects of Web 2.0 across different browsers:
- Share Data with my colleagues or 3rd party providers
- Compare Performance Behavior between IE and FF
- Automate Performance Analysis by integrating Dynatrace with Selenium, WebDriver, Watir, QTP, Silk, …
Use Case 1: Deep Trace in Firefox and Internet Explorer
Let’s walk through a simple tracing scenario with Dynatrace Ajax. Especially for new users to Dynatrace these steps will be like a Quick Start Guide.
Step 1: Install Dynatrace Ajax Edition
That’s easy – just execute the Windows Installer you downloaded. The Installer installs 3 components on your machine
- dynaTrace Ajax Edition Client -> that’s the one we are starting through the Start Menu
- a Firefox Add-On
- an Internet Explorer Add-On
ATTENTION: It is not recommended to install Dynatrace Ajax Edition 3.0 side-by-side with an older version – so please uninstall any current version first. Existing recorded sessions will still be available for diagnosis – no data is lost 🙂
When you launch Dynatrace Ajax Edition you will see a dialog that prompts you for your Dynatrace Community Account credentials in order to access Live Performance Data that you can later use to compare against your own web site performance.
If you want to know more about how and where this becomes handy check out Live Performance Benchmark Data.
Step 2: Start Tracing a Web Application
dynaTrace will capture browser activity through the installed Add-Ons. Capturing can be started from the Dynatrace Ajax Edition by letting Dynatrace open a new browser for you. The other option is that you manually open a browser and use the Dynatrace Toolbar in Internet Explorer or the Dynatrace Status Bar Extension in Firefox to connect the browser to the Dynatrace Ajax Edition. We will start tracing from within the Dynatrace Ajax Edition.
Existing users will notice a different toolbar. As we now support two browsers you can instruct Dynatrace to either start Internet Explorer or Firefox.
Let’s click on Firefox as we want to test the new Firefox capabilities. Dynatrace will prompt you to enter a URL and a name for a new Run Configuration. I am going to trace news.yahoo.com and name the configuration Yahoo News.
How can you tell that activities are actively recorded? In Firefox you will see a Dynatrace logo and the text Connected in the Status Bar. In Internet Explorer you will see the Dynatrace Toolbar with the status Connected:
Now it’s time to record some activity. On the Yahoo News Page I start entering “Dynatrace” in the search field and then hit the enter key.
dynaTrace will record all activity that happens while I interact with the page. When I see the search result page I consider this test to be done. I could go on but for this quick Tutorial we have enough data to explore.
I close the browser and go back to Dynatrace Ajax Edition.
Step 3: Analyze the Data
dynaTrace has recorded all browser activities and stored it for me in a Dynatrace session. When we look at the Dynatrace Ajax Edition client we will see a new Session named Yahoo News (that’s the name I used when defining the start URL). We can now analyze different aspects of the captured data:
The best way to start is to have a look at the Performance Report. You can either double click on the Session Name or double click on Performance Report. In both cases it will open the Dynatrace Performance Report giving us a detailed analysis of all different Web Performance aspects.
Attention: One current limitation for Firefox is that we do not yet get rendering times. Therefore the First Impression Time does not yet get calculated correctly!
In this blog I want to discuss two tabs that are really interesting. The first one is the TimeLine. It shows me all activities I did on a particular URL. Let’s have a look at the main Yahoo News page:
We could go on by exploring the other tabs but I again refer to the dynaTrace Ajax Edition Walkthrough Video.
Also make sure to check into our dynaTrace Ajax Edition 3.0 Public Beta Forum. It is a Beta – so – there are still some limitations to the tool.
Use Case 2: Share captured Data
One thing I really like about Dynatrace Ajax Edition is not only can I analyze data recorded on my local machine – once I have a stored session I can export it and share it with others. This can become very handy in the following situations
- You are a tester and have found a problem in the app you are testing. Send the session to your developer and he can analyze the problem as it happened on your machine
- You are a developer and found a problem with a framework component from a 3rd party provider. Send the session to the 3rd party framework company for them to analyze the problem in your app
- You have a user that complains about problems on his machine that you can’t reproduce locally. Ask her/him to record the actions with Dynatrace and then analyze the problem on your local machine
Sharing is easy. Sessions can be exported/imported through the toolbar
Use Case 3: Compare Behavior between Firefox and Internet Explorer
As we have already recorded a simple scenario on Firefox let’s do the same for Internet Explorer. Follow the same steps as before but instead of tracing Firefox we trace Internet Explorer. To make it easier for us we can just launch the same Run Configuration for Yahoo News for Internet Explorer through the toolbar:
When we are done recording the same sequence of pages we can look at the captured data in the Performance Report. We can compare side-by-side what the results are for Firefox and Internet Explorer:
Rather than analyzing the differences manually, it is much better to automate it somewhat. Dynatrace Ajax Edition allows you to Copy/Paste any tabular data. If we, for instance, want to see the differences in Network Requests for the Yahoo News Main Page we can drill into the Network View for both stored sessions.
So I end up having two Network Views open that show me all Network Requests for the Yahoo News Page in Internet Explorer and Firefox. We select all entries (Ctrl-A) and then Copy (Ctrl-C) and Paste (Ctrl-V) it to a tool such as MS Excel. With some “Excel magic” you can figure out where the differences between Internet Explorer and Firefox are.
Use Case 4: Automate Performance Analysis
We have already blogged about how to use Dynatrace Ajax in a Continuous Integration environment by integrating it with your Selenium, Watir, Silk, QTP or WebDriver scripts. The idea is that – whenever you have a functional test that actively drives a browser instance you can add Dynatrace Ajax into the mix and let Dynatrace record the browser activity driven by the test tool.
The great news with Dynatrace Ajax Edition 3.0 is that this can now be used for both Internet Explorer and Firefox allowing you to automate performance analysis across browsers without having to modify your tests scripts. If you are interested in automation please check out the following posts:
- dynaTrace in Continuous Integration – The Big Pictures
- 5 Steps to setup ShowSlow as Web Performance Repository for Dynatrace
- dynaTrace Continuously Monitors ShowSlow URLs
Consolidated Environment Variables
In order to automate Dynatrace Ajax Edition we use windows environment variables to enable/disable that Browser Add-Ons. With Dynatrace Ajax Edition 3.0 we made a slight change to the environment variables. For both Internet Explorer and Firefox they start with DT_AE_. A detailed description on these environment variables can be found in the dynaTrace Ajax Automation Forum.
It is free! So, what do we want in return?
We want your feedback on our dynaTrace Ajax Edition 3.0 Public Beta Forum. We also want you to blog and tweet about it to spread the word. Let us know if you do so – and now enjoy working with Dynatrace Ajax Edition 3.0 Public Beta.