chore: cypress selectors refactor in explore module (#11309)

* cypress selectors refactor in explore module

* added delay to typing to make test more stable

* fixed missing click
This commit is contained in:
adam-stasiak-polidea 2020-10-27 21:01:45 +01:00 committed by GitHub
parent 4bebf51453
commit a99d795eaf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 45 additions and 46 deletions

View File

@ -73,9 +73,10 @@ describe('AdhocFilters', () => {
.click(); .click();
cy.get('[data-test=adhoc_filters] input[type=text]') cy.get('[data-test=adhoc_filters] input[type=text]')
.focus() .focus()
.type('name{enter}'); .type('name{enter}', { delay: 20 });
cy.get('.adhoc-filter-option').click(); cy.get('[data-test="adhoc_filters"]').within(() => {
cy.contains('name = ').should('be.visible').click();
});
cy.wait('@filterValues'); cy.wait('@filterValues');
cy.get('#filter-edit-popover #adhoc-filter-edit-tabs-tab-SQL').click(); cy.get('#filter-edit-popover #adhoc-filter-edit-tabs-tab-SQL').click();

View File

@ -46,18 +46,20 @@ describe('Datasource control', () => {
cy.get('script').then(nodes => { cy.get('script').then(nodes => {
expect(nodes.length).to.greaterThan(numScripts); expect(nodes.length).to.greaterThan(numScripts);
}); });
cy.get('[data-test="edit-dataset-tabs"]').within(() => {
// create new metric cy.contains('Metrics').click();
cy.get('.modal-content').within(() => {
cy.get('a[role="tab"]').contains('Metrics').click();
}); });
cy.get('button').contains('Add Item', { timeout: 10000 }).click(); // create new metric
cy.get('input[value="<new metric>"]').click(); cy.get('[data-test="crud-add-table-item"]', { timeout: 10000 }).click();
cy.get('input[value="<new metric>"]') cy.get('[data-test="table-content-rows"]')
.find('input[value="<new metric>"]')
.click();
cy.get('[data-test="table-content-rows"]')
.find('input[value="<new metric>"]')
.focus() .focus()
.clear() .clear()
.type(`${newMetricName}{enter}`); .type(`${newMetricName}{enter}`);
cy.get('.modal-footer button').contains('Save').click(); cy.get('[data-test="datasource-modal-save"]').click();
cy.get('.modal-footer button').contains('OK').click(); cy.get('.modal-footer button').contains('OK').click();
// select new metric // select new metric
cy.get('[data-test=metrics]') cy.get('[data-test=metrics]')
@ -74,7 +76,7 @@ describe('Datasource control', () => {
.closest('tr') .closest('tr')
.find('.fa-trash') .find('.fa-trash')
.click(); .click();
cy.get('.modal-footer button').contains('Save').click(); cy.get('[data-test="datasource-modal-save"]').click();
cy.get('.modal-footer button').contains('OK').click(); cy.get('.modal-footer button').contains('OK').click();
cy.get('.Select__multi-value__label') cy.get('.Select__multi-value__label')
.contains(newMetricName) .contains(newMetricName)

View File

@ -91,21 +91,17 @@ describe('Test explore links', () => {
cy.visitChartByParams(JSON.stringify(formData)); cy.visitChartByParams(JSON.stringify(formData));
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
cy.url().then(() => { cy.url().then(() => {
cy.get('button[data-target="#save_modal"]').click(); cy.get('[data-test="query-save-button"]').click();
cy.get('.modal-content').within(() => { cy.get('[data-test="saveas-radio"]').check();
cy.get('#saveas-radio').check(); cy.get('[data-test="new-chart-name"]').type(newChartName);
cy.get('input[name=new_slice_name]').type(newChartName); cy.get('[data-test="btn-modal-save"]').click();
cy.get('button#btn_modal_save').click();
});
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
cy.visitChartByName(newChartName); cy.visitChartByName(newChartName);
// Overwriting! // Overwriting!
cy.get('button[data-target="#save_modal"]').click(); cy.get('[data-test="query-save-button"]').click();
cy.get('.modal-content').within(() => { cy.get('[data-test="save-overwrite-radio"]').check();
cy.get('#overwrite-radio').check(); cy.get('[data-test="btn-modal-save"]').click();
cy.get('button#btn_modal_save').click();
});
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
const query = { const query = {
filters: [ filters: [
@ -131,16 +127,15 @@ describe('Test explore links', () => {
cy.visitChartByName(chartName); cy.visitChartByName(chartName);
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
cy.get('button[data-target="#save_modal"]').click(); cy.get('[data-test="query-save-button"]').click();
cy.get('.modal-content').within(() => { cy.get('[data-test="saveas-radio"]').check();
cy.get('#saveas-radio').check(); cy.get('[data-test="new-chart-name"]').click().clear().type(newChartName);
cy.get('input[name=new_slice_name]').click().clear().type(newChartName); // Add a new option using the "CreatableSelect" feature
// Add a new option using the "CreatableSelect" feature cy.get('[data-test="save-chart-modal-select-dashboard-form"]')
cy.get('#dashboard-creatable-select').type( .find('#dashboard-creatable-select')
`${dashboardTitle}{enter}{enter}`, .type(`${dashboardTitle}{enter}{enter}`);
);
cy.get('button#btn_modal_save').click(); cy.get('[data-test="btn-modal-save"]').click();
});
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
let query = { let query = {
filters: [ filters: [
@ -158,17 +153,16 @@ describe('Test explore links', () => {
cy.visitChartByName(newChartName); cy.visitChartByName(newChartName);
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
cy.get('button[data-target="#save_modal"]').click(); cy.get('[data-test="query-save-button"]').click();
cy.get('.modal-content').within(() => { cy.get('[data-test="save-overwrite-radio"]').check();
cy.get('#overwrite-radio').check(); cy.get('[data-test="new-chart-name"]').click().clear().type(newChartName);
cy.get('input[name=new_slice_name]').click().clear().type(newChartName); // This time around, typing the same dashboard name
// This time around, typing the same dashboard name // will select the existing one
// will select the existing one cy.get('[data-test="save-chart-modal-select-dashboard-form"]')
cy.get('#dashboard-creatable-select').type( .find('#dashboard-creatable-select')
`${dashboardTitle}{enter}{enter}`, .type(`${dashboardTitle}{enter}{enter}`);
);
cy.get('button#btn_modal_save').click(); cy.get('[data-test="btn-modal-save"]').click();
});
cy.verifySliceSuccess({ waitAlias: '@postJson' }); cy.verifySliceSuccess({ waitAlias: '@postJson' });
query = { query = {
filters: [ filters: [

View File

@ -290,7 +290,8 @@ export default class CRUDCollection extends React.PureComponent<
onClick={this.onAddItem} onClick={this.onAddItem}
data-test="add-item-button" data-test="add-item-button"
> >
<i className="fa fa-plus" /> {t('Add Item')} <i data-test="crud-add-table-item" className="fa fa-plus" />{' '}
{t('Add Item')}
</Button> </Button>
)} )}
</span> </span>

View File

@ -887,6 +887,7 @@ class DatasourceEditor extends React.PureComponent {
</div> </div>
<Tabs <Tabs
id="table-tabs" id="table-tabs"
data-test="edit-dataset-tabs"
onSelect={this.handleTabSelect} onSelect={this.handleTabSelect}
defaultActiveKey={activeTabKey} defaultActiveKey={activeTabKey}
> >

View File

@ -185,7 +185,7 @@ class SaveModal extends React.Component {
data-test="new-chart-name" data-test="new-chart-name"
/> />
</FormGroup> </FormGroup>
<FormGroup> <FormGroup data-test="save-chart-modal-select-dashboard-form">
<FormLabel required>{t('Add to dashboard')}</FormLabel> <FormLabel required>{t('Add to dashboard')}</FormLabel>
<CreatableSelect <CreatableSelect
id="dashboard-creatable-select" id="dashboard-creatable-select"