Automatically grading JavaScript code assignments

Input/Output autograding

Many programming courses, particularly introductory courses, teach students how to create programs and interact with them through the command line interface (CLI). For instance, a simple program might prompt a user to provide a number and, in return, print a statement telling the user that their number is odd or even. Input/Output (I/O) tests are a great way of checking that these simple programs work as expected. However, this would traditionally require teachers to download each of their students’ submissions and run them independently on their local environment, putting inputs to the program one at a time and making themselves vulnerable to human error.

Fortunately, CodeGrade’s I/O test step allows you to run a program as you would on your own CLI, enter an input (either standard input, stdin, or as input argument) to the program, and test that the predicted output matches the actual output. With CodeGrade, this doesn’t have to be an exact match, but can be made more flexible by the teacher by modifying case sensitivity, substring matching, whitespace sensitivity or by using a regex.

Unit Test autograding

Once courses begin to venture into more complex programming assignments, particularly those with functions and other encapsulated code, unit testing is a natural tool for autograding. Unit testing frameworks often enable multiple ways of testing that aren’t just limited to matching a predicted outcome with an actual outcome. For JavaScript, CodeGrade has support for Jest and Mocha out of the box. But frameworks like Cypress or Jasmine can be installed too.

CodeGrade’s dedicated Unit Test Step parses the XML output of your unit tests and displays each test individually and whether or not they passed. The Unit test step makes customizing your unit tests really easy, enabling you to write custom descriptions for each test, weighting them differently, and even providing hints when the tests fail!

Code Quality autograding

While coding classrooms mostly cover the syntax of programming languages and the functionality of functions, procedures and modules, one thing that is sometimes overlooked is the readability and quality of code. Instantly autograding Code Quality or Style directly shows students where they can improve their code inside their learning environment. This can help students use better variable and function names, use their whitespace more consistently and prevent other common coding bad practices. 

The Code Quality test step in CodeGrade’s AutoTest makes a host of industry standard linters and static code quality assessment tools available for teachers to automatically grade code quality and formatting! For JavaScript, CodeGrade offers for instance ESLint. While some configurations are available by default, CodeGrade offers you the ability to upload your own custom style guides and rules to give you full control. Custom style guides allow you to select which rules to check and alter the severity level of each infraction. The Code Quality step doesn’t just provide a grade, it also automatically highlights your students code directly on the lines of code where the mistakes were identified, making it simple and intuitive for students to understand what went wrong and how to fix it.

‍Code Structure autograding

A type of autograding that is exclusively offered by CodeGrade’s AutoTest is easy code structure checking. For this, we have implemented our own version of the powerful Semgrep tool. 

With this, you can now not only check if your students’ code works and whether the style is correct, but you can also check if they actually solved your coding challenge in the way that you want. You can automatically check if they use prohibited libraries, if they actually use a for-loop and not a while-loop and if they did not hardcode their answer but rather solved the problem. What’s more, you can also make sure that students define the correct variables, and functions, to make sure they get a helpful warning if they did not.

JavaScript/Web Dev UI and UX autograding

Many JavaScript courses also put a lot of emphasis on User Interface and User Experience design, especially when combined with web development and the many useful JavaScript frameworks that CodeGrade supports. Automatically grading UX and UI is notoriously hard, but fortunately CodeGrade can save the day! With our Jest and Selenium integration, you can even fully automatically grade user interfaces! Read more about CodeGrade’s powerful Jest and Selenium integration here! Next to autograding them, you can also click through them manually all within the CodeGrade interface in your LMS.