🟨
Javascript

Overview
An AutoTest V2 configuration for a Javascript assignment has two stages:
The Setup stage: this is where you setup the auto grading environment. You can install packages and upload files. This builds into an image on which all tests are executed. All the configuration here only runs once for all submissions;
The Tests stage: this is what students will see and where you can configure all your tests that you want to run on every student’s code. Everything that you specify here is executed in the working directory of the student.
Steps are created in a “Scratch-like” block layout and can be dragged and dropped, reordered and nested to create an AutoTest program. We are continuously adding new blocks to AutoTest V2 to make it more powerful and easier.
AutoTest V2 is still available next to our original AutoTest, to start setting up an AutoTest V2 select AutoTest V2 when creating a new AutoTest.

Already have an original AutoTest? You can switch to AutoTest V2 by deleting it and pressing "Select another version of AutoTest" to finally select AutoTest V2. Please note that your original AutoTest will be deleted when pressing the "Delete" button!
Developing, snapshots and publishing to students
When developing your AutoTest V2 configuration, you can continuously test your configuration on the "Test Submission".
After configuring something, you press the “Build Snapshot” button in the bottom right corner of the screen. This will Build your AutoTest into a Snapshot (a history of your snapshots are available via the Snapshots tab).
After pressing "Build Snapshot", you can:
Test the configuration by seeing the results in seconds.
If you are ready to publish your AutoTest to your students press the big green Publish button.
If you make any changes, you build again and if you are satisfied, you can republish them to your students.
If you want to unpublish your snapshot, you can simply go to it in the green bar and press the red “Unpublish” button.
Step 1: Setup
CodeGrade AutoTest V2 runs on Ubuntu (20.04 LTS) machines which you can configure in any way that you want. Common software is pre-installed, but you can manually install software like node and npm.
In the setup section of your AutoTest, you can install software or packages and upload any files you might need for testing. The setup section will build an image and is only run once for all submissions. 
You can upload files using the "Upload Files" block, if you are intending on using Python Unit Testing fusing PyTest for instance, this is where you will upload your unit test file. These files will be placed in the $UPLOADED_FILES directory on the Virtual Server.
You can install software and packages (or configure the build image in any other way) using the "Script" block. You may use a command like python3 -m pip install semgrep if you are planning to use code structure tests using semgrep in your tests.
Installing Node
1.In the setup step, you can use the built-in "Install Node" block to directly install your preferred Node.js version to AutoTest V2.
Drag the "Install Node" block to the setup step and select the preferred version in the dropdown.
Installing NPM packages
1.The "Install Node" block automatically installs the corresponding version of npm (the node package manager), which you can use the install required packages.
2.In a separate "Script" block, use the npm install command to install any package you need. This may be something like: npm install mocha.
Basic setup for an autograded JavaScript assignment using Node.js 18.
Step 2: Tests
Now that you have created the setup, it's time to create the actual tests. This is done on the Tests tab. Select one of the many test-blocks to configure a AutoTest V2 procedure in a "scratch"-like format. Some tests can be nested and you can chose to connect tests to rubric categories with a certain weight, you can also hide aspects of tests and enable internet access for specific tests.
Set up an IO Test
IO Tests are great for console based programs and allow you to give an input to it and specify an expected output. The following will guide you to set up an IO Test:
Basic IO Test to autograde a JavaScript assignment with user input (connected to a rubric).
1.Drag the "IO Test" block to your Test Procedure. In the code section, write the command to execute, for JavaScript this could be something like node fibonacci.js.
2.Drag one or more "Full Match" or "Substring Match" block(s) inside your "IO Test" block. Specify an Input (given via stdin / standard input) and an Expected Output.
3.Give clear names to the numerous blocks you have created to make clear to the students what is being tested.
4.Optionally: drag in a "Connect Rubric" block and drag your "IO Test" block in this, to connect it to a rubric category and use it to grade your students. 
Set up a Code Structure test
CodeGrade integrates a tool called Semgrep to make it easy to perform more complex code analysis by allowing you to write rules in a human readable format. You can provide generic or language specific patterns, which are then found in the code. With its pattern syntax, you can find:
Equivalences: Matching code that means the same thing even though it looks different.
Wildcards / ellipsis (...): Matching any statement, expression or variable.
Metavariables ($X): Matching unknown expressions that you do not yet know what they will exactly look like, but want to be the same variable in multiple parts of your pattern.
Writing the tests
Semgrep can be installed in the Setup step using pip, use: pip3 install semgrep. The easiest way to use Semgrep in AutoTest V2 is via our structure.py script (this will be built-in in a later version). With this script, you will write your Semgrep patterns directly in the Input field in an IO Test. Try out Semgrep patterns using their online editor here:
Semgrep
For instance, this is a pattern to detect a for-loop in the student code:
pattern: for ( ... ) { ... }
Creating the test in CodeGrade
structure.py
2KB
Text
Download the structure.py script to run Semgrep in AutoTest V2.
1.Under the Setup tab, upload the structure.py file you can download above. Also, in a "Script" block, install Semgrep via python3 -m pip install semgrep.
2.Continue in the Tests tab: first drag the "IO Test" block to your Test Procedure. Execute the script in the code field, follow: python3 $UPLOADED_FILES/structure.py <STUDENTFILE>. For a fibonacci assignment, this could be: python3 $UPLOADED_FILES/structure.py fibonacci.js.
3.Create and drag one or more "Full Match" block(s) inside your "IO Test" block. Each block is one Semgrep structure to check. As Input write the Semgrep pattern (including pattern: or similar like pattern-either:). See the pattern above for an example.
4.As Expected Output write "Found!" if the student code should match or "Not found!" if the student code should not contain the pattern (e.g. students are not allowed to use a for loop).
5.Optionally: Use a "Connect Rubric" block to connect your structure check to a rubric category.
6.Optionally: Use a "Hide" block to hide the "config" (i.e. input / pattern) of your tests so that students cannot see the pattern you are checking for.
A Semgrep structure check in an IO Test in AutoTest V2 (with optional Hide block to hide the pattern).
Set up a Code Quality test
You can  run static code analysis on the student's submission using Eslint while also creating graded Code Quality tests . Until the "Code Quality" block is available in AutoTest V2, we have created a simple workaround using the cg command for comments.
To install Eslint first make sure you have installed Node as described at the top of this page. Then you just need to type the following bash commands within a script block in the Setup tab:
1
sudo apt update
2
#install eslint globally
3
npm install -g  eslint
To run Eslint in AutoTest we need to provide a configuration file named .eslintrc . 
If you want to use the Eslint default configuration then your .eslintrc can be as simple as:
1
{
2
	"extends": "standard"
3
}
You can also add your own rules to the Eslint configuration, see here for more information about configuring Eslint. Notice that in this way you can also assign custom severity levels to each rule. Below you can download an example of the .eslintrc file that implements a set of custom rules.
.eslintrc.js.zip
1KB
Binary
Example of Eslint configuration file to implement custom rules.
In any case make sure to upload the configuration file in the Setup tab using an Upload File Block.
 
