From acfffd4706d7c3e4e52e6d02d5dfbdb9f5c36d07 Mon Sep 17 00:00:00 2001 From: Muslimjon <59481011+mkholjuraev@users.noreply.github.com> Date: Thu, 2 Nov 2023 23:07:31 +0100 Subject: [PATCH] chore(ImmutableDevices): cover with cypress tests (#2075) * chore(ImmutableDevices): cover with cypress tests * chore(ImmutableDevices): useInsightsNavigate hook --- .../ImmutableDevices/ImmutableDevices.cy.js | 174 ++++++++++++++++++ .../ImmutableDevices/ImmutableDevices.js | 2 +- 2 files changed, 175 insertions(+), 1 deletion(-) create mode 100644 src/components/ImmutableDevices/ImmutableDevices.cy.js diff --git a/src/components/ImmutableDevices/ImmutableDevices.cy.js b/src/components/ImmutableDevices/ImmutableDevices.cy.js new file mode 100644 index 000000000..1bedc6d5f --- /dev/null +++ b/src/components/ImmutableDevices/ImmutableDevices.cy.js @@ -0,0 +1,174 @@ +import React from 'react'; +import { Route, Routes } from 'react-router-dom'; +import ImmutableDevices from './ImmutableDevices'; +import { + featureFlagsInterceptors, + hostsInterceptors, +} from '../../../cypress/support/interceptors'; + +const defaultProps = { + mergeAppColumns: (columns) => columns, +}; + +// eslint-disable-next-line react/prop-types +const MockRouter = ({ path = '/insights/inventory', ...props }) => ( + + } /> + } /> + +); + +const getEntities = + (dataInject) => async (items, config, showTags, defaultGetEntities) => { + const result = await defaultGetEntities(items, config, showTags); + result.results.map(dataInject); + return result; + }; + +const mountWithProps = (props) => { + return cy.mountWithContext( + MockRouter, + { + routerProps: { initialEntries: ['/insights/inventory'] }, + }, + props + ); +}; + +before(() => { + cy.mockWindowChrome(); +}); + +describe('ImmutableDevices', () => { + beforeEach(() => { + cy.intercept('*', { statusCode: 200, body: { results: [] } }); + hostsInterceptors.successful(); + featureFlagsInterceptors.edgeParitySuccessful(); + }); + + it('renders without issues', () => { + mountWithProps(defaultProps); + + cy.get('table[aria-label="Host inventory"]').should('be.visible'); + }); + + it('Should populate Image column from useGetEntities', () => { + defaultProps.getEntities = async ( + items, + config, + showTags, + defaultGetEntities + ) => { + const result = await defaultGetEntities(items, config, showTags); + result.results.map( + (row, index) => (row.ImageName = `Test-image-${index}`) + ); + return result; + }; + + mountWithProps(defaultProps); + + cy.get('td[data-label="Image"] > a').contains('Test-image-0'); + }); + + describe('Status column', () => { + it('Should populate Status column with Up to date by default', () => { + defaultProps.getEntities = getEntities((row) => row); + + mountWithProps(defaultProps); + + cy.get('td[data-label="Status"] > #status > :nth-child(2) > p').contains( + 'Up to date' + ); + }); + + it('Should populate Status column with Update available', () => { + defaultProps.getEntities = getEntities((row) => { + row.UpdateAvailable = true; + return row; + }); + + mountWithProps(defaultProps); + + cy.get('td[data-label="Status"] > #status > :nth-child(2) > p').contains( + 'Update available' + ); + }); + + it('Should populate Status column with Unresponsive', () => { + defaultProps.getEntities = getEntities((row) => { + row.DispatcherStatus = 'UNRESPONSIVE'; + return row; + }); + + mountWithProps(defaultProps); + + cy.get('td[data-label="Status"] > #status > :nth-child(2) > p').contains( + 'Unresponsive' + ); + }); + + it('Should populate Status column with Updating', () => { + defaultProps.getEntities = getEntities((row) => { + row.Status = 'UPDATING'; + return row; + }); + + mountWithProps(defaultProps); + + cy.get('td[data-label="Status"] > #status > :nth-child(2) > p').contains( + 'Updating' + ); + }); + + it('Should populate Status column with Error', () => { + defaultProps.getEntities = getEntities((row) => { + row.DispatcherStatus = 'ERROR'; + return row; + }); + + mountWithProps(defaultProps); + + cy.get('td[data-label="Status"] > #status > :nth-child(2) > p').contains( + 'Error' + ); + }); + }); + + it("Should add consumers' custom columns", () => { + const mergeAppColumns = (defaultColumns) => { + const consumerSpecificColumn = { + key: 'testColumn', + title: 'Test-column', + props: { isStatic: true }, + }; + + return [...defaultColumns, consumerSpecificColumn]; + }; + + const getEntitiesProp = getEntities((row) => { + row.testColumn = 'Test-column-value'; + return row; + }); + + mountWithProps({ mergeAppColumns, getEntities: getEntitiesProp }); + + cy.get('thead > tr > [data-label="Test-column"]'); + cy.get( + '[data-ouia-component-id="OUIA-Generated-TableRow-90"] > [data-label="Test-column"]' + ).should('have.text', 'Test-column-value'); + }); + + it('Should take to details page on system name click', () => { + mountWithProps(defaultProps); + + cy.get('table[aria-label="Host inventory"]').should('be.visible'); + + cy.get('td[data-label="Name"]') + .first() + .find('.ins-composed-col > :nth-child(2) > a') + .trigger('click'); + + cy.get('#mock-detail-page'); + }); +}); diff --git a/src/components/ImmutableDevices/ImmutableDevices.js b/src/components/ImmutableDevices/ImmutableDevices.js index 2d6a0eafe..dd9cf935e 100644 --- a/src/components/ImmutableDevices/ImmutableDevices.js +++ b/src/components/ImmutableDevices/ImmutableDevices.js @@ -2,7 +2,7 @@ import propTypes from 'prop-types'; import { useDispatch, useSelector } from 'react-redux'; import React, { useEffect } from 'react'; import { TableVariant } from '@patternfly/react-table'; -import { InventoryTable } from '@redhat-cloud-services/frontend-components/Inventory'; +import { InventoryTable } from '../InventoryTable'; import useFeatureFlag from '../../Utilities/useFeatureFlag'; import { useNavigate } from 'react-router-dom'; import { edgeColumns } from './columns';