This is an automated email from the ASF dual-hosted git repository.
bossenti pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/streampipes.git
The following commit(s) were added to refs/heads/dev by this push:
new 166277f98 New E2E-Tests for data view (#2154)
166277f98 is described below
commit 166277f98ffdf9da2afe9251fb347762d2e56503
Author: Marcelfrueh <[email protected]>
AuthorDate: Tue Nov 21 08:46:46 2023 +0100
New E2E-Tests for data view (#2154)
* Add two new tests for data view
* add five new tests for data view
* Merge branch 'dev' into dataview-tests
* Reset port in cypress.config.ts
* Remove test for filter in table.spec.ts
* added Utils
---
ui/cypress/support/utils/datalake/DataLakeUtils.ts | 7 ++-
.../widgets/{table.ts => 2d-correlation.spec.ts} | 41 +++++----------
.../widgets/{table.ts => distribution.spec.ts} | 43 ++++++---------
.../datalake/widgets/{table.ts => heatmap.spec.ts} | 36 +++----------
.../widgets/{table.ts => indicator.spec.ts} | 45 ++++++----------
ui/cypress/tests/datalake/widgets/map.spec.ts | 61 ++++++++++++++++++++++
.../datalake/widgets/{table.ts => table.spec.ts} | 36 +++----------
.../{timeSeriesSave.ts => timeSeriesSave.spec.ts} | 27 +++++-----
.../time-selector/timeRangeSelector.component.html | 1 +
.../data-explorer-dashboard-widget.component.html | 10 +++-
.../indicator-chart-widget-config.component.html | 1 +
.../map/config/map-widget-config.component.html | 3 ++
12 files changed, 152 insertions(+), 159 deletions(-)
diff --git a/ui/cypress/support/utils/datalake/DataLakeUtils.ts
b/ui/cypress/support/utils/datalake/DataLakeUtils.ts
index eb4968c39..9b567b31f 100644
--- a/ui/cypress/support/utils/datalake/DataLakeUtils.ts
+++ b/ui/cypress/support/utils/datalake/DataLakeUtils.ts
@@ -30,6 +30,11 @@ export class DataLakeUtils {
cy.visit('#/dataexplorer');
}
+ public static initDataLakeTests() {
+ cy.initStreamPipesTest();
+ DataLakeUtils.loadRandomDataSetIntoDataLake();
+ }
+
public static getDataLakeTestSetAdapter(
name: string,
storeInDataLake: boolean = true,
@@ -88,7 +93,7 @@ export class DataLakeUtils {
DataLakeUtils.createAndEditDataView(dataViewName);
DataLakeUtils.selectTimeRange(
- new Date(2015, 10, 20, 22, 44),
+ new Date(2020, 10, 20, 22, 44),
DataLakeUtils.getFutureDate(),
);
// DataLakeUtils.addNewWidget();
diff --git a/ui/cypress/tests/datalake/widgets/table.ts
b/ui/cypress/tests/datalake/widgets/2d-correlation.spec.ts
similarity index 53%
copy from ui/cypress/tests/datalake/widgets/table.ts
copy to ui/cypress/tests/datalake/widgets/2d-correlation.spec.ts
index 12ab68ded..4e799ef9c 100644
--- a/ui/cypress/tests/datalake/widgets/table.ts
+++ b/ui/cypress/tests/datalake/widgets/2d-correlation.spec.ts
@@ -18,41 +18,26 @@
import { DataLakeUtils } from '../../../support/utils/datalake/DataLakeUtils';
-describe('Test Table View in Data Explorer', () => {
+describe('Test 2d Correlation View in Data Explorer', () => {
beforeEach('Setup Test', () => {
- cy.login();
- // cy.initStreamPipesTest()
- // DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
});
it('Perform Test', () => {
- DataLakeUtils.goToDatalake();
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', '2D
Correlation');
- // DataLakeUtils.createAndEditDataView();
- // Click edit button
- cy.dataCy('edit-data-view').click();
-
- DataLakeUtils.addNewWidget();
-
- DataLakeUtils.selectDataSet('Persist');
-
- DataLakeUtils.dataConfigSelectAllFields();
+ // Check if scatter plot is displayed
+ cy.get('g').should('have.class', 'scatterlayer mlayer');
+ cy.get('g.points', { timeout: 10000 })
+ .children()
+ .should('have.length', 10);
+ // Change from line plot to scatter plot
DataLakeUtils.selectVisualizationConfig();
+ cy.get('div').contains('Scatter').click();
+ cy.get('div').contains('Density').click();
- DataLakeUtils.selectVisualizationType('Table');
-
- DataLakeUtils.clickCreateButton();
-
- DataLakeUtils.selectTimeRange(
- new Date(2020, 10, 20, 22, 44),
- DataLakeUtils.getFutureDate(),
- );
-
- cy.dataCy('data-explorer-table-row', { timeout: 10000 }).should(
- 'have.length',
- 10,
- );
- // Validate that X lines are available
+ // Check if scatter plot is displayed
+ cy.get('g').should('have.class', 'contourlayer mlayer');
});
});
diff --git a/ui/cypress/tests/datalake/widgets/table.ts
b/ui/cypress/tests/datalake/widgets/distribution.spec.ts
similarity index 54%
copy from ui/cypress/tests/datalake/widgets/table.ts
copy to ui/cypress/tests/datalake/widgets/distribution.spec.ts
index 12ab68ded..ec49019da 100644
--- a/ui/cypress/tests/datalake/widgets/table.ts
+++ b/ui/cypress/tests/datalake/widgets/distribution.spec.ts
@@ -18,41 +18,32 @@
import { DataLakeUtils } from '../../../support/utils/datalake/DataLakeUtils';
-describe('Test Table View in Data Explorer', () => {
+describe('Test Distribution View in Data Explorer', () => {
beforeEach('Setup Test', () => {
- cy.login();
- // cy.initStreamPipesTest()
- // DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
});
it('Perform Test', () => {
- DataLakeUtils.goToDatalake();
-
- // DataLakeUtils.createAndEditDataView();
- // Click edit button
- cy.dataCy('edit-data-view').click();
-
- DataLakeUtils.addNewWidget();
-
- DataLakeUtils.selectDataSet('Persist');
-
- DataLakeUtils.dataConfigSelectAllFields();
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', 'Distribution');
+ // Change field for histogram
DataLakeUtils.selectVisualizationConfig();
+ cy.get('div').contains('randomtext (prepared_data #1)').click();
+ cy.get('div').contains('randomnumber (prepared_data #1)').click();
- DataLakeUtils.selectVisualizationType('Table');
-
- DataLakeUtils.clickCreateButton();
-
- DataLakeUtils.selectTimeRange(
- new Date(2020, 10, 20, 22, 44),
- DataLakeUtils.getFutureDate(),
+ // Check if distribution chart is displayed
+ cy.get('sp-data-explorer-distribution-chart-widget').should(
+ 'be.visible',
);
- cy.dataCy('data-explorer-table-row', { timeout: 10000 }).should(
- 'have.length',
- 10,
+ // Change from histogram to heatmap
+ DataLakeUtils.selectVisualizationConfig();
+ cy.get('div').contains('Histogram').click();
+ cy.get('div').contains('Value Heatmap').click();
+
+ // Check if distribution chart is displayed
+ cy.get('sp-data-explorer-distribution-chart-widget').should(
+ 'be.visible',
);
- // Validate that X lines are available
});
});
diff --git a/ui/cypress/tests/datalake/widgets/table.ts
b/ui/cypress/tests/datalake/widgets/heatmap.spec.ts
similarity index 53%
copy from ui/cypress/tests/datalake/widgets/table.ts
copy to ui/cypress/tests/datalake/widgets/heatmap.spec.ts
index 12ab68ded..9fa4ac34a 100644
--- a/ui/cypress/tests/datalake/widgets/table.ts
+++ b/ui/cypress/tests/datalake/widgets/heatmap.spec.ts
@@ -18,41 +18,19 @@
import { DataLakeUtils } from '../../../support/utils/datalake/DataLakeUtils';
-describe('Test Table View in Data Explorer', () => {
+describe('Test Heatmap View in Data Explorer', () => {
beforeEach('Setup Test', () => {
- cy.login();
- // cy.initStreamPipesTest()
- // DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
});
it('Perform Test', () => {
- DataLakeUtils.goToDatalake();
-
- // DataLakeUtils.createAndEditDataView();
- // Click edit button
- cy.dataCy('edit-data-view').click();
-
- DataLakeUtils.addNewWidget();
-
- DataLakeUtils.selectDataSet('Persist');
-
- DataLakeUtils.dataConfigSelectAllFields();
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', 'Heatmap');
+ // Check checkbox
DataLakeUtils.selectVisualizationConfig();
+ cy.get('mat-checkbox input').click({ force: true });
- DataLakeUtils.selectVisualizationType('Table');
-
- DataLakeUtils.clickCreateButton();
-
- DataLakeUtils.selectTimeRange(
- new Date(2020, 10, 20, 22, 44),
- DataLakeUtils.getFutureDate(),
- );
-
- cy.dataCy('data-explorer-table-row', { timeout: 10000 }).should(
- 'have.length',
- 10,
- );
- // Validate that X lines are available
+ // Check if heatmap chart is visible
+ cy.get('sp-data-explorer-heatmap-widget').should('be.visible');
});
});
diff --git a/ui/cypress/tests/datalake/widgets/table.ts
b/ui/cypress/tests/datalake/widgets/indicator.spec.ts
similarity index 53%
copy from ui/cypress/tests/datalake/widgets/table.ts
copy to ui/cypress/tests/datalake/widgets/indicator.spec.ts
index 12ab68ded..a8499710d 100644
--- a/ui/cypress/tests/datalake/widgets/table.ts
+++ b/ui/cypress/tests/datalake/widgets/indicator.spec.ts
@@ -18,41 +18,26 @@
import { DataLakeUtils } from '../../../support/utils/datalake/DataLakeUtils';
-describe('Test Table View in Data Explorer', () => {
+describe('Test Indicator View in Data Explorer', () => {
beforeEach('Setup Test', () => {
- cy.login();
- // cy.initStreamPipesTest()
- // DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
});
it('Perform Test', () => {
- DataLakeUtils.goToDatalake();
-
- // DataLakeUtils.createAndEditDataView();
- // Click edit button
- cy.dataCy('edit-data-view').click();
-
- DataLakeUtils.addNewWidget();
-
- DataLakeUtils.selectDataSet('Persist');
-
- DataLakeUtils.dataConfigSelectAllFields();
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', 'Indicator');
+ // Check checkbox
DataLakeUtils.selectVisualizationConfig();
-
- DataLakeUtils.selectVisualizationType('Table');
-
- DataLakeUtils.clickCreateButton();
-
- DataLakeUtils.selectTimeRange(
- new Date(2020, 10, 20, 22, 44),
- DataLakeUtils.getFutureDate(),
- );
-
- cy.dataCy('data-explorer-table-row', { timeout: 10000 }).should(
- 'have.length',
- 10,
- );
- // Validate that X lines are available
+ cy.get('mat-checkbox input').click({ force: true });
+ cy.dataCy('data-explorer-select-delta-field')
+ .click()
+ .get('mat-option')
+ .contains('count')
+ .click();
+
+ // Check if indicator is displayed
+ cy.get('g').should('have.class', 'indicatorlayer');
+ // Check if delta is displayed
+ cy.get('text').should('have.class', 'delta');
});
});
diff --git a/ui/cypress/tests/datalake/widgets/map.spec.ts
b/ui/cypress/tests/datalake/widgets/map.spec.ts
new file mode 100644
index 000000000..72e08da3d
--- /dev/null
+++ b/ui/cypress/tests/datalake/widgets/map.spec.ts
@@ -0,0 +1,61 @@
+/*
+ * 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.
+ *
+ */
+
+import { DataLakeUtils } from '../../../support/utils/datalake/DataLakeUtils';
+
+describe('Test Map View in Data Explorer', () => {
+ beforeEach('Setup Test', () => {
+ DataLakeUtils.initDataLakeTests();
+ });
+
+ it('Perform Test', () => {
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', 'Map');
+
+ // Change marker positions
+ DataLakeUtils.selectVisualizationConfig();
+ cy.dataCy('data-view-map-select-latitude')
+ .click()
+ .get('mat-option')
+ .contains('randomnumber (prepared_data #1)')
+ .click();
+ cy.dataCy('data-view-map-select-longitude')
+ .click()
+ .get('mat-option')
+ .contains('randomnumber (prepared_data #1)')
+ .click();
+
+ // Check if map with markers is visible
+ cy.get('sp-data-explorer-map-widget').should('be.visible');
+ cy.get('img[alt=Marker]').should(
+ 'have.attr',
+ 'src',
+ 'assets/img/marker-icon.png',
+ );
+
+ // Change from markers to trace
+ DataLakeUtils.selectVisualizationConfig();
+ cy.dataCy('data-view-map-select-marker-or-trace')
+ .click()
+ .get('mat-option')
+ .contains('Trace')
+ .click();
+
+ // Check if trace is visible
+ cy.get('path').should('have.class', 'leaflet-interactive');
+ });
+});
diff --git a/ui/cypress/tests/datalake/widgets/table.ts
b/ui/cypress/tests/datalake/widgets/table.spec.ts
similarity index 53%
rename from ui/cypress/tests/datalake/widgets/table.ts
rename to ui/cypress/tests/datalake/widgets/table.spec.ts
index 12ab68ded..4648835e7 100644
--- a/ui/cypress/tests/datalake/widgets/table.ts
+++ b/ui/cypress/tests/datalake/widgets/table.spec.ts
@@ -20,39 +20,15 @@ import { DataLakeUtils } from
'../../../support/utils/datalake/DataLakeUtils';
describe('Test Table View in Data Explorer', () => {
beforeEach('Setup Test', () => {
- cy.login();
- // cy.initStreamPipesTest()
- // DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
});
it('Perform Test', () => {
- DataLakeUtils.goToDatalake();
+ DataLakeUtils.addDataViewAndWidget('view', 'Persist', 'Table');
- // DataLakeUtils.createAndEditDataView();
- // Click edit button
- cy.dataCy('edit-data-view').click();
-
- DataLakeUtils.addNewWidget();
-
- DataLakeUtils.selectDataSet('Persist');
-
- DataLakeUtils.dataConfigSelectAllFields();
-
- DataLakeUtils.selectVisualizationConfig();
-
- DataLakeUtils.selectVisualizationType('Table');
-
- DataLakeUtils.clickCreateButton();
-
- DataLakeUtils.selectTimeRange(
- new Date(2020, 10, 20, 22, 44),
- DataLakeUtils.getFutureDate(),
- );
-
- cy.dataCy('data-explorer-table-row', { timeout: 10000 }).should(
- 'have.length',
- 10,
- );
- // Validate that X lines are available
+ // Check if table is displayed correctly
+ cy.dataCy('data-explorer-table-row-timestamp', {
+ timeout: 10000,
+ }).should('have.length', 10);
});
});
diff --git a/ui/cypress/tests/datalake/widgets/timeSeriesSave.ts
b/ui/cypress/tests/datalake/widgets/timeSeriesSave.spec.ts
similarity index 78%
rename from ui/cypress/tests/datalake/widgets/timeSeriesSave.ts
rename to ui/cypress/tests/datalake/widgets/timeSeriesSave.spec.ts
index 846a3ec31..7be0a6660 100644
--- a/ui/cypress/tests/datalake/widgets/timeSeriesSave.ts
+++ b/ui/cypress/tests/datalake/widgets/timeSeriesSave.spec.ts
@@ -24,13 +24,11 @@ const dataSet = 'Persist';
describe('Test if widget configuration is updated correctly', () => {
beforeEach('Setup Test', () => {
- cy.initStreamPipesTest();
- DataLakeUtils.loadRandomDataSetIntoDataLake();
+ DataLakeUtils.initDataLakeTests();
// Create first test data view with one time series widget
DataLakeUtils.addDataViewAndTimeSeriesWidget(testView1, dataSet);
DataLakeUtils.saveDataExplorerWidgetConfiguration();
- // DataLakeUtils.clickStartTab();
// Create second test data view with one time series widget
DataLakeUtils.addDataViewAndTimeSeriesWidget(testView2, dataSet);
@@ -49,25 +47,28 @@ describe('Test if widget configuration is updated
correctly', () => {
});
const runTestCase = (editOption: boolean) => {
- // Go to test view 1 tab and then back to view 2
- DataLakeUtils.clickTab(testView1);
- DataLakeUtils.clickTab(testView2);
-
- // Change one setting in widget
- const widgetName = 'datalake_configuration';
+ // Visit settings of widget
+ const widgetName = 'prepared_data-time-series-chart';
if (editOption) {
- cy.dataCy('more-options-' + widgetName).click();
- cy.dataCy('start-edit-' + widgetName).click();
+ DataLakeUtils.startEditWidget(widgetName);
} else {
cy.dataCy('options-data-explorer').click();
cy.dataCy('options-edit-dashboard').click();
- cy.dataCy('edit-' + widgetName).click();
}
+ // Change first field from line plot to scatter plot
DataLakeUtils.selectVisualizationConfig();
cy.get('div').contains('Line').click();
cy.get('div').contains('Scatter').click();
- cy.get('path[class="scatterpts"]');
+ // Check if scatter plot is displayed
+ cy.get('g').should('have.class', 'scatterlayer mlayer');
+
+ // Change second field from line plot to bar plot
+ cy.get('div').contains('Line').click();
+ cy.get('div').contains('Bar').click();
+
+ // Check if bar plot is displayed
+ cy.get('g').should('have.class', 'barlayer mlayer');
};
diff --git
a/ui/src/app/data-explorer/components/time-selector/timeRangeSelector.component.html
b/ui/src/app/data-explorer/components/time-selector/timeRangeSelector.component.html
index d722812b7..1ce4b2df1 100644
---
a/ui/src/app/data-explorer/components/time-selector/timeRangeSelector.component.html
+++
b/ui/src/app/data-explorer/components/time-selector/timeRangeSelector.component.html
@@ -87,6 +87,7 @@
matTooltip="Reload"
matTooltipPosition="above"
(click)="reloadData()"
+ data-cy="reload-data-view-button"
>
<i class="material-icons mr-0">autorenew</i>
</button>
diff --git
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
index 82490189c..69a4463a7 100644
---
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
+++
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
@@ -70,7 +70,10 @@
*ngIf="!editMode"
[attr.data-cy]="
'more-options-' +
- configuredWidget.baseAppearanceConfig.widgetTitle
+
configuredWidget.baseAppearanceConfig.widgetTitle.replaceAll(
+ ' ',
+ ''
+ )
"
>
<mat-icon>more_vert</mat-icon>
@@ -86,7 +89,10 @@
*ngIf="hasDataExplorerWritePrivileges"
[attr.data-cy]="
'start-edit-' +
- configuredWidget.baseAppearanceConfig.widgetTitle
+
configuredWidget.baseAppearanceConfig.widgetTitle.replaceAll(
+ ' ',
+ ''
+ )
"
>
<mat-icon>edit</mat-icon>
diff --git
a/ui/src/app/data-explorer/components/widgets/indicator/config/indicator-chart-widget-config.component.html
b/ui/src/app/data-explorer/components/widgets/indicator/config/indicator-chart-widget-config.component.html
index c3c634e95..db188fea0 100644
---
a/ui/src/app/data-explorer/components/widgets/indicator/config/indicator-chart-widget-config.component.html
+++
b/ui/src/app/data-explorer/components/widgets/indicator/config/indicator-chart-widget-config.component.html
@@ -39,6 +39,7 @@
currentlyConfiguredWidget.visualizationConfig.deltaField
"
(changeSelectedProperty)="updateDelta($event)"
+ data-cy="data-explorer-select-delta-field"
>
</sp-select-property>
</div>
diff --git
a/ui/src/app/data-explorer/components/widgets/map/config/map-widget-config.component.html
b/ui/src/app/data-explorer/components/widgets/map/config/map-widget-config.component.html
index c6f16fb71..4c8601544 100644
---
a/ui/src/app/data-explorer/components/widgets/map/config/map-widget-config.component.html
+++
b/ui/src/app/data-explorer/components/widgets/map/config/map-widget-config.component.html
@@ -25,6 +25,7 @@
.selectedLatitudeProperty
"
(changeSelectedProperty)="setSelectedLatitudeProperty($event)"
+ data-cy="data-view-map-select-latitude"
>
</sp-select-property>
@@ -36,6 +37,7 @@
.selectedLongitudeProperty
"
(changeSelectedProperty)="setSelectedLongitudeProperty($event)"
+ data-cy="data-view-map-select-longitude"
>
</sp-select-property>
@@ -73,6 +75,7 @@
.selectedMarkerOrTrace
"
(selectionChange)="triggerViewRefresh()"
+ data-cy="data-view-map-select-marker-or-trace"
>
<mat-option [value]="'marker'">Marker</mat-option>
<mat-option [value]="'trace'">Trace</mat-option>
