Merge pull request #28 from ETS-TAF/updateVersionTestApi

Update version test api

CONTRIBUTING.md

@@ -0,0 +1,22 @@
+# Guide de contribution pour TAF
+
+## Processus de contribution
+
+La contribution au projet pour les équipes se fait de manière suivante :
+ - Réalisez une fork du projet à partir de la branche `main`
+ - Travaillez en équipe sur cette fork
+   - Voir [la partie "GIT Flow" dans le fichier CONVENTIONS.md](./documentation/CONVENTIONS.md#git-flow) pour les bonnes pratiques à utiliser dans le cadre de votre travail sur votre fork.
+ - Lorsque vous estimez que votre fork est prête à être intégré dans l'application en production, vous pouvez faire une "merge request".
+   - Pour que votre fork soit prête à être intégrée, il faut que celle-ci démontre une nouvelle fonctionnalité majeure, testée et fonctionnant comme attendue.
+   - Votre merge request doit contenir un texte expliquant la nouvelle fonctionnalité en détail, comment elle est utilisée et testée. Si applicable, des captures d'écrans peuvent être fournies.
+ - Votre requête sera ensuite étudiée par les membres AQL de l'équipe 1. Si celle-ci fonctionne et satisfait les mesures d'AQL mises en places, alors elle sera acceptée et intégrée à l'application.
+   - Dans le cas contraire, la requête sera refusée et des commentaires seront adressés sur les modifications à apporter.
+
+## Règles à respecter
+
+Voici l'ensemble des règles à respecter lors de votre contribution à TAF. Si celles-ci ne sont pas respectées, **vos merge requests risquent fortement d'être refusées.**
+
+- Les conventions spécifiées dans le fichier [CONVENTIONS.md](./documentation/CONVENTIONS.md) concernant le code et la réalisation de celui ci doivent être respectées.
+- Le code réalisé doit être
+  - Accompagné d'une documentation disponible sur le [Wiki.js](https://js.wiki/) du projet.
+  - Testé. Bien que nous ne demandons pas un % de couverture fixe, un maximum des fonctions réalisées doivent être couverte par des tests unitaires.

README.md

@@ -1,36 +1,45 @@
-# Test-Framework
-Projet de R&D de cadriciel (outil) d’automatisation de test
+![Logo taf](./logo_taf.png)
 
+# Test Automation Framework
 
-L'application comporte deux modules : backend et frontend
+TAF est un projet de R&D de cadriciel d’automatisation de test
 
-backend est comme son nom l'indique représente la partie serveur, c'est une application springboot
-frontend est la partie UI, c'est une application Angular.
 
-## Build et lancement
+Il permet l'utilisation de plusieurs outils de tests (Selenium, Gatling, ...) à travers une interface web unique.
 
-Backend : build maven (mvn clean install), configurez l'application springboot dans votre ide (Eclipse, IntelliJ).
-Des outils sont disponibles dans ces ide pour lancer l'application.
+L'application côté serveur est une application Java utilisant Springboot.
+L'interface est une application web utilisant le framework Angular.
 
-Frontend: lancer l'application avec automatique de la page d'accueil dans une fenêtre du brower, avec la ligne de commande
-ng serve --o
+## Builder et lancer le projet
 
-Pour le moment, il faut partir chacun des modules séparemment (en premier la backend près le frontend). Une prochaine version
-permettera de lancer toute l'application.
+Pour lancer le projet, la méthode la plus simple est d'utiliser
 
-## Build and Run using Docker
+### Avec docker :
 
-*Prerequisites : Have Docker and docker-compose installed and running*
-
-Run the following command to start all the dockers using docker-compose by specifying the environment variables file.
-```shell
+- (Prérequis) Installez Docker ainsi que Docker Compose sur votre système
+- Exécutez la commande suivante :
+```bash
 docker compose --env-file .docker_config.env up
 ```
 
-## Branches
+### Sans docker :
+
+Il est aussi possible de lancer les applications côté serveur et côté client séparément. Cela n'est cependant pas recommandé, car cela est plus complexe, et le deviendra de plus en plus à mesure que de nouveaux services seront ajouté.
+
+**Backend :**
+- Installez maven sur votre système avec `mvn clean install`.
+- Configurez l'application Springboot dans votre ide (Eclipse, IntelliJ). Des outils sont disponibles dans ces IDEs pour lancer l'application.
+
+**Frontend :**
+- Installez des dépendances avec `npm install`.
+- Lancez l'application avec la ligne de commande
+`ng serve --o`.
+
+## Contribuer au projet
+
+La démarche pour contribuer au projet est disponible dans le document [CONTRIBUTING.md](./CONTRIBUTING.md).  
+La programmation en JS/TS et Java font usage de conventions précises disponibles dans le fichier [CONVENTIONS.md](./documentation/CONVENTIONS.md). La non-utilisation de ces normes pourrait mener à un refus de vos contributions.
 
-la branche principale de développement est develop, elle sert à faire les merges de toutes les branches de travail en cours.
-Chacun, part sa propre branche à partir de la branche develop.
-Aucun commit ne doit être fait directement dans la branche develop.
-Mohammed Hilali, s'occupe de faire les merges à partir des Pull Request que vous allez adresser à partir de votre branche chacun vers la branche develop.
+## Contact
 
+En cas de questions, vous pouvez rejoindre [le discord TAF](https://discord.gg/TYrqTdHEqk). Veilliez à ce qu'uniquement 1 ou 2 personnes de votre équipe le rejoigne afin de limiter le nombres de personnes et de faciliter la communication.

documentation/CONVENTIONS.md

@@ -1,7 +1,4 @@
 # TAF - Conventions d'écriture
-Dernière mise à jour : 16/10/2023
-
----
 
 ## TypeScript - Framework Angular
 - Noms des fonctions et variables en CamelCase : `thisIsAVariable`

frontend/pom.xml

@@ -52,4 +52,4 @@
 		</resources>
 	</build>
 
-</project>
+</project>

frontend/proxy.conf.json

@@ -1,7 +1,7 @@
 
 {
 	"/": {
-		"target": "https://localhost:8080",
+		"target": "/taf",
 		"secure": false
 	}
 }

frontend/src/app/_services/test-api.service.ts

@@ -1,29 +1,76 @@
 import { Injectable } from '@angular/core';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
-import { Observable } from 'rxjs';
+import {HttpClient, HttpErrorResponse, HttpHeaders} from '@angular/common/http';
+import {BehaviorSubject,  Observable, Subject, forkJoin, throwError} from 'rxjs';
+import { catchError, map } from 'rxjs/operators';
 import { environment } from '../../environments/environment';
-
-const AUTH_API = `${environment.apiUrl}/api/testapi/`;
-
-const httpOptions = {
-  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
-};
+import {testModel} from "../models/test-model";
+import {testModel2} from "../models/testmodel2";
+import {TestResponseModel} from "../models/testResponseModel";
 
 @Injectable({
   providedIn: 'root'
 })
 
 export class TestApiService {
+  REST_API: string = environment.apiUrl
   constructor(private http: HttpClient) { }
 
-  execute(method:string, apiUrl:string, statusCode:number, input:string, expectedOutput:string): Observable<any> {
-  console.log(expectedOutput);
-    return this.http.post(AUTH_API + 'checkApi', {
-         method: method,
-         apiUrl: apiUrl,
-         statusCode: statusCode,
-         expectedOutput: expectedOutput,
-         input: input,
-    }, httpOptions);
+  //execute tests one by one
+  executeTests(dataTests: testModel2[]): Observable<TestResponseModel[]> {
+    return forkJoin(
+      dataTests.map(test =>
+        this.http.post<TestResponseModel>(`${this.REST_API}/microservice/testapi/checkApi`, test)
+      )
+    );
+  }
+
+//to refresh automatically the tests's  list
+  private testsSubject: BehaviorSubject<testModel2[]> = new BehaviorSubject<testModel2[]>([]);
+  tests$ : Observable<testModel2[]> = this.testsSubject.asObservable();
+  listTests : testModel2 []=[];
+
+  //ajouter un test a la liste
+  addTestOnList(newTest: testModel2){
+    newTest.id= this.listTests.length+1;
+    this.listTests.push(newTest);
+    this.testsSubject.next([...this.listTests]);
+
+  }
+
+// delete a test from the liste when user confirm the remove
+  deleteTest(id: number){
+    let indiceASupprimer = id-1;
+    this.listTests.splice(indiceASupprimer, 1);
+    this.testsSubject.next([...this.listTests]);
+
+  }
+
+  // get test information to show it to the user, so he can conform that he wants delete the right test on the list
+  getTest(id: number) {
+    const rowTest = this.listTests.find(row => row.id === id);
+    return rowTest;
+  }
+
+  // Update the status of test executions using index
+  updateTestsStatusExecution(listTestsResponses: TestResponseModel[]) {
+    // Ensure the response list length is equal to the test list length
+    if (listTestsResponses.length !== this.listTests.length) {
+      console.error('The number of responses does not match the number of tests.');
+      return;
+    }
+
+    // Iterate over the responses and update the corresponding test by index
+    listTestsResponses.forEach((response, index) => {
+      // Directly using the index to update the status
+      if (this.listTests[index]) { // Check if the test exists at this index
+        this.listTests[index].responseStatus = response.answer;
+      } else {
+        console.error(`No test found at index ${index}`);
+      }
+    });
+
+    // Emit the updated test list
+    this.testsSubject.next([...this.listTests]);
   }
+
 }

frontend/src/app/app-routing.module.ts

@@ -1,13 +1,14 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-
 import { RegisterComponent } from './register/register.component';
 import { ProjectComponent } from './project/project.component';
 import { LoginComponent } from './login/login.component';
 import { HomeComponent } from './home/home.component';
 import { ProfileComponent } from './profile/profile.component';
 import { BoardUserComponent } from './board-user/board-user.component';
 import { BoardAdminComponent } from './board-admin/board-admin.component';
+import { JmeterComponent } from './jmeter/jmeter.component';
+import { GatlingComponent } from './gatling/gatling.component';
 import { TestApiComponent } from './interface-test-api/test-api/test-api.component';
 import { TestSeleniumComponent } from './selenium/test-selenium.component';
 import { PerformanceTestApiComponent } from './performance-test-api/performance-test-api.component';
@@ -20,6 +21,8 @@ const routes: Routes = [
   { path: 'profile', component: ProfileComponent },
   { path: 'user', component: BoardUserComponent },
   { path: 'admin', component: BoardAdminComponent },
+  { path : 'jmeter', component: JmeterComponent },
+  { path : 'gatling', component: GatlingComponent },
   { path: 'test-api', component: TestApiComponent },
   { path: 'test-selenium', component: TestSeleniumComponent },
   { path: 'performance-test-api', component: PerformanceTestApiComponent },

frontend/src/app/app.component.html

@@ -29,6 +29,12 @@
       <li class="nav-item">
         <a href="/login" class="nav-link" routerLink="login">Connexion</a>
       </li>
+      <li class="nav-item">
+        <a href="/jmeter" class="nav-link" routerLink="jmeter">Jmeter</a>
+      </li>
+      <li class="nav-item">
+        <a href="/gatling" class="nav-link" routerLink="gatling">Gatling</a>
+      </li>
     </ul>
 
     <ul class="navbar-nav ml-auto" *ngIf="isLoggedIn">

frontend/src/app/app.component.ts

@@ -12,7 +12,8 @@ export class AppComponent {
   showAdminBoard = false;
   fullName?: string;
 
-  constructor(private tokenStorageService: TokenStorageService) { }
+  constructor(private tokenStorageService: TokenStorageService) {
+  }
 
   ngOnInit(): void {
     this.isLoggedIn = !!this.tokenStorageService.getToken();

frontend/src/app/app.module.ts

@@ -1,6 +1,7 @@
+
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { FormsModule } from '@angular/forms';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
 
 import { AppRoutingModule } from './app-routing.module';
@@ -15,6 +16,19 @@ import { BoardUserComponent } from './board-user/board-user.component';
 import { authInterceptorProviders } from './_helpers/auth.interceptor';
 import { ProjectComponent } from './project/project.component';
 import { TestApiComponent } from './interface-test-api/test-api/test-api.component';
+
+import { MatTableModule } from '@angular/material/table';
+
+import {MatFormFieldModule} from "@angular/material/form-field";
+import {MatIconModule} from "@angular/material/icon";
+import {MatButtonModule} from "@angular/material/button";
+import { AddTestDialogComponent } from './interface-test-api/test-api/add-test-dialog/add-test-dialog.component';
+import {MatDialog, MatDialogModule} from "@angular/material/dialog";
+import { DeleteTestDialogComponent } from './interface-test-api/test-api/delete-test-dialog/delete-test-dialog.component';
+import {MatCardModule} from "@angular/material/card";
+import { MatInputModule } from '@angular/material/input';
+import { MatSelectModule } from '@angular/material/select';
+
 import { TestSeleniumComponent } from './selenium/test-selenium.component';
 
 import { PerformanceTestApiModule } from './performance-test-api/performance-test-api.module';
@@ -24,6 +38,7 @@ import { JmeterApiComponent } from './performance-test-api/jmeter-api/jmeter-api
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -35,19 +50,31 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
     BoardUserComponent,
     ProjectComponent,
     TestApiComponent,
+    AddTestDialogComponent,
+    DeleteTestDialogComponent,
     TestSeleniumComponent,
     PerformanceTestApiComponent,
     GatlingApiComponent,
     JmeterApiComponent
   ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule,
-    FormsModule,
-    HttpClientModule,
-    BrowserAnimationsModule,
-    PerformanceTestApiModule
-  ],
+
+    imports: [
+        BrowserModule,
+        AppRoutingModule,
+        FormsModule,
+        HttpClientModule,
+        MatTableModule,
+        BrowserAnimationsModule,
+        PerformanceTestApiModule,
+        MatFormFieldModule,
+        MatIconModule,
+        MatButtonModule,
+        MatDialogModule,
+        MatCardModule,
+        ReactiveFormsModule,
+        MatInputModule,
+        MatSelectModule
+    ],
   providers: [authInterceptorProviders],
   bootstrap: [AppComponent]
 })

frontend/src/app/gatling/gatling.component.css

@@ -0,0 +1,12 @@
+label {
+    font-size: small;
+}
+input {
+    font-size: small;
+}
+
+#boutonEnvoyer {
+    width: "20px";
+    height: "15px";
+    font-size: small;
+}

frontend/src/app/gatling/gatling.component.html

@@ -0,0 +1,29 @@
+<h1>Gatling</h1>
+<p>Veuillez remplir le formulaire suivant pour envoyer les information à Jmeter afin qu'il puisse réaliser le test désiré</p>
+<form method="post" action="http://localhost:8080/gatling/http-request">
+    <label for="nbUsers">Entrez le nombre d'utilisateur :</label>
+    <input type="number" name="nbUsers" min="0" max="999999">
+    <br/>
+    <label for="rampUpPeriod">Entrez la différence de temps d'accès entre chaque utilisateur :</label>
+    <input type="number" name="rampUpPeriod" min="0" max="999999">
+    <br/>
+    <label for="loopCount">Entrez le nombre de tour à réaliser :</label>
+    <input type="number" name="loopCount" min="0" max="999999">
+    <br/>
+    <label for="protocol">Entrez le nom du protocole à effectuer :</label>
+    <input type="text" name="protocol">
+    <br/>
+    <label for="serverName">Entrez le nom du serveur :</label>
+    <input type="text" name="serverName">
+    <br/>
+    <label for="port">Entrez le numéro de port du serveur :</label>
+    <input type="number" name="port" min="0" max="999999">
+    <br/>
+    <label for="method">Entrez la méthode à réaliser :</label>
+    <input type="text" name="method">
+    <br/>
+    <label for="path">Entrez le chemin à tester :</label>
+    <input type="text" name="path">
+    <br/>
+    <input id="boutonEnvoyer" type="submit" value="Envoyer">
+</form>