From a38ec498410d2292203793f4481cdc910a95d274 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 14:03:02 +0100
Subject: [PATCH 01/14] Implemented scrolling down behaviour

---
 .../complaints-student-view.component.html         |  3 ++-
 .../complaints-student-view.component.ts           | 14 +++++++++++++-
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index ae902f4ec8de..7aa44f148eff 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -23,7 +23,7 @@
                         id="complain"
                         class="btn btn-primary"
                         [class.not-allowed]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
-                        (click)="formComplaintType = ComplaintType.COMPLAINT"
+                        (click)="startComplaint()"
                         [disabled]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
                         title="{{
                             (!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid
@@ -66,3 +66,4 @@
         }
     </div>
 }
+<div #bottom></div>
diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index b469dcab432f..bad9052d4bbc 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
 import { Exercise, getCourseFromExercise } from 'app/entities/exercise.model';
 import { Complaint, ComplaintType } from 'app/entities/complaint.model';
 import { ComplaintService } from 'app/complaints/complaint.service';
@@ -28,6 +28,8 @@ export class ComplaintsStudentViewComponent implements OnInit {
     // flag to indicate exam test run. Default set to false.
     @Input() testRun = false;
 
+    @ViewChild('bottom') bottom: ElementRef;
+
     submission: Submission;
     complaint: Complaint;
     course?: Course;
@@ -149,4 +151,14 @@ export class ComplaintsStudentViewComponent implements OnInit {
         }
         return false;
     }
+
+    startComplaint(): void {
+        this.formComplaintType = ComplaintType.COMPLAINT;
+        // Wait for the view to update
+        setTimeout(() => this.scrollToBottom(), 0);
+    }
+
+    private scrollToBottom(): void {
+        this.bottom.nativeElement.scrollIntoView({ behavior: 'smooth' });
+    }
 }

From ce4d3bdadc04bf289252a6356e807bce10732e26 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 14:14:17 +0100
Subject: [PATCH 02/14] Added comments

---
 .../complaints-student-view.component.ts                    | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index bad9052d4bbc..51f1198e4e40 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -152,12 +152,18 @@ export class ComplaintsStudentViewComponent implements OnInit {
         return false;
     }
 
+    /**
+     * Opens the complaint form for the student to submit a complaint and scrolls to the bottom of the page to make the form visible
+     */
     startComplaint(): void {
         this.formComplaintType = ComplaintType.COMPLAINT;
         // Wait for the view to update
         setTimeout(() => this.scrollToBottom(), 0);
     }
 
+    /**
+     * Scrolls to the bottom of the page
+     */
     private scrollToBottom(): void {
         this.bottom.nativeElement.scrollIntoView({ behavior: 'smooth' });
     }

From 3e997dbfbed78af36dc7c3cb468062b0604ebc0c Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 14:43:52 +0100
Subject: [PATCH 03/14] Add same behaviour for "Request more feedback" button

---
 .../complaints-student-view.component.html       |  7 ++++---
 .../complaints-student-view.component.ts         | 16 ++++++++--------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index 7aa44f148eff..eae77c7b9d7c 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -16,6 +16,7 @@
                 }
             </p>
         }
+
         @if (isCorrectUserToFileAction && !complaint) {
             <div class="mt-4">
                 @if (isExamMode || (course?.maxComplaints && course!.maxComplaints! > 0)) {
@@ -23,7 +24,7 @@
                         id="complain"
                         class="btn btn-primary"
                         [class.not-allowed]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
-                        (click)="startComplaint()"
+                        (click)="startComplaint(ComplaintType.COMPLAINT)"
                         [disabled]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
                         title="{{
                             (!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid
@@ -37,7 +38,7 @@
                     <button
                         class="btn btn-primary ms-1"
                         [class.not-allowed]="!timeOfFeedbackRequestValid"
-                        (click)="formComplaintType = ComplaintType.MORE_FEEDBACK"
+                        (click)="startComplaint(ComplaintType.MORE_FEEDBACK)"
                         [disabled]="!timeOfFeedbackRequestValid"
                         title="{{ !timeOfFeedbackRequestValid ? ('artemisApp.moreFeedback.notAllowedTooltip' | artemisTranslate) : '' }}"
                         jhiTranslate="artemisApp.moreFeedback.button"
@@ -45,6 +46,7 @@
                 }
             </div>
         }
+        <div #complaintScrollpoint></div>
         @if (!complaint && formComplaintType) {
             <div class="row">
                 <jhi-complaint-form
@@ -66,4 +68,3 @@
         }
     </div>
 }
