test(#2017): Add cypress test for configuration

ui/cypress/tests/configuration/labels/general.spec.ts

@@ -0,0 +1,43 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+describe('Change basic settings', () => {
+    beforeEach('Setup Test', () => {
+        cy.initStreamPipesTest();
+    });
+
+    it('Perform Test', () => {
+        cy.visit('#/configuration/general');
+
+        // Rename app, change localhost and port
+        cy.dataCy('general-config-app-name').clear();
+        cy.dataCy('general-config-app-name').type('TEST APP');
+        cy.dataCy('general-config-hostname').clear();
+        cy.dataCy('general-config-hostname').type('testhost');
+        cy.dataCy('general-config-port').clear();
+        cy.dataCy('general-config-port').type('123');
+        cy.dataCy('sp-element-general-config-save').click();
+
+        // Leave, Re-visit configuration and check values
+        cy.visit('#/dashboard');
+        cy.visit('#/configuration/general');
+        cy.dataCy('general-config-app-name').should('have.value', 'TEST APP');
+        cy.dataCy('general-config-hostname').should('have.value', 'testhost');
+        cy.dataCy('general-config-port').should('have.value', '123');
+    });
+});

ui/cypress/tests/configuration/labels/labels.spec.ts

@@ -0,0 +1,41 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+describe('Add and Delete Label', () => {
+    beforeEach('Setup Test', () => {
+        cy.initStreamPipesTest();
+    });
+
+    it('Perform Test', () => {
+        cy.visit('#/configuration/labels');
+
+        // Add new label
+        cy.dataCy('new-label-button').click();
+        cy.dataCy('label-name').type('test');
+        cy.dataCy('label-description').type('test test');
+        cy.dataCy('save-label-button').click();
+
+        // Check label
+        cy.dataCy('available-labels-list').should('have.length', 1);
+        cy.dataCy('label-text').should('have.text', ' test\n');
+
+        // Delete label
+        cy.dataCy('delete-label-button').click();
+        cy.dataCy('available-labels-list').should('have.length', 0);
+    });
+});

ui/src/app/configuration/general-configuration/general-configuration.component.html

@@ -36,6 +36,7 @@
                             fxFlex
                             matInput
                             required
+                            data-cy="general-config-app-name"
                         />
                     </mat-form-field>
                     <div class="subsection-title">Host and Port</div>
@@ -62,6 +63,7 @@
                                     fxFlex
                                     matInput
                                     required
+                                    data-cy="general-config-hostname"
                                 />
                             </mat-form-field>
                             <mat-form-field color="accent" class="ml-10">
@@ -72,6 +74,7 @@
                                     matInput
                                     type="number"
                                     required
+                                    data-cy="general-config-port"
                                 />
                             </mat-form-field>
                         </div>

ui/src/app/configuration/label-configuration/edit-label/edit-label.component.html

@@ -34,11 +34,15 @@
         ></sp-label>
         <mat-form-field color="accent" appearance="outline">
             <mat-label>Label</mat-label>
-            <input matInput [(ngModel)]="label.label" />
+            <input matInput [(ngModel)]="label.label" data-cy="label-name" />
         </mat-form-field>
         <mat-form-field color="accent" appearance="outline">
             <mat-label>Desription</mat-label>
-            <input matInput [(ngModel)]="label.description" />
+            <input
+                matInput
+                [(ngModel)]="label.description"
+                data-cy="label-description"
+            />
         </mat-form-field>
         <input
             [(colorPicker)]="label.color"
@@ -58,6 +62,7 @@
                 mat-button
                 mat-raised-button
                 color="accent"
+                data-cy="save-label-button"
                 (click)="saveEmitter.emit(label)"
             >
                 Save

ui/src/app/configuration/label-configuration/label-configuration.component.html

@@ -26,6 +26,7 @@
                 mat-button
                 mat-raised-button
                 color="accent"
+                data-cy="new-label-button"
                 (click)="createLabelMode = true"
             >
                 <i class="material-icons">add</i><span>&nbsp;New label</span>
@@ -43,6 +44,7 @@
                 fxLayout="column"
                 *ngFor="let label of allLabels"
                 class="label-item"
+                data-cy="available-labels-list"
             >
                 <div
                     fxLayout="row"
@@ -53,6 +55,7 @@
                         fxFlex="20"
                         [labelText]="label.label"
                         [labelBackground]="label.color"
+                        data-cy="label-text"
                     >
                     </sp-label>
                     <span fxFlex="50" *ngIf="!isEditMode(label._id)">{{
@@ -71,6 +74,7 @@
                             mat-icon-button
                             color="warn"
                             (click)="deleteLabel(label)"
+                            data-cy="delete-label-button"
                         >
                             <i class="material-icons">delete</i>
                         </button>