Error Handling: Read the console output!
Tags: javascript, webdev, tutorial
Published: 2020-08-18 22:54:53

I'm currently going through Metric-Imperial Converter project on freeCodeCamp. Furthermore, I'm working on the Error Handling part of the user stories.

I've encountered different types of error, but I'll focus on one for this article.
```javascript
TypeError: Cannot read property 'includes' of null
    at ConvertHandler.getNum (/home/username/webdev/metric-imperial-converter/controllers/convertHandler.js:24:13)
    at /home/username/webdev/metric-imperial-converter/routes/api.js:21:36
    at Layer.handle [as handle_request] (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/layer.js:95:5)
    at next (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/route.js:137:13)
    at Route.dispatch (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/route.js:112:3)
    at Layer.handle [as handle_request] (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/layer.js:95:5)
    at /home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/index.js:281:22
    at Function.process_params (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/index.js:335:12)
    at next (/home/username/webdev/metric-imperial-converter/node_modules/express/lib/router/index.js:275:10)
    at urlencodedParser (/home/username/webdev/metric-imperial-converter/node_modules/body-parser/lib/types/urlencoded.js:91:7)
```

This seems intimidating at first, but the solution may be located in the first few lines. Let's look at the first line:
```javascript
TypeError: Cannot read property 'includes' of null
```

There are two `includes` methods: one on the `String` object, and the other the `Array` object. 

>Note: the `Array` includes is *case-sensitive* when comparing strings and characters.

I should be passing a `string` or an `array` as an argument, but its receiving `null` as the value. Let's if the error message can still help us:

```javascript
at ConvertHandler.getNum (/home/username/webdev/metric-imperial-converter/controllers/convertHandler.js:24:13)
```

From this we can gather that it takes place in the `getNum` method part of the ConvertHandler module.


Let's look at the code:

```javascript
this.getNum = function(input) {
    var result = null;
    var num = null;
    var numRe = (/\d\.?\d*\/?\d?\.?\d*/g);

    // Check if fraction
    if (num.includes('/')) {
    ...
    }
  };
```

A simple mistake. I forget to update the `num` variable. I set it to `null` at first, since it receives a value later.

Revised code:
```javascript
this.getNum = function(input) {
    var result = null;
    var num = null;
    var numRe = (/\d\.?\d*\/?\d?\.?\d*/g);
  
    num = input.match(numRe).join('');    // Fix Type Error

    // Check if fraction
    if (num.includes('/')) {
    ...
    }
  };
```

I hope this helps you with debugging. The console can be a valuable resource in squashing bugs. 

>NOTE: Recently, I improved the code. However, I think others might benefit from my mistake, and help with their own debugging.

Resources:
[String includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)
[Array includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)

*Photo by Franco Atkins from Pexels*