Lab 14 - Debugging Tools & Strategies

Challenge

The challenge of this lab is to debug and fix old assignments, along with creating our Lab 14 pages.

Problems

We didn't have any big problems. One of Helwa's outputs wasn't showing up correctly on her Lab 8 page, but I noticed that it was because her variable shared the same name as another function; she renamed the variable and set the output with that variable, which then made the answers to the function appear on the page.

Reflection

My partner, Helwa Halloum, and I met up at my apartment around 4 PM to work together on debugging Lab 8.

Results

Go to our Lab 8 pages to check out our new and improved labs!

Debugging

The original versions of both my and Helwa's Lab 8 pages wouldn't display all three of our arrays (array, initial result, and mapResults) for the bonus task. We tried multiple times to try to get all three arrays to output onto the page, but it'd either display only one array, or it'd display part of the string and wouldn't load the arrays at all. For this lab, we went back to try and get all three arrays to appear, which we successfully managed. We simply added two more output divs to the Lab 8 index.html along with two other output codes to the Javascript. Those JS codes were then set to output the arrays we needed using their variable names. After adding those two sections of codes for the other two arrays, all three outputs appeared perfectly on the lab page. We also styled our CSS to create a border and background around the outputs for better organization and appearance. Here are some screenshots showing the original Lab 8 and what we did to debug it:

Original Lab 8:

Debugged Lab 8 HTML Source Code:

Debugged Lab 8 CSS Source Code:

Debugged Lab 8 JavaScript Source Code:

Debugged Lab 8: