|
| 1 | + # Adding to p5.js Friendly Error System |
| 2 | + |
| 3 | +#### By Shantanu Kaushik ([@Aloneduckling](https://github.com/Aloneduckling)) | GSoC 2021 |
| 4 | + |
| 5 | +### Overview |
| 6 | +Throughout this summer, I worked on p5.js's Friendly Error System (FES in short) under the mentorship of Thales Grilo and Luis Morales-Navarro. The FES is a p5.js feature |
| 7 | +which supports beginners when encountering common errors, checking for common mistakes and providing simple and easy to understand error messages. |
| 8 | +This project aimed to further improve FES by further building on an existing feature and adding new features. |
| 9 | + |
| 10 | +The major goals of this project were: |
| 11 | +1. Additions to FES's `fesErrorMonitor`. |
| 12 | +2. Allowing FES to detect redeclaration of p5.js reserved variables and functions |
| 13 | + |
| 14 | + |
| 15 | +### Work |
| 16 | +#### Phase 1: Adding to FES's `fesErrorMonitor` |
| 17 | + |
| 18 | +`fesErrorMonitor` functionality of FES shows the error given by the browsers and its details in a simple form. This feature was introduced to FES in GSoC 2020 by Akshay Padte. |
| 19 | + |
| 20 | +FES's `fesErrorMonitor` has a list of errors that it detects. That list could be extended by adding more errors that a user can encounter. |
| 21 | + |
| 22 | +My work was to extend this list and enable `fesErrorMonitor` to detect more commonly seen errors and show them in a simplified form. |
| 23 | + |
| 24 | +The list of errors that were added: |
| 25 | + |
| 26 | + |
| 27 | + |
| 28 | +While working on this phase I had a lot of back and forth interaction with my mentors to ensure that the error messages are to the point and easy to understand by the user. |
| 29 | + |
| 30 | +All the code and error messages can be viewed here: [GSoC'21: adding to FES phase 1 #5305](https://github.com/processing/p5.js/pull/5305) |
| 31 | + |
| 32 | +#### Phase 2: New feature `sketch_reader.js` |
| 33 | + |
| 34 | +In this phase, I added a new feature to the FES to detect the redeclaration of p5.js's reserved variables and functions. |
| 35 | + |
| 36 | +If a user by mistake redefines a p5.js reserved constant/function then it can cause problems and create confusion. For Example: |
| 37 | + |
| 38 | +```js |
| 39 | +//user redefines p5.js's "text" function |
| 40 | +let text = function(){ |
| 41 | + console.log('hello world'); |
| 42 | +} |
| 43 | +//if the user intends to user p5.js text function somewhere in their code then it won't work |
| 44 | +``` |
| 45 | +The new feature `sketch_reader.js` tackles this problem. |
| 46 | + |
| 47 | +`sketch_reader.js` does the following: |
| 48 | + |
| 49 | +(I) Checks if any p5.js constant or function is declared by the user outside the `setup` and `draw` function and reports it. |
| 50 | + |
| 51 | +(II) In `setup` and `draw` function it performs: |
| 52 | + 1. Extraction of the code written by the user |
| 53 | + 2. Conversion of the code to an array of lines of code |
| 54 | + 3. Catching variable and function declaration |
| 55 | + 4. Checking if the declared function/variable is a reserved p5.js constant or function and report it. |
| 56 | + |
| 57 | +While working on this feature I learned a lot of new things about p5.js and the working of the FES. |
| 58 | +This feature was a necessary addition as it resolves a common problem which the new p5.js users might encounter. |
| 59 | + |
| 60 | +All the work in this phase can be viewed here: [Detecting redeclaration of p5.js reserved constants and functions #5351](https://github.com/processing/p5.js/pull/5351) |
| 61 | + |
| 62 | +### Conclusion and Acknowledgements |
| 63 | + |
| 64 | +I enjoyed working on this project and learned a lot of things this summer. |
| 65 | + |
| 66 | +I would like to thank my mentors **Thales Grilo** and **Luis Morales-Navarro** for their invaluable help and guidance throughout this summer of code. I would like to thank the **Processing Foundation** for creating such an awesome library. I would also like to thank **Google the GSoC team** for giving student developers like me a chance to work on awesome projects and make our summer productive. |
| 67 | + |
| 68 | +## PRs made |
| 69 | + |
| 70 | +### Phase 1 |
| 71 | +[GSoC'21: adding to FES phase 1 #5305](https://github.com/processing/p5.js/pull/5305) |
| 72 | +### Phase 2 |
| 73 | +[Detecting redeclaration of p5.js reserved constants and functions #5351](https://github.com/processing/p5.js/pull/5351) |
0 commit comments