Using the debugging tools in the Chrome browser Kyle will debug and fix a null pointer exception embedded in the currency converter application.
- [Narrator] As I alluded to in the previous section, if you keep testing the application, you may come across an error. Let's resume the debugger, and show you where that error occurs. It seems to happen whenever the two rates are the same. So if I change USD to the New Zealand dollar, and resume script execution, a couple things have changed. I don't know if you noticed, but one New Zealand dollar is equal to 0.69 New Zealand dollars? That's obviously not correct.
We also have an error that's showing up here, in the menu bar of the DevTools. If you click on it, it'll open up a console window, displaying what the error is. Right now it's saying it cannot read property isNumber of null. And it's occurring on line 130 in our source, Converter.java. So if we scroll down to 130, here's where the error occurs, where we try and set the second amount. And more specifically, it's erring out on isNumber, saying it is null.
So isNumber's returning null. We really have to figure out why that is. Why is the rate for New Zealand dollar returning null? Well, we're already watching that rates variable. So let's inspect it before we hit this error. So basically, let's resume the application by changing this back to some other rate, and checking the rate's variable that we're watching. What we're looking for, since these are the kind of variation rates for the New Zealand dollar as the primary rate that's selected, we're looking for the conversion rate for New Zealand dollar.
And it should be right here. So that's why we're getting a null. 'Cause we're trying to grab the rate to convert a New Zealand dollar to a New Zealand dollar, but the New Zealand dollar conversion rate is not in the rates list. I guess that kind of makes sense. What would the conversion rate be for one currency to the same currency? So one New Zealand dollar to one New Zealand dollar, the conversion rate's always going to be one. So maybe that makes sense that it's not in the rates list. So how can we programmatically account for this? Let's go back to our source code.
Like I said, we're trying to grab the second rate which in our example was the same as the first. So the second rate in the example would be New Zealand dollar, which is not there. But we also know that the conversion rate, if the same as the first, is always going to be one. So maybe we can just check for that, and say: If the primary rate is the same as the second rate, then we don't actually have to figure out what that conversion rate is, and just use the rate of one.
Otherwise, the alternative is to try and put New Zealand dollar back into the rates variable, set the value to one, and it just makes things more complicated than we need to. So let's go ahead, and do that check, right before we assign the second amount. We'll say, if the secondRate.equals the primaryRate, we'll make the secondAmount equal to the primaryAmount.
We have an error here because I really need to find the second amount, after this check. So let's copy that, move it just above the check, define it there, and add the calculation for the second amount in the else statement. So now what we're doing is we're checking if the secondRate is equal to the primaryRate, then we just set the rate amounts equal.
So one New Zealand dollar will be equal to one New Zealand dollar, or 400 New Zealand dollars would be equal to 400 New Zealand dollars. If the rates are different, then we have to do the calculation, grab the conversion rate, multiply it by the primaryAmount, and set the secondAmount. So let's save our work, go back to our application, refresh the page, and see if that worked. So, to test this I'm going to change our second rate to euros.
And it should say one euro is equal to one euro. Let's see if that works. Resume execution. Viola! One euro is equal to one euro.
In this course, learn how to build high-performance, browser-based apps using GWT. Kyle Gower-Winter introduces you to GWT, explaining the benefits of using this toolkit to build dynamic web pages. To help you practice what you learn, he shows how to build a simple foreign exchange rate application. Plus, Kyle covers managing AJAX events on the client, handling UI action events, debugging code, and more.
- Creating and running a GWT application
- Working with GWT widgets and UiBinder
- Manage AJAX events on the client
- Using a GWT RequestBuilder object
- Debugging in the browser
- Setting breakpoints and inspecting variables
- Running locally in production mode