Skip to content

Commit

Permalink
ODC-5577:Topology chart view automation
Browse files Browse the repository at this point in the history
  • Loading branch information
sanketpathak committed Jul 7, 2021
1 parent 06715e7 commit 4312fa3
Show file tree
Hide file tree
Showing 11 changed files with 201 additions and 28 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,8 @@ export const gitPage = {
.should('not.be.empty');
cy.get('#form-input-application-name-field')
.clear()
.should('not.have.value');
cy.get('#form-input-application-name-field')
.type(appName)
.should('have.value', appName);
cy.log(`Application Name "${appName}" is created`);
Expand Down Expand Up @@ -109,6 +111,9 @@ export const gitPage = {
break;
case 'deployment config':
case 'Deployment Config':
case 'deployment-config':
case 'Deployment-Config':
case 'DeploymentConfig':
cy.get(gitPO.resources.deploymentConfig)
.scrollIntoView()
.check();
Expand Down Expand Up @@ -231,11 +236,7 @@ export const gitPage = {
verifyValidatedMessage: (gitUrl = 'https://github.com/sclorg/nodejs-ex.git') => {
cy.get(gitPO.gitSection.validatedMessage).should('not.have.text', 'Validating...');
cy.get('body').then(($body) => {
if (
$body.text().includes(messages.addFlow.privateGitRepoMessage) ||
$body.text().includes(messages.addFlow.rateLimitExceeded) ||
$body.find('[aria-label="Warning Alert"]').length
) {
if ($body.text().includes(messages.addFlow.rateLimitExceeded)) {
gitPage.selectBuilderImageForGitUrl(gitUrl);
}
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export const createGitWorkload = (
addPage.selectCardFromOptions(addOptions.Git);
gitPage.enterGitUrl(gitUrl);
gitPage.verifyValidatedMessage();
gitPage.selectBuilderImageForGitUrl(gitUrl);
gitPage.enterAppName(appName);
gitPage.enterComponentName(componentName);
gitPage.selectResource(resourceType);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,32 +7,33 @@ Feature: Topology chart area
And user has created or selected namespace "aut-topology-delete-workload"


@smoke @to-do
@smoke
Scenario: Empty state of topology: T-06-TC01
When user navigates to Topology page
Then user sees Topology page with message "No resources found"


@regression @to-do
@regression
Scenario: Navigate to Add page from Empty state of topology: T-06-TC02
Given user is at the Topology page
When user clicks on "Add page" link in the topology page
Then user will be redirected too Add page
Then user will be redirected to Add page


@regression @to-do
@regression
Scenario: Add to project option in Empty state of topology: T-06-TC03
Given user is at the Topology page
When user clicks on "Start building your application" link in the topology page
Then user will be able to see Add to project search bar


@smoke @to-do
@smoke
Scenario: Topology with workloads: T-06-TC04
Given user has created a workload named "nodejs-ex-git"
And user has created knative workload "nodejs-ex-git-1"
Given user has created a deployment workload named "nodejs-ex-git-1"
And user has created deployment config workload "nodejs-ex-git-2"
When user navigates to Topology page
Then user sees different workloads in topology chart area
Then user sees "nodejs-ex-git-1" and "nodejs-ex-git-2" workloads in topology chart area



@regression @manual
Expand Down Expand Up @@ -134,16 +135,15 @@ Feature: Topology chart area
Then user sees the chart area is reset to original


@regression @to-do
@regression
Scenario: Topology filter by resource: T-06-TC14
Given user created two workloads with resource type "Deployment" and "Deployment-Config"
Given user created "Deployment" workload
And user created "DeploymentConfig" workload
When user is at Topology page chart view
And user clicks the filter by resource on top
And user will see "Deployment" and "Deployment-Config" options with '1' associated with it
And user clicks on Deployment
And user can see only the deployment workload
And user clicks on Deployment-Config
Then user can see only the deployment-config workload
Then user will see "Deployment" and "DeploymentConfig" options
And user can see only the "Deployment" workload when Deployment option is selected
And user can see only the "Deployment Config" workload when Deployment-Config option is selected


@regression @to-do
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ export const topologyPO = {
title: 'h1.ocs-page-layout__title',
search: '[data-test-id="item-filter"]',
emptyStateIcon: 'div.pf-c-empty-state__icon',
emptyText: '[data-test="no-resources-found"]',
graph: {
reset: '#reset-view',
zoomIn: '#zoom-in',
Expand All @@ -24,13 +25,14 @@ export const topologyPO = {
addNewAnnotations: '[data-test="add-button"]',
connector: '[data-test-id="edge-handler"]',
filterByResource: {
filterByResourceDropDown: '.pf-c-select__toggle-text',
deploymentResource: '.co-m-resource-icon.co-m-resource-deployment',
deploymentConfigResource: '.co-m-resource-icon.co-m-resource-deploymentconfig',
filterByResourceDropDown: '[data-test="filter-by-resource"]',
},
contextMenuOptions: {
addToProject: '.pf-topology-context-sub-menu',
},
addLink: '[data-test="add-page"]',
startBuildingNewApp: '[data-test="start-building-your-application"]',
quickSearch: '[data-test="quick-search-bar"]',
},
list: {
appName: '#HelmRelease ul li div',
Expand Down Expand Up @@ -216,3 +218,14 @@ export const topologyPO = {
tickButton: '[data-test-id="check-icon"]',
},
};

export function typeOfResource(type: string) {
return `[data-test="${type}"]`;
}

export function typeOfWorkload(workload: string) {
return `[data-test~="icon"][data-test~="${workload
.toLowerCase()
.replace(' ', '')
.trim()}"]`;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,145 @@
import { When, Then, Given } from 'cypress-cucumber-preprocessor/steps';
import { pageTitle } from '@console/dev-console/integration-tests/support/constants';
import { devNavigationMenu } from '@console/dev-console/integration-tests/support/constants/global';
import { createGitWorkload } from '@console/dev-console/integration-tests/support/pages';
import { app, navigateTo } from '@console/dev-console/integration-tests/support/pages/app';
import { topologyPO, typeOfResource, typeOfWorkload } from '../../page-objects/topology-po';
import { topologyHelper } from '../../pages/topology';

When('user navigates to Topology page', () => {
navigateTo(devNavigationMenu.Topology);
});

Then('user sees Topology page with message "No resources found"', () => {
cy.get(topologyPO.emptyText).should('be.visible');
});

Given('user is at the Topology page', () => {
navigateTo(devNavigationMenu.Topology);
});

When('user clicks on "Add page" link in the topology page', () => {
cy.get(topologyPO.graph.addLink)
.should('be.visible')
.click();
});

Then('user will be redirected to Add page', () => {
cy.url().should('include', 'add');
app.waitForLoad();
cy.contains(pageTitle.Add).should('be.visible');
});

Given('user is at the Topology page', () => {
navigateTo(devNavigationMenu.Topology);
});

When('user clicks on {string} link in the topology page', (build: string) => {
cy.get(topologyPO.graph.startBuildingNewApp)
.should('be.visible')
.click();
cy.log(`Quick search bar can be seen with ${build} link`);
});

Then('user will be able to see Add to project search bar', () => {
cy.get(topologyPO.graph.quickSearch).should('be.visible');
});

Given(
'user has created a deployment workload named {string}',
(
componentName: string,
resourceType: string = 'Deployment',
applicationName: string = 'nodejs-ex-git-app',
) => {
navigateTo(devNavigationMenu.Add);
createGitWorkload(
'https://github.com/sclorg/nodejs-ex.git',
componentName,
resourceType,
applicationName,
);
},
);

Given(
'user has created deployment config workload {string}',
(
componentName: string,
resourceType: string = 'Deployment Config',
applicationName: string = 'nodejs-ex-git-app',
) => {
navigateTo(devNavigationMenu.Add);
createGitWorkload(
'https://github.com/sclorg/nodejs-ex.git',
componentName,
resourceType,
applicationName,
);
},
);

When('user navigates to Topology page', () => {
navigateTo(devNavigationMenu.Topology);
});

Then(
'user sees {string} and {string} workloads in topology chart area',
(workload1: string, workload2: string) => {
topologyHelper.verifyWorkloadInTopologyPage(workload1);
topologyHelper.verifyWorkloadInTopologyPage(workload2);
},
);

Given(
'user created {string} workload',
(
resourceType: string,
componentName: string = `${resourceType.toLowerCase()}-ex-git`,
applicationName: string = 'django-ex-git-app',
) => {
navigateTo(devNavigationMenu.Add);
createGitWorkload(
'https://github.com/sclorg/django-ex.git',
componentName,
resourceType,
applicationName,
);
},
);

When('user is at Topology page chart view', () => {
navigateTo(devNavigationMenu.Topology);
});

When('user clicks the filter by resource on top', () => {
cy.get(topologyPO.graph.filterByResource.filterByResourceDropDown)
.should('be.visible')
.click();
});

Then(
'user will see {string} and {string} options',
(resourceType1: string, resourceType2: string) => {
cy.get(typeOfResource(resourceType1)).should('be.visible');
cy.get(typeOfResource(resourceType2)).should('be.visible');
},
);

Then(
'user can see only the {string} workload when Deployment option is selected',
(workload: string) => {
cy.get(typeOfResource('Deployment')).click();
cy.get(typeOfWorkload(workload)).should('be.visible');
cy.get(typeOfResource('Deployment')).click();
},
);

Then(
'user can see only the {string} workload when Deployment-Config option is selected',
(workload: string) => {
cy.get(typeOfResource('DeploymentConfig')).click();
cy.get(typeOfWorkload(workload)).should('be.visible');
cy.get(typeOfResource('DeploymentConfig')).click();
},
);
Original file line number Diff line number Diff line change
Expand Up @@ -154,6 +154,7 @@ const BaseNode: React.FC<BaseNodeProps> = ({
paddingX={8}
paddingY={4}
kind={kind}
data-test={`name-${element.getLabel()}`}
>
{element.getLabel()}
</SvgBoxedText>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,22 +21,27 @@ const TopologyEmptyState: React.FC<TopologyEmptyStateProps> = ({ setIsQuickSearc
return (
<EmptyState className="odc-topology__empty-state" variant={EmptyStateVariant.full}>
<EmptyStateIcon variant="container" component={TopologyIcon} />
<Title headingLevel="h3" size="lg">
<Title headingLevel="h3" size="lg" data-test="no-resources-found">
{t('topology~No resources found')}
</Title>
<EmptyStateSecondaryActions>
<Trans t={t} ns="topology">
<Button
isInline
variant="link"
data-test="start-building-your-application"
onClick={(e) => {
e.stopPropagation();
setIsQuickSearchOpen(true);
}}
>
Start building your application
</Button>{' '}
or visit the <Link to="/add">Add page</Link> for more details.
or visit the{' '}
<Link to="/add" data-test="add-page">
Add page
</Link>{' '}
for more details.
</Trans>
</EmptyStateSecondaryActions>
</EmptyState>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const QuickSearchBar: React.FC<QuickSearchBarProps> = ({
const { t } = useTranslation();

return (
<InputGroup className="odc-quick-search-bar">
<InputGroup className="odc-quick-search-bar" data-test="quick-search-bar">
<InputGroupText>
<QuickSearchIcon />
</InputGroupText>
Expand All @@ -34,6 +34,7 @@ const QuickSearchBar: React.FC<QuickSearchBarProps> = ({
onChange={onSearch}
autoFocus={autoFocus}
value={searchTerm}
data-test="quick-search-input"
/>
{!itemsLoaded && (
<InputGroupText>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ const ForwardSvgResourceIcon: React.FC<ResourceIconProps> = (
className={cx('odc-resource-icon', {
[`odc-resource-icon-${kindStr.toLowerCase()}`]: !kindColor,
})}
data-test={`icon ${kindStr.toLowerCase()}`}
>
{rect}
<title>{kindStr}</title>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,12 @@ const KindFilterDropdown: React.FC<KindFilterDropdownProps> = ({
</Button>
</span>
{kindFilters.map((filter) => (
<SelectOption key={filter.id} value={filter.id} isChecked={filter.value}>
<SelectOption
key={filter.id}
value={filter.id}
isChecked={filter.value}
data-test={filter.labelKey ? t(filter.labelKey) : filter.label}
>
<ResourceIcon kind={filter.id} />
{filter.label} ({supportedKinds[filter.id]})
</SelectOption>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ const TopologyFilterBar: React.FC<TopologyFilterBarProps> = ({
</ToolbarItem>
</ToolbarGroup>
<ToolbarGroup variant={ToolbarGroupVariant['filter-group']}>
<ToolbarItem>
<ToolbarItem data-test={'filter-by-resource'}>
<KindFilterDropdown
filters={filters}
supportedKinds={supportedKinds}
Expand Down

0 comments on commit 4312fa3

Please sign in to comment.