diff --git a/cypress/elements/visualizationTypeSelector.js b/cypress/elements/visualizationTypeSelector.js index 6620e30e20..b97a32314a 100644 --- a/cypress/elements/visualizationTypeSelector.js +++ b/cypress/elements/visualizationTypeSelector.js @@ -10,6 +10,11 @@ export const changeVisType = (visTypeName) => { cy.getBySel(vstCardEl).contains(visTypeName).click() } +export const clickOpenAsMap = () => { + clickVisTypeSelector() + cy.getBySel(vstCardEl).contains('Open as Map').click() +} + export const expectVisTypeToBeValue = (value) => cy .getBySel(vstButtonTextEl) diff --git a/cypress/integration/openAsMap.cy.js b/cypress/integration/openAsMap.cy.js new file mode 100644 index 0000000000..a3173ad88f --- /dev/null +++ b/cypress/integration/openAsMap.cy.js @@ -0,0 +1,48 @@ +import { + expectAOTitleToBeValue, + expectVisualizationToBeVisible, +} from '../elements/chart.js' +import { openAOByName } from '../elements/fileMenu/open.js' +import { goToStartPage } from '../elements/startScreen.js' +import { clickOpenAsMap } from '../elements/visualizationTypeSelector.js' + +/* Duplicated from src instead of imported: importing app source pulls the + * React component and its CSS module into the Cypress browserify bundle, + * which cannot parse them */ +const MAPS_APP_URL = 'dhis-web-maps' +const USER_DATASTORE_CURRENT_AO_KEY = 'currentAnalyticalObject' + +describe('open as map', () => { + it('opens Maps in a new tab instead of navigating away', () => { + const pivotTableName = 'ANC: ANC 1 Visits Cumulative Numbers' + + /* Stub window.open so Cypress does not actually navigate to the + * Maps app in a new tab */ + const windowOpenStub = cy.stub().as('open') + cy.on('window:before:load', (win) => { + cy.stub(win, 'open').callsFake(windowOpenStub) + }) + + goToStartPage() + openAOByName(pivotTableName) + expectAOTitleToBeValue(pivotTableName) + expectVisualizationToBeVisible('PIVOT_TABLE') + + clickOpenAsMap() + + cy.get('@open').should('have.been.calledOnce') + cy.get('@open').should((stub) => { + const url = stub.getCall(0).args[0] + const target = stub.getCall(0).args[1] + const features = stub.getCall(0).args[2] + + expect(url).to.satisfy((url) => + url.endsWith( + `/${MAPS_APP_URL}/#/${USER_DATASTORE_CURRENT_AO_KEY}` + ) + ) + expect(target).to.equal('_blank') + expect(features).to.equal('noopener') + }) + }) +}) diff --git a/src/components/VisualizationTypeSelector/VisualizationTypeSelector.jsx b/src/components/VisualizationTypeSelector/VisualizationTypeSelector.jsx index e0ec9f9dfd..ffcfe27af5 100644 --- a/src/components/VisualizationTypeSelector/VisualizationTypeSelector.jsx +++ b/src/components/VisualizationTypeSelector/VisualizationTypeSelector.jsx @@ -64,9 +64,13 @@ const UnconnectedVisualizationTypeSelector = ({ ui ) - set(currentAnalyticalObject) + await set(currentAnalyticalObject) - window.location.href = `${baseUrl}/${MAPS_APP_URL}/#/${USER_DATASTORE_CURRENT_AO_KEY}` + window.open( + `${baseUrl}/${MAPS_APP_URL}/#/${USER_DATASTORE_CURRENT_AO_KEY}`, + '_blank', + 'noopener' + ) } const VisTypesList = (