Added more tests to cover the request grid around TV

Ombi-app · Mar 17, 2021 · c2a3fd1 · c2a3fd1
1 parent 432fb68
commit c2a3fd1
Show file tree

Hide file tree

Showing 9 changed files with 225 additions and 40 deletions.
diff --git a/...bi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html b/...bi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html
@@ -9,7 +9,7 @@
                 <div class="row">
                     <div
                         class="mobile-top-text">
-                        <h1 class="large-text">{{title}} <span *ngIf="releaseDate" class="grey-text">
+                        <h1 id="mediaTitle" class="large-text">{{title}} <span *ngIf="releaseDate" class="grey-text">
                             ({{releaseDate | amLocal | amDateFormat: 'YYYY'}})</span>
                         </h1>
 

diff --git a/src/Ombi/ClientApp/src/app/requests-list/components/movies-grid/movies-grid.component.html b/src/Ombi/ClientApp/src/app/requests-list/components/movies-grid/movies-grid.component.html
@@ -5,20 +5,20 @@
     <!-- <div class="row"> -->
     <div class="row justify-content-md-center top-spacing">
         <div class="btn-group" role="group">
-            <button type="button" (click)="switchFilter(RequestFilter.All)" [attr.color]="currentFilter === RequestFilter.All ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.All ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.AllRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Pending)" [attr.color]="currentFilter === RequestFilter.Pending ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Pending ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.PendingRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Processing)" [attr.color]="currentFilter === RequestFilter.Processing ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Processing ? 'mat-accent' : 'mat-primary'" mat-raised-button
+            <button type="button" id="filterAll" (click)="switchFilter(RequestFilter.All)" [attr.color]="currentFilter === RequestFilter.All ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.All ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.AllRequests' | translate}}</button>
+            <button type="button" id="filterPending" (click)="switchFilter(RequestFilter.Pending)" [attr.color]="currentFilter === RequestFilter.Pending ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Pending ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.PendingRequests' | translate}}</button>
+            <button type="button" id="filterProcessing" (click)="switchFilter(RequestFilter.Processing)" [attr.color]="currentFilter === RequestFilter.Processing ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Processing ? 'mat-accent' : 'mat-primary'" mat-raised-button
                 class="btn grow">{{'Requests.ProcessingRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Available)" [attr.color]="currentFilter === RequestFilter.Available ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Available ? 'mat-accent' : 'mat-primary'" mat-raised-button
+            <button type="button" id="filterAvailable" (click)="switchFilter(RequestFilter.Available)" [attr.color]="currentFilter === RequestFilter.Available ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Available ? 'mat-accent' : 'mat-primary'" mat-raised-button
                 class="btn grow">{{'Requests.AvailableRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Denied)" [attr.color]="currentFilter === RequestFilter.Denied ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Denied ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.DeniedRequests' | translate}}</button>
+            <button type="button" id="filterDenied" (click)="switchFilter(RequestFilter.Denied)" [attr.color]="currentFilter === RequestFilter.Denied ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Denied ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.DeniedRequests' | translate}}</button>
         </div>
     </div>
 
     <div class="row">
         <div class="col-md-2 offset-md-10">
             <mat-form-field>
-                <mat-select placeholder="{{'Requests.RequestsToDisplay' | translate}}" [(value)]="gridCount" (selectionChange)="ngAfterViewInit()">
+                <mat-select id="requestsToDisplayDropdown" placeholder="{{'Requests.RequestsToDisplay' | translate}}" [(value)]="gridCount" (selectionChange)="ngAfterViewInit()">
                     <mat-option value="10">10</mat-option>
                     <mat-option value="15">15</mat-option>
                     <mat-option value="30">30</mat-option>
@@ -31,14 +31,14 @@
     <table mat-table [dataSource]="dataSource" class="requests table" matSort [matSortActive]="defaultSort" matSortDisableClear [matSortDirection]="defaultOrder">
 
         <ng-container matColumnDef="select" *ngIf="isAdmin">
-            <th mat-header-cell *matHeaderCellDef>
-              <mat-checkbox (change)="$event ? masterToggle() : null"
+            <th  mat-header-cell *matHeaderCellDef>
+              <mat-checkbox id="adminMasterCheckbox" (change)="$event ? masterToggle() : null"
                             [checked]="selection.hasValue() && isAllSelected()"
                             [indeterminate]="selection.hasValue() && !isAllSelected()">
               </mat-checkbox>
             </th>
             <td mat-cell *matCellDef="let row">
-              <mat-checkbox (click)="$event.stopPropagation()"
+              <mat-checkbox  id="adminMasterCheckbox"  (click)="$event.stopPropagation()"
                             (change)="$event ? selection.toggle(row) : null"
                             [checked]="selection.isSelected(row)">
               </mat-checkbox>
@@ -47,36 +47,36 @@
 
         <ng-container matColumnDef="title">
             <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear> {{ 'Requests.RequestsTitle' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.title}} ({{element.releaseDate | amLocal | amDateFormat: 'YYYY'}}) </td>
+            <td mat-cell id="title{{element.id}}" *matCellDef="let element"> {{element.title}} ({{element.releaseDate | amLocal | amDateFormat: 'YYYY'}}) </td>
         </ng-container>
 
         <ng-container matColumnDef="requestedUser.requestedBy">
             <th mat-header-cell *matHeaderCellDef> {{'Requests.RequestedBy' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.requestedUser?.userAlias}} </td>
+            <td mat-cell id="requestedBy{{element.id}}" *matCellDef="let element"> {{element.requestedUser?.userAlias}} </td>
         </ng-container>
 
 
         <ng-container matColumnDef="requestedDate">
             <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear> {{ 'Requests.RequestDate' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.requestedDate | amLocal | amDateFormat: 'LL'}} </td>
+            <td mat-cell id="requestedDate{{element.id}}" *matCellDef="let element"> {{element.requestedDate | amLocal | amDateFormat: 'LL'}} </td>
         </ng-container>
 
         <ng-container matColumnDef="status">
             <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear> {{ 'Requests.Status' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.status}} </td>
+            <td mat-cell id="status{{element.id}}"  *matCellDef="let element"> {{element.status}} </td>
         </ng-container>
 
 
         <ng-container matColumnDef="requestStatus">
             <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear> {{ 'Requests.RequestStatus' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.requestStatus | translate}} </td>
+            <td mat-cell id="requestedStatus{{element.id}}"  *matCellDef="let element"> {{element.requestStatus | translate}} </td>
         </ng-container>
 
         <ng-container matColumnDef="actions">
             <th mat-header-cell *matHeaderCellDef> </th>
             <td mat-cell *matCellDef="let element">
-                <button mat-raised-button color="accent" [routerLink]="'/details/movie/' + element.theMovieDbId">{{ 'Requests.Details' | translate}}</button>
-                <button mat-raised-button color="warn" (click)="openOptions(element)" *ngIf="isAdmin"> {{ 'Requests.Options' | translate}}</button>
+                <button id="detailsButton{{element.id}}" mat-raised-button color="accent" [routerLink]="'/details/movie/' + element.theMovieDbId">{{ 'Requests.Details' | translate}}</button>
+                <button id="optionsButton{{element.id}}" mat-raised-button color="warn" (click)="openOptions(element)" *ngIf="isAdmin"> {{ 'Requests.Options' | translate}}</button>
             </td>
         </ng-container>
 
@@ -87,9 +87,9 @@
     <mat-paginator [length]="resultsLength" [pageSize]="gridCount"></mat-paginator>
 </div>
 
-<button *ngIf="selection.hasValue() && isAdmin" mat-fab color="accent" class="floating-fab" [matMenuTriggerFor]="aboveMenu">
+<button id="bulkFab" *ngIf="selection.hasValue() && isAdmin" mat-fab color="accent" class="floating-fab" [matMenuTriggerFor]="aboveMenu">
     <i class="fas fa-bars"></i></button>
   <mat-menu #aboveMenu="matMenu" yPosition="above">
-    <button mat-menu-item (click)="bulkDelete()">{{'Requests.RequestPanel.Delete' | translate}}</button>
-    <button mat-menu-item (click)="bulkApprove()">{{'Requests.RequestPanel.Approve' | translate}}</button>
+    <button id="deleteFabButton" mat-menu-item (click)="bulkDelete()">{{'Requests.RequestPanel.Delete' | translate}}</button>
+    <button id="approveFabButton" mat-menu-item (click)="bulkApprove()">{{'Requests.RequestPanel.Approve' | translate}}</button>
   </mat-menu>
diff --git a/src/Ombi/ClientApp/src/app/requests-list/components/options/request-options.component.html b/src/Ombi/ClientApp/src/app/requests-list/components/options/request-options.component.html
@@ -1,11 +1,11 @@
 <mat-nav-list>
-  <a (click)="delete()" mat-list-item>
+  <a id="requestDelete" (click)="delete()" mat-list-item>
     <span mat-line>{{'Requests.RequestPanel.Delete' | translate}}</span>
   </a>
-  <a *ngIf="data.canApprove" (click)="approve()" mat-list-item>
+  <a id="requestApprove" *ngIf="data.canApprove" (click)="approve()" mat-list-item>
     <span mat-line>{{'Requests.RequestPanel.Approve' | translate}}</span>
   </a>
-  <a *ngIf="data.type !== RequestType.tvShow" (click)="changeAvailability()" mat-list-item>
+  <a id="requestChangeAvailability" *ngIf="data.type !== RequestType.tvShow" (click)="changeAvailability()" mat-list-item>
     <span mat-line>{{'Requests.RequestPanel.ChangeAvailability' | translate}}</span>
   </a>
 </mat-nav-list>
diff --git a/src/Ombi/ClientApp/src/app/requests-list/components/tv-grid/tv-grid.component.html b/src/Ombi/ClientApp/src/app/requests-list/components/tv-grid/tv-grid.component.html
@@ -5,20 +5,20 @@
 
     <div class="row justify-content-md-center top-spacing">
         <div class="btn-group" role="group">
-            <button type="button" (click)="switchFilter(RequestFilter.All)" [attr.color]="currentFilter === RequestFilter.All ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.All ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.AllRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Pending)" [attr.color]="currentFilter === RequestFilter.Pending ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Pending ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.PendingRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Processing)" [attr.color]="currentFilter === RequestFilter.Processing ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Processing ? 'mat-accent' : 'mat-primary'" mat-raised-button
+            <button type="button" id="filterAll" (click)="switchFilter(RequestFilter.All)" [attr.color]="currentFilter === RequestFilter.All ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.All ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.AllRequests' | translate}}</button>
+            <button type="button" id="filterPending" (click)="switchFilter(RequestFilter.Pending)" [attr.color]="currentFilter === RequestFilter.Pending ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Pending ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.PendingRequests' | translate}}</button>
+            <button type="button" id="filterProcessing" (click)="switchFilter(RequestFilter.Processing)" [attr.color]="currentFilter === RequestFilter.Processing ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Processing ? 'mat-accent' : 'mat-primary'" mat-raised-button
                 class="btn grow">{{'Requests.ProcessingRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Available)" [attr.color]="currentFilter === RequestFilter.Available ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Available ? 'mat-accent' : 'mat-primary'" mat-raised-button
+            <button type="button" id="filterAvailable" (click)="switchFilter(RequestFilter.Available)" [attr.color]="currentFilter === RequestFilter.Available ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Available ? 'mat-accent' : 'mat-primary'" mat-raised-button
                 class="btn grow">{{'Requests.AvailableRequests' | translate}}</button>
-            <button type="button" (click)="switchFilter(RequestFilter.Denied)" [attr.color]="currentFilter === RequestFilter.Denied ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Denied ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.DeniedRequests' | translate}}</button>
+            <button type="button" id="filterDenied" (click)="switchFilter(RequestFilter.Denied)" [attr.color]="currentFilter === RequestFilter.Denied ? 'accent' : 'primary'" [ngClass]="currentFilter === RequestFilter.Denied ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow">{{'Requests.DeniedRequests' | translate}}</button>
         </div>
     </div>
 
     <div class="row">
         <div class="col-md-2 offset-md-10">
             <mat-form-field>
-                <mat-select placeholder="{{'Requests.RequestsToDisplay' | translate}}" [(value)]="gridCount" (selectionChange)="ngAfterViewInit()">
+                <mat-select id="requestsToDisplayDropdown" placeholder="{{'Requests.RequestsToDisplay' | translate}}" [(value)]="gridCount" (selectionChange)="ngAfterViewInit()">
                     <mat-option value="10">10</mat-option>
                     <mat-option value="15">15</mat-option>
                     <mat-option value="30">30</mat-option>
@@ -33,24 +33,24 @@
 
         <ng-container matColumnDef="series">
             <th mat-header-cell *matHeaderCellDef> {{'Requests.RequestsTitle' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.parentRequest.title}} </td>
+            <td mat-cell id="title{{element.id}}" *matCellDef="let element"> {{element.parentRequest.title}} </td>
         </ng-container>
 
         <ng-container matColumnDef="requestedBy">
             <th mat-header-cell *matHeaderCellDef> {{'Requests.RequestedBy' | translate}} </th>
-            <td mat-cell *matCellDef="let element"> {{element.requestedUser.userAlias}} </td>
+            <td mat-cell id="requestedBy{{element.id}}" *matCellDef="let element"> {{element.requestedUser.userAlias}} </td>
         </ng-container>
 
         <ng-container matColumnDef="requestedDate">
             <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear> {{'Requests.RequestDate' | translate}} </th>
-            <td mat-cell *matCellDef="let element">
+            <td id="requestedDate{{element.id}}"  mat-cell *matCellDef="let element">
                 {{element.requestedDate | amLocal | amDateFormat: 'LL'}}
             </td>
         </ng-container>
 
         <ng-container matColumnDef="requestStatus">
             <th mat-header-cell *matHeaderCellDef> {{'Requests.RequestStatus' | translate}} </th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell id="requestedStatus{{element.id}}"  *matCellDef="let element">
                 <div *ngIf="element.approved && !element.available">{{'Common.ProcessingRequest' | translate}}</div>
                 <div *ngIf="!element.approved && !element.available">{{'Common.PendingApproval' |translate}}</div>
                 <div *ngIf="element.available">{{'Common.Available' | translate}}</div>
@@ -60,16 +60,16 @@
 
         <ng-container matColumnDef="status">
             <th mat-header-cell *matHeaderCellDef> {{'Requests.Status' | translate}} </th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell id="status{{element.id}}" *matCellDef="let element">
                 {{element.parentRequest.status}}
             </td>
         </ng-container>
 
         <ng-container matColumnDef="actions">
             <th mat-header-cell *matHeaderCellDef> </th>
             <td mat-cell *matCellDef="let element">
-                <button mat-raised-button color="accent" [routerLink]="'/details/tv/' + element.parentRequest.externalProviderId">{{'Requests.Details' | translate}}</button>
-                <button mat-raised-button color="warn" (click)="openOptions(element)" *ngIf="isAdmin">{{'Requests.Options' | translate}}</button>
+                <button id="detailsButton{{element.id}}" mat-raised-button color="accent" [routerLink]="'/details/tv/' + element.parentRequest.externalProviderId">{{'Requests.Details' | translate}}</button>
+                <button id="optionsButton{{element.id}}" mat-raised-button color="warn" (click)="openOptions(element)" *ngIf="isAdmin">{{'Requests.Options' | translate}}</button>
             </td>
         </ng-container>
 

diff --git a/tests/cypress/integration/page-objects/details/tv/tvdetails.page.ts b/tests/cypress/integration/page-objects/details/tv/tvdetails.page.ts
@@ -1,5 +1,10 @@
 import { BasePage } from "../../base.page";
 
+class BaseMediaPage extends BasePage {
+    get title(): Cypress.Chainable<any> {
+        return cy.get('#mediaTitle');
+    }
+}
 class TvRequestPanel {
 
     seasonTab(seasonNumber: number): Cypress.Chainable<any> {
@@ -56,7 +61,7 @@ class TvDetailsInformationPanel {
     }
 }
 
-class TvDetailsPage extends BasePage {
+class TvDetailsPage extends BaseMediaPage {
 
 
     get availableButton(): Cypress.Chainable<any> {

diff --git a/tests/cypress/integration/page-objects/index.ts b/tests/cypress/integration/page-objects/index.ts
@@ -4,3 +4,4 @@ export * from './wizard/wizard.page';
 export * from './details/tv/tvdetails.page';
 export * from './search/search.page';
 export * from './user-preferences/user-preferences.page';
+export * from './requests/requests.page';