Programming exercises: Display checkout directories in build plan preview

[florian-glombik]

Checklist

General

• I tested all changes and their related features with all corresponding user types on a test server.
• Language: I followed the guidelines for inclusive, diversity-sensitive, and appreciative language.
• I chose a title conforming to the naming conventions for pull requests.

Server

• I strictly followed the server coding and design guidelines.
• I added multiple integration tests (Spring) related to the features (with a high test coverage).
• I added pre-authorization annotations according to the guidelines and checked the course groups for all new REST Calls (security).
• I documented the Java code using JavaDoc style.

Client

• Important: I implemented the changes with a very good performance, prevented too many (unnecessary) REST calls and made sure the UI is responsive, even with large data.
• I strictly followed the client coding and design guidelines.
• I added multiple integration tests (Jest) related to the features (with a high test coverage), while following the test guidelines.
• I documented the TypeScript code using JSDoc style.
• I added multiple screenshots/screencasts of my UI changes.
• I translated all newly inserted strings into English and German.

Motivation and Context

With the introduction of localCI it is now opaque where the repositories are actually checked out. This information was previously available when viewing the respective build plan in Bamboo (or Jenkins).

The information can currently only be found by reading the documentation and referring to the actually used code.

Description

Client

• Added checkout directory information to the programming exercise detail page
• Added checkout directory information to the programming exercise create/edit page (in the preview section)
• Removed method call from html in programming-exercise-plans-and-repositories-preview.component.ts
• Added undefined checks in programming-exercise-update.component.ts since console errors were displayed in the console when adding auxiliary repositories
• Introduced shared constant instead of duplicated RegEx
• Moved build-log-statistics-dto.ts to the entities folder, as we seem to store all dtos there in the client side
• Introduced new shared Module and Components for the repository + checkout directory table
• Removed method calls from the re-used repository + checkout directory table code

Server

• Added missing checkout directory information for the solution repository of some programming languages (changes in ContinousIntegrationService)
• Added endpoint to get the checkout directories for a programming exercise in a certain programming language

Steps for Testing

The change will only be visible on a localCI test server!

Prerequisites:

• 1 Instructor

1. Create a new programming exercise
2. Define the exercise title and short name
3. See that the checkout directories will be displayed in the preview
4. Change the programming language and see that the checkout directories will be updated accordingly (e.g. Java -> OCaml)
5. Add an auxiliary repository (e.g. name: sut, checkoutDirectory: assignment/sut)
6. See that the checkout directory will be displayed aswell (it is intended to add a / for the root directory for consistency if e.g. the test repository is checked out in the root repository)
7. Remove the checkmark for Check out repository of sample solution (only available for OCaml and Haskell)
8. See that the solution repository is not checked out during template build
9. Save the exercise
10. See that the checkout directories are displayed in the details view of the exercise

If you additionally want to verify that the displayed information is checked you can set a breakpoint in BuildJobContainerService.populateBuildJobContainer and then look at the docker if container is build as expected from the information displayed in the new UI.
You will find the testing directory under /var/tmp/testing-dir/ in the docker container.
(Note: some build scripts only have images for amd, which will early abort as the image will be pulled first - either define an existing image for the exercise or change you application-local.yml accordingly, e.g. continuous-integration.image-architecture: amd64)

Testserver States

Note

These badges show the state of the test servers.
Green = Currently available, Red = Currently locked

Review Progress

Performance Review

• I (as a reviewer) confirm that the client changes (in particular related to REST calls and UI responsiveness) are implemented with a very good performance

Code Review

• Code Review 1
• Code Review 2

Manual Tests

• Test 1
• Test 2

Test Coverage

Client

Class/File	Line Coverage	Confirmation (assert/expect)
programming-exercise-detail.component.ts	85.6%	✅
repositories-checkout-directories-dto.ts	0%	❌ (simple DTO without further logic)
programming-exercise.service.ts	88.02%	✅
programming-exercise-plans-and-repositories-preview.component.ts	96.15%	✅
utils.ts	95.52%	✅

Server

Class/File	Line Coverage	Confirmation (assert/expect)
ContinuousIntegrationService.java	100%	✅
LocalCIService.java	98%	✅
RepositoriesCheckoutDirectoryDTO.java	100%	❌ (simple DTO without further logic)
ProgrammingExerciseResource.java	81%	✅

Screenshots

Change Comparison

Change	Before	Now
Added checkout directories to preview
Added checkout directories to details view
Adjusted tooltip for LocalCI setup
Further Tooltips

Screencast

The screencast may take some time to load 🐌