AutoTest configuration to install and configure Eslint
Once we are finished with the Setup we can finally run Eslint on the student submission in the Tests tab. This is done by typing the following bash commands within a Script Block:
1
cp $UPLOADED_FILES/.eslintrc.js .
2
npx eslint --format compact *.js | cg comments generic \
3
    '(?P<file>/[^:]*): line (?P<line>[\d]+), col (?P<column>[\d]+), (?P<severity>[\S]+) - (?P<message>[^\(]*)\((?P<code>[^\)]*)\)$' \
4
     --origin eslint \
5
     --severities 'Error:error,Warning:warning' \
6
     --ignore-regex '^\s*$|^[^/].*$' \
7
     --print \
8
     --score
In the example above we scan all the files ending in .js that are present in the student directory. Alternatively you can also indicate specific files. Notice how in line 1, before running Eslint, we move its configuration file into the student directory.
Optionally you can create a graded test by typing the same commands inside a Custom Test Block that is nested within a Connect Rubric Block.


Graded Custom Test implementing a Code Quality check with Eslint.
Step 3: Start the AutoTest
Once you have created a configuration, create a Snapshot to test it on a "Test Submission". In the General Settings, you should have already uploaded a Test Submission, so you will see the results of this straight away.
Once everything works as expected, press the green "Publish to students" button to publish your AutoTest V2 to students. If they use the editor they can run it instantly, and if they hand in in any other way they will get their AutoTest results instantly after any submission.
Web Development in AutoTest V1
Next - Automatic Grading Guides
Last modified 4d ago