CodeMirror/Witty – Error Extraction

Last week and as I mentioned in my previous blog entry I managed to compile the file that comes from the browser which contains the content of the code editor using g++ compiler ( Gnu C++compiler).

In this week my task was to:

– extract the syntax error and warning messages and lines numbers from the output of the compiler

– Update the editor with those errors

So let’s go through them one by one 🙂
extract the error and warning messages and lines numbers:

Let me first talk about very interesting topic which is the Regular Expression. The regular expression is a language on its own. it makes the process of searching and matching easier. it can be used from phone number validation to searching for particular word in a file. For example: If you want to search for phone numbers that start with ’09’  the regular expression for that could be : 09(\d{8})
The engine will match every number that start with 09 and followed by any 8 digits. ( \d represents any digit , {8} represents the number of repetitions )

For more information about the regular expression I really recommend these pages for you :

– http://www.onlamp.com/pub/a/onlamp/2006/04/06/boostregex.html?page=1

– http://regexone.com/

For extraction, I used the boost library (boost::regex). The boost-regex library is responsible for interpreting the regular expression and either test if it matches a target string (matching) or test if part of the string contains that regular expression (searching).

The boost.regexp library is very rich with functions that make the process of extraction simple. So in order to extract the syntax error and warning I really had to first understand the format of the g++ compiler as different compilers have different formats. The output of the compiler usually follows the following format.

File-name:line-number:column-number : error or warning messages

The first section shows the name of the file that has been compiled the second section shows the line-number of the error or the warning the following section shows its column-number, The last section shows the error and the warning messages. Sometimes the compilers provides a description of where the error is in that line. As you can notice each section is separated by semi-colon.

So what I did was trying to come up with a regular expression that can match  that format . and Here it’s..

(.+):(\\d+):(\\d+):\\s.*((error|warning).+) .

I read the compiler output file line by line and compared each line (string)  with that regular expression using regex_match ( one of boost-regexp library functions) which takes the target string and the regular expression as arguments and returns true if they match or false if they don’t.

But the beauty of that function is not that only it can also let you parse your string into pieces as it stores the results in cmatch objects.

By using this feature the extraction of the line-number and the (error and the warning ) messages becomes easy.

So after extraction the challenge was to put the error and warning line-number and messages in a format that can be later interpreted by the browser for updating the editor with the error and the warning.

Json format was my choice, I managed to put them in a form of array that consists of object. Each object represents error or warning line and has both line and error properties.

Then I just print the result in a temporary file.

Using the handleRequest function of the WResource that was created last week in order to deal with codemirror files. (for more information refer to my prev blog). I managed to send the lines and errors messages using response object function out().

At first I tried to send the information from the temporary file stream using ofstream class directly.

Response.out() << (object-of-ofsream).rdbuf();

This worked partially well. I sometimes received some output on the browser and sometimes not. Don’t ask me Why -_-

Any way, saving all the content of the file first in a string before sending was indeed a workable idea 😉

Update the editor with those errors:

Well, after successfully receiving the error and warning lines numbers and messages. The next task was to use them to update the editor.

Although I put them on JSON format the server sends them as a text/plain data type.So on the browser I used the Jquery function parseJSON to convert the JSON string to javascript value, so then I can simply access it.

The code editor provides different techniques to highlight or to show the place of the error. I used addLineWidget function which takes the number and messages and insert a widget under that line that contains the syntax error.

I won’t go in details but you can refer to this link for more details about this technique.

http://codemirror.net/demo/widget.html

Finally, I can say  that the code is working. And here are some photos that show the results.

LOOL I’m really ‘HAPPY’ to see some ‘ERRORS’ messages in my code.