-<div #bottom></div>
diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index 51f1198e4e40..72874220bba0 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -28,7 +28,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
     // flag to indicate exam test run. Default set to false.
     @Input() testRun = false;
 
-    @ViewChild('bottom') bottom: ElementRef;
+    @ViewChild('complaintScrollpoint') complaintScrollpoint: ElementRef;
 
     submission: Submission;
     complaint: Complaint;
@@ -153,18 +153,18 @@ export class ComplaintsStudentViewComponent implements OnInit {
     }
 
     /**
-     * Opens the complaint form for the student to submit a complaint and scrolls to the bottom of the page to make the form visible
+     * Opens the complaint form (for a given complaint type) for the student to submit a complaint and scrolls to the bottom of the page to make the form visible
      */
-    startComplaint(): void {
-        this.formComplaintType = ComplaintType.COMPLAINT;
+    startComplaint(complainType: ComplaintType): void {
+        this.formComplaintType = complainType;
         // Wait for the view to update
-        setTimeout(() => this.scrollToBottom(), 0);
+        setTimeout(() => this.scrollToComplaint(), 0);
     }
 
     /**
-     * Scrolls to the bottom of the page
+     * Scrolls to the complaint form
      */
-    private scrollToBottom(): void {
-        this.bottom.nativeElement.scrollIntoView({ behavior: 'smooth' });
+    private scrollToComplaint(): void {
+        this.complaintScrollpoint.nativeElement.scrollIntoView({ behavior: 'smooth' });
     }
 }

From 038c83e417c3eda82d0b186a644b74fc8ddf8118 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 16:12:52 +0100
Subject: [PATCH 04/14] Add test for a new functionality

---
 .../complaint-student-view.component.spec.ts  | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 528e9d6d5c6a..3d69e16e48e5 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -25,6 +25,8 @@ import { AssessmentType } from 'app/entities/assessment-type.model';
 import { TranslateDirective } from 'app/shared/language/translate.directive';
 import { CourseManagementService } from 'app/course/manage/course-management.service';
 import { MockCourseManagementService } from '../../helpers/mocks/service/mock-course-management.service';
+import { ElementRef } from '@angular/core';
+import { ComplaintType } from 'app/entities/complaint.model';
 
 describe('ComplaintsStudentViewComponent', () => {
     const complaintTimeLimitDays = 7;
@@ -355,6 +357,40 @@ describe('ComplaintsStudentViewComponent', () => {
         }
     });
 
+    describe('startComplaint', () => {
+        it('should set formComplaintType to COMPLAINT and scroll to complaint section', fakeAsync(() => {
+            // Mock complaintScrollpoint
+            const scrollIntoViewMock = jest.fn();
+            component.complaintScrollpoint = {
+                nativeElement: {
+                    scrollIntoView: scrollIntoViewMock,
+                },
+            } as ElementRef;
+
+            component.startComplaint(ComplaintType.COMPLAINT);
+            expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
+            // Wait for setTimeout to execute
+            tick();
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+        }));
+
+        it('should set formComplaintType to MORE_FEEDBACK and scroll to complaint section', fakeAsync(() => {
+            // Mock complaintScrollpoint
+            const scrollIntoViewMock = jest.fn();
+            component.complaintScrollpoint = {
+                nativeElement: {
+                    scrollIntoView: scrollIntoViewMock,
+                },
+            } as ElementRef;
+
+            component.startComplaint(ComplaintType.MORE_FEEDBACK);
+            expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
+            // Wait for setTimeout to execute
+            tick();
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+        }));
+    });
+
     function expectDefault() {
         expect(component.submission).toStrictEqual(submission);
         expect(component.course).toStrictEqual(course);

From 7b7f1f83bf503126b280819c7e0775887681755a Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 16:17:29 +0100
Subject: [PATCH 05/14] Refactor

---
 .../complaint-student-view.component.spec.ts  | 82 +++++++++++--------
 1 file changed, 48 insertions(+), 34 deletions(-)

diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 3d69e16e48e5..64ae6b38171f 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -148,6 +148,22 @@ describe('ComplaintsStudentViewComponent', () => {
             expect(userMock).toHaveBeenCalledOnce();
         }));
 
+        it('should open complaint form and focus on complaint form when pressing complaint', fakeAsync(() => {
+            // Mock complaintScrollpoint
+            const scrollIntoViewMock = jest.fn();
+            component.complaintScrollpoint = {
+                nativeElement: {
+                    scrollIntoView: scrollIntoViewMock,
+                },
+            } as ElementRef;
+
+            component.startComplaint(ComplaintType.COMPLAINT);
+            expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
+            // Wait for setTimeout to execute
+            tick();
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+        }));
+
         it('should be visible on test run', fakeAsync(() => {
             const now = dayjs();
             const examWithFutureReview: Exam = { examStudentReviewStart: dayjs(now).add(1, 'day'), examStudentReviewEnd: dayjs(now).add(2, 'day') } as Exam;
@@ -206,6 +222,38 @@ describe('ComplaintsStudentViewComponent', () => {
             expect(component.complaint).toStrictEqual(complaint);
         }));
 
+        it('should open complaint form and focus on complaint form when pressing complaint', fakeAsync(() => {
+            // Mock complaintScrollpoint
+            const scrollIntoViewMock = jest.fn();
+            component.complaintScrollpoint = {
+                nativeElement: {
+                    scrollIntoView: scrollIntoViewMock,
+                },
+            } as ElementRef;
+
+            component.startComplaint(ComplaintType.COMPLAINT);
+            expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
+            // Wait for setTimeout to execute
+            tick();
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+        }));
+
+        it('should open complaint form and focus on complaint form when pressing more feedback', fakeAsync(() => {
+            // Mock complaintScrollpoint
+            const scrollIntoViewMock = jest.fn();
+            component.complaintScrollpoint = {
+                nativeElement: {
+                    scrollIntoView: scrollIntoViewMock,
+                },
+            } as ElementRef;
+
+            component.startComplaint(ComplaintType.MORE_FEEDBACK);
+            expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
+            // Wait for setTimeout to execute
+            tick();
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+        }));
+
         it('should not be available if before or at assessment due date', fakeAsync(() => {
             const exercise: Exercise = { id: 1, teamMode: false, course, assessmentDueDate: dayjs() } as Exercise;
             const resultMatchingDate: Result = { id: 1, completionDate: dayjs(exercise.assessmentDueDate) } as Result;
@@ -357,40 +405,6 @@ describe('ComplaintsStudentViewComponent', () => {
         }
     });
 
-    describe('startComplaint', () => {
-        it('should set formComplaintType to COMPLAINT and scroll to complaint section', fakeAsync(() => {
-            // Mock complaintScrollpoint
-            const scrollIntoViewMock = jest.fn();
-            component.complaintScrollpoint = {
-                nativeElement: {
-                    scrollIntoView: scrollIntoViewMock,
-                },
-            } as ElementRef;
-
-            component.startComplaint(ComplaintType.COMPLAINT);
-            expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
-            // Wait for setTimeout to execute
-            tick();
-            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
-        }));
-
-        it('should set formComplaintType to MORE_FEEDBACK and scroll to complaint section', fakeAsync(() => {
-            // Mock complaintScrollpoint
-            const scrollIntoViewMock = jest.fn();
-            component.complaintScrollpoint = {
-                nativeElement: {
-                    scrollIntoView: scrollIntoViewMock,
-                },
-            } as ElementRef;
-
-            component.startComplaint(ComplaintType.MORE_FEEDBACK);
-            expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
-            // Wait for setTimeout to execute
-            tick();
-            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
-        }));
-    });
-
     function expectDefault() {
         expect(component.submission).toStrictEqual(submission);
         expect(component.course).toStrictEqual(course);

From ac5a11ad88ff765d8c8981d52488fd2d4611c324 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 19:35:17 +0100
Subject: [PATCH 06/14] Update tests to use complain buttons

---
 .../complaints-student-view.component.html    |  1 +
 .../complaint-student-view.component.spec.ts  | 73 ++++++++++++++++---
 2 files changed, 65 insertions(+), 9 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index eae77c7b9d7c..f83ad7f3ca8b 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -36,6 +36,7 @@
                 }
                 @if (!isExamMode && course?.requestMoreFeedbackEnabled) {
                     <button
+                        id="more-feedback"
                         class="btn btn-primary ms-1"
                         [class.not-allowed]="!timeOfFeedbackRequestValid"
                         (click)="startComplaint(ComplaintType.MORE_FEEDBACK)"
diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 64ae6b38171f..cc08d47f8a1e 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -148,8 +148,21 @@ describe('ComplaintsStudentViewComponent', () => {
             expect(userMock).toHaveBeenCalledOnce();
         }));
 
-        it('should open complaint form and focus on complaint form when pressing complaint', fakeAsync(() => {
-            // Mock complaintScrollpoint
+        it('should set complaint type COMPLAINT and scroll to complaint form when pressing complaint', fakeAsync(() => {
+            component.exercise = examExercise;
+            component.result = result;
+            component.exam = defaultExam;
+            component.showSection = true;
+            component.isCorrectUserToFileAction = true;
+            const complaintBySubmissionMock = jest.spyOn(complaintService, 'findBySubmissionId').mockReturnValue(of());
+
+            fixture.detectChanges();
+
+            //Check if button is available
+            expect(component.complaint).toBeUndefined();
+            expect(complaintBySubmissionMock).toHaveBeenCalledOnce();
+
+            // Mock complaint scrollpoint
             const scrollIntoViewMock = jest.fn();
             component.complaintScrollpoint = {
                 nativeElement: {
@@ -157,7 +170,11 @@ describe('ComplaintsStudentViewComponent', () => {
                 },
             } as ElementRef;
 
-            component.startComplaint(ComplaintType.COMPLAINT);
+            const button = fixture.debugElement.nativeElement.querySelector('#complain');
+            button.click();
+
+            fixture.detectChanges();
+
             expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
             // Wait for setTimeout to execute
             tick();
@@ -222,8 +239,29 @@ describe('ComplaintsStudentViewComponent', () => {
             expect(component.complaint).toStrictEqual(complaint);
         }));
 
-        it('should open complaint form and focus on complaint form when pressing complaint', fakeAsync(() => {
-            // Mock complaintScrollpoint
+        it('should set complaint type COMPLAINT and scroll to complaint form when pressing complaint', fakeAsync(() => {
+            testInitWithResultStub(of());
+            const courseWithMaxComplaints = {
+                ...Course,
+                maxComplaints: 3,
+            } as Course;
+            const exerciseWithMaxComplaints = {
+                ...courseExercise,
+                course: courseWithMaxComplaints,
+            } as Exercise;
+            component.course = courseWithMaxComplaints;
+            component.exercise = exerciseWithMaxComplaints;
+
+            component.showSection = true;
+            component.isCorrectUserToFileAction = true;
+            component.remainingNumberOfComplaints = 1;
+
+            fixture.detectChanges();
+
+            //Check if button is available
+            expect(component.complaint).toBeUndefined();
+
+            // Mock complaint scrollpoint
             const scrollIntoViewMock = jest.fn();
             component.complaintScrollpoint = {
                 nativeElement: {
@@ -231,15 +269,28 @@ describe('ComplaintsStudentViewComponent', () => {
                 },
             } as ElementRef;
 
-            component.startComplaint(ComplaintType.COMPLAINT);
+            const button = fixture.debugElement.nativeElement.querySelector('#complain');
+            button.click();
+
+            fixture.detectChanges();
+
             expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
             // Wait for setTimeout to execute
             tick();
             expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
         }));
 
-        it('should open complaint form and focus on complaint form when pressing more feedback', fakeAsync(() => {
-            // Mock complaintScrollpoint
+        it('should set complaint type MORE_FEEDBACK and scroll to complaint form when pressing complaint', fakeAsync(() => {
+            testInitWithResultStub(of());
+            component.showSection = true;
+            component.isCorrectUserToFileAction = true;
+
+            fixture.detectChanges();
+
+            //Check if button is available
+            expect(component.complaint).toBeUndefined();
+
+            // Mock complaint scrollpoint
             const scrollIntoViewMock = jest.fn();
             component.complaintScrollpoint = {
                 nativeElement: {
@@ -247,7 +298,11 @@ describe('ComplaintsStudentViewComponent', () => {
                 },
             } as ElementRef;
 
-            component.startComplaint(ComplaintType.MORE_FEEDBACK);
+            const button = fixture.debugElement.nativeElement.querySelector('#more-feedback');
+            button.click();
+
+            fixture.detectChanges();
+
             expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
             // Wait for setTimeout to execute
             tick();

From 1ec9289fc9b23c3c604d77d5df5408d1c60e1486 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 19:36:00 +0100
Subject: [PATCH 07/14] Update comments to better reflect function behaviour

---
 .../complaints-student-view.component.ts                      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index 72874220bba0..f06a09ab7b48 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -153,7 +153,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
     }
 
     /**
-     * Opens the complaint form (for a given complaint type) for the student to submit a complaint and scrolls to the bottom of the page to make the form visible
+     * Function to set complaint type (which opens the complaint form) and scrolls to the complaint form
      */
     startComplaint(complainType: ComplaintType): void {
         this.formComplaintType = complainType;
@@ -162,7 +162,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
     }
 
     /**
-     * Scrolls to the complaint form
+     * Function to scroll to the complaint form
      */
     private scrollToComplaint(): void {
         this.complaintScrollpoint.nativeElement.scrollIntoView({ behavior: 'smooth' });

From 20d36f8322b9fe518d02011810c389d9c7e6afaf Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 21:41:47 +0100
Subject: [PATCH 08/14] Replace setTimeout() with cdr.detectChanges()

---
 .../complaints-student-view.component.ts                  | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index f06a09ab7b48..9023fecb91be 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
+import { ChangeDetectorRef, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
 import { Exercise, getCourseFromExercise } from 'app/entities/exercise.model';
 import { Complaint, ComplaintType } from 'app/entities/complaint.model';
 import { ComplaintService } from 'app/complaints/complaint.service';
@@ -53,6 +53,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
         private serverDateService: ArtemisServerDateService,
         private accountService: AccountService,
         private courseService: CourseManagementService,
+        private cdr: ChangeDetectorRef,
     ) {}
 
     /**
@@ -158,13 +159,14 @@ export class ComplaintsStudentViewComponent implements OnInit {
     startComplaint(complainType: ComplaintType): void {
         this.formComplaintType = complainType;
         // Wait for the view to update
-        setTimeout(() => this.scrollToComplaint(), 0);
+        this.cdr.detectChanges();
+        this.scrollToComplaint();
     }
 
     /**
      * Function to scroll to the complaint form
      */
     private scrollToComplaint(): void {
-        this.complaintScrollpoint.nativeElement.scrollIntoView({ behavior: 'smooth' });
+        this.complaintScrollpoint?.nativeElement.scrollIntoView({ behavior: 'smooth' });
     }
 }

From 9d6fa34adea503d094cf4d8fbe72d1e86437c665 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 21:43:28 +0100
Subject: [PATCH 09/14] Rename function startComplaint() to openComplaintForm()

---
 .../complaints-student-view.component.html                    | 4 ++--
 .../complaints-student-view.component.ts                      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index f83ad7f3ca8b..5596ac3a5ffa 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -24,7 +24,7 @@
                         id="complain"
                         class="btn btn-primary"
                         [class.not-allowed]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
-                        (click)="startComplaint(ComplaintType.COMPLAINT)"
+                        (click)="openComplaintForm(ComplaintType.COMPLAINT)"
                         [disabled]="(!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid"
                         title="{{
                             (!isExamMode && remainingNumberOfComplaints === 0) || !timeOfComplaintValid
@@ -39,7 +39,7 @@
                         id="more-feedback"
                         class="btn btn-primary ms-1"
                         [class.not-allowed]="!timeOfFeedbackRequestValid"
-                        (click)="startComplaint(ComplaintType.MORE_FEEDBACK)"
+                        (click)="openComplaintForm(ComplaintType.MORE_FEEDBACK)"
                         [disabled]="!timeOfFeedbackRequestValid"
                         title="{{ !timeOfFeedbackRequestValid ? ('artemisApp.moreFeedback.notAllowedTooltip' | artemisTranslate) : '' }}"
                         jhiTranslate="artemisApp.moreFeedback.button"
diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index 9023fecb91be..4a5cd1faf0e0 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -156,7 +156,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
     /**
      * Function to set complaint type (which opens the complaint form) and scrolls to the complaint form
      */
-    startComplaint(complainType: ComplaintType): void {
+    openComplaintForm(complainType: ComplaintType): void {
         this.formComplaintType = complainType;
         // Wait for the view to update
         this.cdr.detectChanges();

From fc3d4c84df2a253f725067eeec08b7956578dd73 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 21:44:32 +0100
Subject: [PATCH 10/14] Update test comments to better reflect the new
 behaviour

---
 .../complaints/complaint-student-view.component.spec.ts  | 9 ++-------
 1 file changed, 2 insertions(+), 7 deletions(-)

diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index cc08d47f8a1e..513f1a5ca8b9 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -258,9 +258,6 @@ describe('ComplaintsStudentViewComponent', () => {
 
             fixture.detectChanges();
 
-            //Check if button is available
-            expect(component.complaint).toBeUndefined();
-
             // Mock complaint scrollpoint
             const scrollIntoViewMock = jest.fn();
             component.complaintScrollpoint = {
@@ -275,8 +272,7 @@ describe('ComplaintsStudentViewComponent', () => {
             fixture.detectChanges();
 
             expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
-            // Wait for setTimeout to execute
-            tick();
+            tick(); // Wait for update to happen
             expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
         }));
 
@@ -304,8 +300,7 @@ describe('ComplaintsStudentViewComponent', () => {
             fixture.detectChanges();
 
             expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
-            // Wait for setTimeout to execute
-            tick();
+            tick(); // Wait for update to happen
             expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
         }));
 

From 09d639b6c13e10a89f2aea59c81ac83a68499b71 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 22:01:09 +0100
Subject: [PATCH 11/14] Improve scrolling behaviour

---
 .../complaints-student-view.component.html                      | 2 +-
 .../complaints-student-view.component.ts                        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index 5596ac3a5ffa..50ad8f4097a4 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -47,7 +47,6 @@
                 }
             </div>
         }
-        <div #complaintScrollpoint></div>
         @if (!complaint && formComplaintType) {
             <div class="row">
                 <jhi-complaint-form
@@ -60,6 +59,7 @@
                     (onSubmit)="loadPotentialComplaint()"
                 />
             </div>
+            <div #complaintScrollpoint></div>
         }
         @if (complaint) {
             <div class="row">
diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index 4a5cd1faf0e0..b0292ee1e69a 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -167,6 +167,6 @@ export class ComplaintsStudentViewComponent implements OnInit {
      * Function to scroll to the complaint form
      */
     private scrollToComplaint(): void {
-        this.complaintScrollpoint?.nativeElement.scrollIntoView({ behavior: 'smooth' });
+        this.complaintScrollpoint?.nativeElement.scrollIntoView({ behavior: 'smooth', block: 'end' });
     }
 }

From 2820dcec30a0d3c2b47eb73fae4303801a1fa42a Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 22:42:17 +0100
Subject: [PATCH 12/14] Fix coderabbit issue

---
 .../complaints/complaint-student-view.component.spec.ts   | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 513f1a5ca8b9..6b9155c37887 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -241,14 +241,14 @@ describe('ComplaintsStudentViewComponent', () => {
 
         it('should set complaint type COMPLAINT and scroll to complaint form when pressing complaint', fakeAsync(() => {
             testInitWithResultStub(of());
-            const courseWithMaxComplaints = {
+            const courseWithMaxComplaints: Course = {
                 ...Course,
                 maxComplaints: 3,
-            } as Course;
-            const exerciseWithMaxComplaints = {
+            };
+            const exerciseWithMaxComplaints: Exercise = {
                 ...courseExercise,
                 course: courseWithMaxComplaints,
-            } as Exercise;
+            };
             component.course = courseWithMaxComplaints;
             component.exercise = exerciseWithMaxComplaints;
 

From 3ca663e28a779d399a3fdb992dc5296c8bba8475 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 22:43:19 +0100
Subject: [PATCH 13/14] Fix typo "Course" to "course"

---
 .../complaints/complaint-student-view.component.spec.ts         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 6b9155c37887..310fb0cc3c0b 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -242,7 +242,7 @@ describe('ComplaintsStudentViewComponent', () => {
         it('should set complaint type COMPLAINT and scroll to complaint form when pressing complaint', fakeAsync(() => {
             testInitWithResultStub(of());
             const courseWithMaxComplaints: Course = {
-                ...Course,
+                ...course,
                 maxComplaints: 3,
             };
             const exerciseWithMaxComplaints: Exercise = {

From ec2ee11f6c28d4ba7eddc5e50b9dd921b19eaac7 Mon Sep 17 00:00:00 2001
From: Julian Gassner <julian.gassner@tum.de>
Date: Tue, 12 Nov 2024 23:13:17 +0100
Subject: [PATCH 14/14] Adapt test to test for new scroll behaviour

---
 .../complaints-student-view.component.html                  | 2 +-
 .../complaints-student-view.component.ts                    | 3 +--
 .../complaints/complaint-student-view.component.spec.ts     | 6 +++---
 3 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
index 50ad8f4097a4..783d822a2e84 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.html
@@ -59,8 +59,8 @@
                     (onSubmit)="loadPotentialComplaint()"
                 />
             </div>
-            <div #complaintScrollpoint></div>
         }
+        <div #complaintScrollpoint></div>
         @if (complaint) {
             <div class="row">
                 <jhi-complaint-request class="col-12 col-md-6" [complaint]="complaint" [maxComplaintTextLimit]="course?.maxComplaintTextLimit!" />
diff --git a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
index b0292ee1e69a..26d9308a110e 100644
--- a/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
+++ b/src/main/webapp/app/complaints/complaints-for-students/complaints-student-view.component.ts
@@ -158,8 +158,7 @@ export class ComplaintsStudentViewComponent implements OnInit {
      */
     openComplaintForm(complainType: ComplaintType): void {
         this.formComplaintType = complainType;
-        // Wait for the view to update
-        this.cdr.detectChanges();
+        this.cdr.detectChanges(); // Wait for the view to update
         this.scrollToComplaint();
     }
 
diff --git a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
index 310fb0cc3c0b..91172f9c6516 100644
--- a/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
+++ b/src/test/javascript/spec/component/complaints/complaint-student-view.component.spec.ts
@@ -178,7 +178,7 @@ describe('ComplaintsStudentViewComponent', () => {
             expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
             // Wait for setTimeout to execute
             tick();
-            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth', block: 'end' });
         }));
 
         it('should be visible on test run', fakeAsync(() => {
@@ -273,7 +273,7 @@ describe('ComplaintsStudentViewComponent', () => {
 
             expect(component.formComplaintType).toBe(ComplaintType.COMPLAINT);
             tick(); // Wait for update to happen
-            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth', block: 'end' });
         }));
 
         it('should set complaint type MORE_FEEDBACK and scroll to complaint form when pressing complaint', fakeAsync(() => {
@@ -301,7 +301,7 @@ describe('ComplaintsStudentViewComponent', () => {
 
             expect(component.formComplaintType).toBe(ComplaintType.MORE_FEEDBACK);
             tick(); // Wait for update to happen
-            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth' });
+            expect(scrollIntoViewMock).toHaveBeenCalledWith({ behavior: 'smooth', block: 'end' });
         }));
 
         it('should not be available if before or at assessment due date', fakeAsync(() => {