diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 767c25de7b..134cdef559 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -805,7 +805,7 @@ npm install npm run cypress-run-chrome # run tests from a specific file -npm run cypress-run-chrome -- --spec cypress/integration/explore/link.test.js +npm run cypress-run-chrome -- --spec cypress/integration/explore/link.test.ts # run specific file with video capture npm run cypress-run-chrome -- --spec cypress/integration/dashboard/index.test.js --config video=true 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 77449a2b8d..5d18c355ed 100644 --- a/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts @@ -40,8 +40,8 @@ xdescribe('Nativefilters', () => { .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}`); + .find('input[aria-label="Select a dashboard"]') + .type(`${dashboard}`, { force: true }); cy.get('[data-test="btn-modal-save"]').click(); }); beforeEach(() => { diff --git a/superset-frontend/cypress-base/cypress/integration/explore/link.test.ts b/superset-frontend/cypress-base/cypress/integration/explore/link.test.ts index cab2074625..e671c57996 100644 --- a/superset-frontend/cypress-base/cypress/integration/explore/link.test.ts +++ b/superset-frontend/cypress-base/cypress/integration/explore/link.test.ts @@ -126,8 +126,12 @@ describe('Test explore links', () => { cy.get('[data-test="new-chart-name"]').click().clear().type(newChartName); // Add a new option using the "CreatableSelect" feature cy.get('[data-test="save-chart-modal-select-dashboard-form"]') - .find('#dashboard-creatable-select') - .type(`${dashboardTitle}{enter}{enter}`); + .find('input[aria-label="Select a dashboard"]') + .type(`${dashboardTitle}`, { force: true }); + + cy.get(`.ant-select-item[label="${dashboardTitle}"]`).click({ + force: true, + }); cy.get('[data-test="btn-modal-save"]').click(); cy.verifySliceSuccess({ waitAlias: '@chartData' }); @@ -153,8 +157,12 @@ describe('Test explore links', () => { // This time around, typing the same dashboard name // will select the existing one cy.get('[data-test="save-chart-modal-select-dashboard-form"]') - .find('#dashboard-creatable-select') - .type(`${dashboardTitle}{enter}{enter}`); + .find('input[aria-label="Select a dashboard"]') + .type(`${dashboardTitle}{enter}`, { force: true }); + + cy.get(`.ant-select-item[label="${dashboardTitle}"]`).click({ + force: true, + }); cy.get('[data-test="btn-modal-save"]').click(); cy.verifySliceSuccess({ waitAlias: '@chartData' }); diff --git a/superset-frontend/spec/javascripts/explore/components/SaveModal_spec.jsx b/superset-frontend/spec/javascripts/explore/components/SaveModal_spec.jsx index b9d87eea6e..8d431da973 100644 --- a/superset-frontend/spec/javascripts/explore/components/SaveModal_spec.jsx +++ b/superset-frontend/spec/javascripts/explore/components/SaveModal_spec.jsx @@ -142,12 +142,13 @@ describe('SaveModal', () => { it('onChange', () => { const wrapper = getWrapper(); + const dashboardId = mockEvent.value; wrapper.instance().onSliceNameChange(mockEvent); expect(wrapper.state().newSliceName).toBe(mockEvent.target.value); - wrapper.instance().onDashboardSelectChange(mockEvent); - expect(wrapper.state().saveToDashboardId).toBe(mockEvent.value); + wrapper.instance().onDashboardSelectChange(dashboardId); + expect(wrapper.state().saveToDashboardId).toBe(dashboardId); }); describe('saveOrOverwrite', () => { diff --git a/superset-frontend/src/explore/components/SaveModal.tsx b/superset-frontend/src/explore/components/SaveModal.tsx index e73a118ae4..f54b274c79 100644 --- a/superset-frontend/src/explore/components/SaveModal.tsx +++ b/superset-frontend/src/explore/components/SaveModal.tsx @@ -26,7 +26,8 @@ import ReactMarkdown from 'react-markdown'; import Modal from 'src/components/Modal'; import { Radio } from 'src/components/Radio'; import Button from 'src/components/Button'; -import { CreatableSelect } from 'src/components/Select'; +import { Select } from 'src/components'; +import { SelectValue } from 'antd/lib/select'; import { connect } from 'react-redux'; // Session storage key for recent dashboard @@ -108,10 +109,10 @@ class SaveModal extends React.Component { this.setState({ newSliceName: event.target.value }); } - onDashboardSelectChange(event: Record) { - const newDashboardName = event ? event.label : null; + onDashboardSelectChange(selected: SelectValue) { + const newDashboardName = selected ? String(selected) : undefined; const saveToDashboardId = - event && typeof event.value === 'number' ? event.value : null; + selected && typeof selected === 'number' ? selected : null; this.setState({ saveToDashboardId, newDashboardName }); } @@ -163,9 +164,6 @@ class SaveModal extends React.Component { render() { const dashboardSelectValue = this.state.saveToDashboardId || this.state.newDashboardName; - const valueObj = dashboardSelectValue - ? { value: dashboardSelectValue } - : null; return ( { label={t('Add to dashboard')} data-test="save-chart-modal-select-dashboard-form" > -