You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ju...@apache.org on 2021/02/05 06:54:56 UTC
[superset] branch master updated: test: Added some Cypress tests
for Native Filters (#12180)
This is an automated email from the ASF dual-hosted git repository.
junlin pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 3235d91 test: Added some Cypress tests for Native Filters (#12180)
3235d91 is described below
commit 3235d918aad2e82be3d52aeb51955e3854a10764
Author: adam-stasiak-polidea <ad...@polidea.com>
AuthorDate: Fri Feb 5 07:54:00 2021 +0100
test: Added some Cypress tests for Native Filters (#12180)
---
.github/actions/cached-dependencies | 2 +-
.github/actions/comment-on-pr | 2 +-
.github/actions/pr-lint-action | 2 +-
.../integration/dashboard/nativeFilters.test.ts | 236 +++++++++++++++++++--
superset-frontend/src/components/Menu/NewMenu.tsx | 7 +-
.../components/nativeFilters/FilterBar.tsx | 10 +-
.../components/nativeFilters/FilterConfigForm.tsx | 14 +-
.../components/nativeFilters/FilterConfigModal.tsx | 18 +-
.../src/views/CRUD/chart/ChartList.tsx | 6 +-
9 files changed, 266 insertions(+), 31 deletions(-)
diff --git a/.github/actions/cached-dependencies b/.github/actions/cached-dependencies
index b90713b..064315d 160000
--- a/.github/actions/cached-dependencies
+++ b/.github/actions/cached-dependencies
@@ -1 +1 @@
-Subproject commit b90713be305978a582ff222db84f03262fce5416
+Subproject commit 064315d61e424e60d440fa77e8afda19cdd7211a
diff --git a/.github/actions/comment-on-pr b/.github/actions/comment-on-pr
index d1a1d5d..85a56be 160000
--- a/.github/actions/comment-on-pr
+++ b/.github/actions/comment-on-pr
@@ -1 +1 @@
-Subproject commit d1a1d5dd1eb1bb657a01f4d92dd5e4d5bb7857d3
+Subproject commit 85a56be792d927ac4bfa2f4326607d38e80e6e60
diff --git a/.github/actions/pr-lint-action b/.github/actions/pr-lint-action
index 94f62f9..a168917 160000
--- a/.github/actions/pr-lint-action
+++ b/.github/actions/pr-lint-action
@@ -1 +1 @@
-Subproject commit 94f62f917b004b40381177152360e8fff63dd6d9
+Subproject commit a168917ecac38f7b6f98401804e4e40f9f1bca8e
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts
index af70104..9665209 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts
@@ -16,43 +16,245 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { TABBED_DASHBOARD } from './dashboard.helper';
+import { CHART_LIST } from '../chart_list/chart_list.helper';
+import { DASHBOARD_LIST } from '../dashboard_list/dashboard_list.helper';
+const milliseconds = new Date().getTime();
+const dashboard = `Test Dashboard${milliseconds}`;
describe('Nativefilters', () => {
+ before(() => {
+ cy.login();
+ cy.visit(DASHBOARD_LIST);
+ cy.get('[data-test="new-dropdown"]').click();
+ cy.get('[data-test="menu-item-Dashboard"]').click({ force: true });
+ cy.get('[data-test="editable-title-input"]')
+ .click()
+ .clear()
+ .type(`${dashboard}{enter}`);
+ cy.get('[data-test="header-save-button"]').click();
+ cy.visit(CHART_LIST);
+ cy.get('[data-test="search-input"]').type('Treemap{enter}');
+ cy.get('[data-test="Treemap-list-chart-title"]')
+ .should('be.visible', { timeout: 5000 })
+ .click();
+ cy.get('[data-test="query-save-button"]').click();
+ cy.get('[data-test="save-chart-modal-select-dashboard-form"]')
+ .find('#dashboard-creatable-select')
+ .type(`${dashboard}{enter}{enter}`);
+ cy.get('[data-test="btn-modal-save"]').click();
+ });
beforeEach(() => {
cy.login();
- cy.visit(TABBED_DASHBOARD);
+ cy.visit(DASHBOARD_LIST);
+ cy.get('[data-test="search-input"]').click().type(`${dashboard}{enter}`);
+ cy.contains('[data-test="cell-text"]', `${dashboard}`).click();
});
+
it('should show filter bar and allow user to create filters ', () => {
cy.get('[data-test="filter-bar"]').should('be.visible');
cy.get('[data-test="collapse"]').click();
cy.get('[data-test="create-filter"]').click();
cy.get('.ant-modal').should('be.visible');
- cy.get('.ant-form-vertical').find('.ant-tabs-nav-add').first().click();
-
cy.get('.ant-modal')
- .find('.ant-tabs-tab-btn')
- .first()
- .click({ force: true })
- .type('TEST_Filter');
+ .find('[data-test="name-input"]')
+ .click()
+ .type('Country name');
- cy.get('.ant-modal').find('[data-test="datasource-input"]').first().click();
+ cy.get('.ant-modal').find('[data-test="datasource-input"]').click();
cy.get('[data-test="datasource-input"]')
.contains('wb_health_population')
.click();
- // possible bug with cypress where it is having issue discovering the field input
- // after it is enabled
-
- /* cy.get('.ant-modal')
+ // hack for unclickable country_name
+ cy.get('.ant-modal').find('[data-test="field-input"]').type('country_name');
+ cy.get('.ant-modal')
.find('[data-test="field-input"]')
- .click()
- .contains('country_name')
+ .type('{downarrow}{downarrow}{enter}');
+ cy.get('[data-test="apply-changes-instantly-checkbox"]').check();
+ cy.get('.ant-modal-footer')
+ .find('[data-test="native-filter-modal-save-button"]')
+ .should('be.visible')
.click();
- */
+ });
+
+ it('should show newly added filter in filter bar menu', () => {
+ cy.get('[data-test="filter-bar"]').should('be.visible');
+ cy.get('[data-test="filter-control-name"]').should('be.visible');
+ cy.get('[data-test="form-item-value"]').should('be.visible');
+ });
+ it('should filter dashboard with selected filter value', () => {
+ cy.get('[data-test="form-item-value"]').should('be.visible').click();
+ cy.get('.ant-select-selection-search').type('Hong Kong{enter}');
+ cy.get('[data-test="filter-apply-button"]').click();
+ cy.get('.treemap').within(() => {
+ cy.contains('HKG').should('be.visible');
+ cy.contains('USA').should('not.exist');
+ });
+ });
+ it('default value is respected after revisit', () => {
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').should('be.visible');
+ cy.get('[data-test="default-input"]').click();
+ cy.get('.ant-modal').find('[data-test="default-input"]').type('Sweden');
+ cy.get('.ant-modal')
+ .find('[data-test="default-input"]')
+ .type('{downarrow}{downarrow}{enter}');
+ cy.get('[data-test="native-filter-modal-save-button"]')
+ .should('be.visible')
+ .click();
+ cy.visit(DASHBOARD_LIST);
+ cy.get('[data-test="search-input"]').click().type(`${dashboard}{enter}`);
+ cy.contains('[data-test="cell-text"]', `${dashboard}`).click();
+ cy.get('.treemap').within(() => {
+ cy.contains('SWE').should('be.visible');
+ cy.contains('USA').should('not.exist');
+ });
+ cy.contains('Sweden');
+ });
+ it('should allow for deleted filter restore', () => {
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').should('be.visible');
+ cy.get('.ant-tabs-nav-list').within(() => {
+ cy.get('.ant-tabs-tab-remove').click();
+ });
+
+ cy.get('[data-test="undo-button"]').should('be.visible').click();
+ cy.get('.ant-tabs-nav-list').within(() => {
+ cy.get('.ant-tabs-tab-remove').click();
+ });
+ cy.get('[data-test="restore-filter-button"]').should('be.visible').click();
+ });
+
+ it('should stop filtering when filter is removed', () => {
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').should('be.visible');
+ cy.get('.ant-tabs-nav-list').within(() => {
+ cy.get('.ant-tabs-tab-remove').click();
+ });
+ cy.get('.ant-modal-footer')
+ .find('[data-test="native-filter-modal-save-button"]')
+ .should('be.visible')
+ .click();
+ cy.get('.treemap').within(() => {
+ cy.contains('HKG').should('be.visible');
+ cy.contains('USA').should('be.visible');
+ });
+ });
+ describe('Parent Filters', () => {
+ it('should allow for creating parent filters ', () => {
+ cy.get('[data-test="filter-bar"]').should('be.visible');
+ cy.get('[data-test="collapse"]').click();
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').should('be.visible');
+
+ cy.get('.ant-modal')
+ .find('[data-test="name-input"]')
+ .click()
+ .type('Country name');
+
+ cy.get('.ant-modal').find('[data-test="datasource-input"]').click();
+
+ cy.get('[data-test="datasource-input"]')
+ .contains('wb_health_population')
+ .click();
+
+ // hack for unclickable country_name
+ cy.get('.ant-modal')
+ .find('[data-test="field-input"]')
+ .type('country_name');
+ cy.get('.ant-modal')
+ .find('[data-test="field-input"]')
+ .type('{downarrow}{downarrow}{enter}');
+ cy.get('[data-test="apply-changes-instantly-checkbox"]').check();
+ cy.get('.ant-modal-footer')
+ .find('[data-test="native-filter-modal-save-button"]')
+ .should('be.visible')
+ .click();
+
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').first().should('be.visible');
+ cy.get('[data-test=add-filter-button]').first().click();
+
+ cy.get('.ant-modal')
+ .find('[data-test="name-input"]')
+ .last()
+ .click()
+ .type('Region Name');
+
+ cy.get('.ant-modal')
+ .find('[data-test="datasource-input"]')
+ .last()
+ .click();
+
+ cy.get('[data-test="datasource-input"]')
+ .last()
+ .contains('wb_health_population')
+ .click();
+
+ // hack for unclickable country_name
+ cy.get('.ant-modal')
+ .find('[data-test="field-input"]')
+ .last()
+ .type('region');
+ cy.get('.ant-modal')
+ .find('[data-test="field-input"]')
+ .last()
+ .type('{downarrow}{downarrow}{downarrow}{downarrow}{enter}');
+
+ cy.get('[data-test="apply-changes-instantly-checkbox"]').last().check();
+ cy.get('.ant-modal')
+ .find('[data-test="parent-filter-input"]')
+ .last()
+ .type('{downarrow}{enter}');
+
+ cy.get('.ant-modal-footer')
+ .find('[data-test="native-filter-modal-save-button"]')
+ .first()
+ .should('be.visible')
+ .click();
+ cy.get('[data-test="filter-icon"]').should('be.visible');
+ });
+ it('should parent filter be working', () => {
+ cy.get('.treemap').within(() => {
+ cy.contains('SMR').should('be.visible');
+ cy.contains('Europe & Central Asia').should('be.visible');
+ cy.contains('South Asia').should('be.visible');
+ });
+
+ cy.get('[data-test="form-item-value"]').should('be.visible').click();
+ cy.get('.ant-popover-inner-content').within(() => {
+ cy.get('[data-test="form-item-value"]')
+ .should('be.visible')
+ .first()
+ .type('San Marino{enter}');
+ cy.get('[data-test="form-item-value"]')
+ .should('be.visible')
+ .last()
+ .type('Europe & Central Asia{enter}');
+ });
+ cy.get('.treemap').within(() => {
+ cy.contains('SMR').should('be.visible');
+ cy.contains('Europe & Central Asia').should('be.visible');
+ cy.contains('South Asia').should('not.exist');
+ });
+ });
- cy.get('.ant-modal-footer').find('button').should('be.visible');
+ it('should stop filtering when parent filter is removed', () => {
+ cy.get('[data-test="create-filter"]').click();
+ cy.get('.ant-modal').should('be.visible');
+ cy.get('.ant-tabs-nav-list').within(() => {
+ cy.get('.ant-tabs-tab-remove').click({ multiple: true });
+ });
+ cy.get('.ant-modal-footer')
+ .find('[data-test="native-filter-modal-save-button"]')
+ .should('be.visible')
+ .click();
+ cy.get('.treemap').within(() => {
+ cy.contains('HKG').should('be.visible');
+ cy.contains('USA').should('be.visible');
+ });
+ });
});
});
diff --git a/superset-frontend/src/components/Menu/NewMenu.tsx b/superset-frontend/src/components/Menu/NewMenu.tsx
index d13ed1a..b2aa9b2 100644
--- a/superset-frontend/src/components/Menu/NewMenu.tsx
+++ b/superset-frontend/src/components/Menu/NewMenu.tsx
@@ -48,6 +48,7 @@ export default function NewMenu() {
return (
<NavDropdown
id="new-dropdown"
+ data-test="new-dropdown"
title={<StyledI className="fa fa-plus" />}
onMouseEnter={() => setDropdownOpen(true)}
onMouseLeave={() => setDropdownOpen(false)}
@@ -58,7 +59,11 @@ export default function NewMenu() {
{dropdownItems.map((menu, i) => (
<Menu.Item key={i}>
<a href={menu.url}>
- <i className={`fa ${menu.icon}`} /> {menu.label}
+ <i
+ data-test={`menu-item-${menu.label}`}
+ className={`fa ${menu.icon}`}
+ />{' '}
+ {menu.label}
</a>
</Menu.Item>
))}
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar.tsx
index e7ad83f..9f1f46b 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar.tsx
@@ -306,7 +306,7 @@ const FilterValue: React.FC<FilterProps> = ({
}
return (
- <FilterItem>
+ <FilterItem data-test="form-item-value">
<SuperChart
height={20}
width={220}
@@ -330,8 +330,10 @@ export const FilterControl: React.FC<FilterProps> = ({
return (
<StyledFilterControlContainer>
<StyledFilterControlTitleBox>
- <StyledFilterControlTitle>{name}</StyledFilterControlTitle>
- <div>{icon}</div>
+ <StyledFilterControlTitle data-test="filter-control-name">
+ {name}
+ </StyledFilterControlTitle>
+ <div data-test="filter-icon">{icon}</div>
</StyledFilterControlTitleBox>
<FilterValue
filter={filter}
@@ -489,6 +491,7 @@ const FilterBar: React.FC<FiltersBarProps> = ({
buttonStyle="secondary"
buttonSize="small"
onClick={handleResetAll}
+ data-test="filter-reset-button"
>
{t('Reset all')}
</Button>
@@ -497,6 +500,7 @@ const FilterBar: React.FC<FiltersBarProps> = ({
htmlType="submit"
buttonSize="small"
onClick={handleApply}
+ data-test="filter-apply-button"
>
{t('Apply')}
</Button>
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigForm.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigForm.tsx
index 82269d0..6011975 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigForm.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigForm.tsx
@@ -137,8 +137,12 @@ export const FilterConfigForm: React.FC<FilterConfigFormProps> = ({
<RemovedContent>
<p>{t('You have removed this filter.')}</p>
<div>
- <Button type="primary" onClick={() => restore(filterId)}>
- {t('Restore filter')}
+ <Button
+ data-test="restore-filter-button"
+ type="primary"
+ onClick={() => restore(filterId)}
+ >
+ {t('Restore Filter')}
</Button>
</div>
</RemovedContent>
@@ -241,6 +245,7 @@ export const FilterConfigForm: React.FC<FilterConfigFormProps> = ({
<StyledFormItem
name={['filters', filterId, 'defaultValue']}
initialValue={filterToEdit?.defaultValue}
+ data-test="default-input"
label={<StyledLabel>{t('Default Value')}</StyledLabel>}
>
{formFilter?.dataset &&
@@ -270,6 +275,7 @@ export const FilterConfigForm: React.FC<FilterConfigFormProps> = ({
initialValue={parentFilterOptions.find(
({ value }) => value === filterToEdit?.cascadeParentIds[0],
)}
+ data-test="parent-filter-input"
>
<Select
placeholder={t('None')}
@@ -283,7 +289,9 @@ export const FilterConfigForm: React.FC<FilterConfigFormProps> = ({
valuePropName="checked"
colon={false}
>
- <Checkbox>{t('Apply changes instantly')}</Checkbox>
+ <Checkbox data-test="apply-changes-instantly-checkbox">
+ {t('Apply changes instantly')}
+ </Checkbox>
</StyledCheckboxFormItem>
<StyledCheckboxFormItem
name={['filters', filterId, 'allowsMultipleValues']}
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigModal.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigModal.tsx
index 0017bae..10dfc5a 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigModal.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterConfigModal.tsx
@@ -483,10 +483,20 @@ export function FilterConfigModal({
}
return [
- <Button key="cancel" buttonStyle="secondary" onClick={handleCancel}>
+ <Button
+ key="cancel"
+ buttonStyle="secondary"
+ data-test="native-filter-modal-cancel-button"
+ onClick={handleCancel}
+ >
{t('Cancel')}
</Button>,
- <Button key="submit" buttonStyle="primary" onClick={onOk}>
+ <Button
+ key="submit"
+ buttonStyle="primary"
+ onClick={onOk}
+ data-test="native-filter-modal-save-button"
+ >
{t('Save')}
</Button>,
];
@@ -530,7 +540,8 @@ export function FilterConfigModal({
onEdit={onTabEdit}
addIcon={
<StyledAddFilterBox>
- <PlusOutlined /> <span>{t('Add filter')}</span>
+ <PlusOutlined />{' '}
+ <span data-test="add-filter-button">{t('Add filter')}</span>
</StyledAddFilterBox>
}
>
@@ -548,6 +559,7 @@ export function FilterConfigModal({
{removedFilters[id] && (
<StyledSpan
role="button"
+ data-test="undo-button"
tabIndex={0}
onClick={() => restoreFilter(id)}
>
diff --git a/superset-frontend/src/views/CRUD/chart/ChartList.tsx b/superset-frontend/src/views/CRUD/chart/ChartList.tsx
index 2148fc0..7db24ea 100644
--- a/superset-frontend/src/views/CRUD/chart/ChartList.tsx
+++ b/superset-frontend/src/views/CRUD/chart/ChartList.tsx
@@ -207,7 +207,11 @@ function ChartList(props: ChartListProps) {
row: {
original: { url, slice_name: sliceName },
},
- }: any) => <a href={url}>{sliceName}</a>,
+ }: any) => (
+ <a href={url} data-test={`${sliceName}-list-chart-title`}>
+ {sliceName}
+ </a>
+ ),
Header: t('Chart'),
accessor: 'slice_name',
},