test(native filter): add test for time range filter (#18647)

* add native filter test for time range filter

superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts

@@ -298,12 +298,69 @@ describe('Nativefilters Sanity test', () => {
       .trigger('mouseover', { force: true });
     cy.contains('Exclude selected values');
   });
+  it('User can create a time range filter', () => {
+    cy.get(nativeFilters.filterFromDashboardView.expand).click({ force: true });
+    cy.get(nativeFilters.filterFromDashboardView.createFilterButton)
+      .should('be.visible')
+      .click();
+    cy.get(nativeFilters.filtersPanel.filterTypeInput)
+      .find(nativeFilters.filtersPanel.filterTypeItem)
+      .click({ force: true });
+    cy.get('[label="Time range"]').click();
+    cy.get(nativeFilters.modal.container)
+      .find(nativeFilters.filtersPanel.filterName)
+      .click()
+      .clear()
+      .type('time range');
+    cy.get(nativeFilters.modal.footer)
+      .contains('Save')
+      .should('be.visible')
+      .click();
+    cy.intercept(`/api/v1/chart/data?form_data=**`).as('chart');
+    cy.get(dashboardView.salesDashboardSpecific.vehicleSalesFilterTimeRange)
+      .should('be.visible')
+      .click();
+    cy.get('.control-label').contains('RANGE TYPE').should('be.visible');
+    cy.get('.ant-popover-content .ant-select-selector')
+      .should('be.visible')
+      .click();
+    cy.get('[label="Advanced"]').should('be.visible').click();
+    cy.get('.section-title')
+      .contains('Advanced Time Range')
+      .should('be.visible');
+    cy.get('.ant-popover-inner-content')
+      .find('[class^=ant-input]')
+      .first()
+      .type('2005-12-17');
+    cy.get(dashboardView.timeRangeModal.applyButton).click();
+    cy.get(nativeFilters.applyFilter).click();
+    cy.wait('@chart');
+    cy.url().then(u => {
+      const ur = new URL(u);
+      expect(ur.search).to.include('native_filters');
+    });
+    cy.get(nativeFilters.filterFromDashboardView.filterName)
+      .contains('time range')
+      .should('be.visible');
+    cy.get(nativeFilters.filterFromDashboardView.timeRangeFilterContent)
+      .contains('2005-12-17')
+      .should('be.visible');
+  });
   it("User can check 'Filter has default value'", () => {
     cy.get(nativeFilters.filterFromDashboardView.expand).click({ force: true });
     cy.get(nativeFilters.createFilterButton)
       .should('be.visible')
       .click({ force: true });
     cy.get(nativeFilters.modal.container).should('be.visible');
+    cy.get(nativeFilters.filtersPanel.filterTypeInput)
+      .find(nativeFilters.filtersPanel.filterTypeItem)
+      .click({ force: true });
+    cy.get('[label="Value"]').click();
+    cy.get(nativeFilters.modal.container)
+      .find(nativeFilters.filtersPanel.filterName)
+      .click({ force: true })
+      .clear()
+      .type('country_name');
 
     cy.get(nativeFilters.modal.container)
       .find(nativeFilters.filtersPanel.datasetName)
@@ -311,10 +368,6 @@ describe('Nativefilters Sanity test', () => {
       .within(() =>
         cy.get('input').type('wb_health_population{enter}', { force: true }),
       );
-    cy.get(nativeFilters.modal.container)
-      .find(nativeFilters.filtersPanel.filterName)
-      .click({ force: true })
-      .type('country_name');
     // hack for unclickable datetime
     cy.wait(5000);
     cy.get(nativeFilters.filtersPanel.filterInfoInput)

superset-frontend/cypress-base/cypress/support/directories.ts

@@ -335,15 +335,20 @@ export const nativeFilters = {
     columnEmptyInput: '.ant-select-selection-placeholder',
     filterTypeInput: dataTestLocator('filters-config-modal__filter-type'),
     fieldInput: dataTestLocator('field-input'),
+    filterTypeItem: '.ant-select-selection-item',
   },
   filterFromDashboardView: {
+    filterValueInput: '[class="ant-select-selection-search-input"]',
     expand: dataTestLocator('filter-bar__expand-button'),
     collapse: dataTestLocator('filter-bar__collapse-button'),
     filterName: dataTestLocator('filter-control-name'),
     filterContent: '.ant-select-selection-item-content',
+    createFilterButton: dataTestLocator('create-filter'),
+    timeRangeFilterContent: dataTestLocator('time-range-trigger'),
   },
   createFilterButton: dataTestLocator('filter-bar__create-filter'),
   removeFilter: '[aria-label="remove"]',
+  silentLoading: '.loading inline-centered css-101mkpk',
   filterConfigurationSections: {
     collapseExpandButton: '.ant-collapse-arrow',
     checkedCheckbox: '.ant-checkbox-wrapper-checked',
@@ -467,6 +472,7 @@ export const exploreView = {
     saveButton: dataTestLocator('btn-modal-save'),
     saveAsCircle: dataTestLocator('saveas-radio'),
     overwriteCircle: dataTestLocator('save-overwrite-radio'),
+    saveAndGoToDashboard: '#btn_modal_save_goto_dash',
   },
   controlPanel: {
     panel: dataTestLocator('control-tabs'),