Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backport 2.5] Cypress test update and related linting fixes #243

Merged
merged 1 commit into from
Feb 6, 2023
Merged

[Backport 2.5] Cypress test update and related linting fixes #243

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
718 changes: 144 additions & 574 deletions .cypress/integration/1_event_analytics.spec.js
View file
Open in desktop

Large diffs are not rendered by default.

27 changes: 20 additions & 7 deletions .cypress/utils/event_analytics/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* SPDX-License-Identifier: Apache-2.0
*/

import { COMMAND_TIMEOUT_LONG, supressResizeObserverIssue, TIMEOUT_DELAY } from '../constants';
import { COMMAND_TIMEOUT_LONG, supressResizeObserverIssue } from '../constants';

export const delay = 1000;
export const YEAR_TO_DATE_DOM_ID = '[data-test-subj="superDatePickerCommonlyUsed_Year_to date"]';
Expand All @@ -20,6 +20,7 @@ export const TEST_QUERIES = [
},
{
query: 'source = opensearch_dashboards_sample_data_logs',
dateRangeDOM: YEAR_TO_DATE_DOM_ID,
},
{
query:
Expand Down Expand Up @@ -78,30 +79,25 @@ export const querySearch = (query, rangeSelected) => {
.type(query, { delay: 50 });
cy.get('[data-test-subj="superDatePickerToggleQuickMenuButton"]').click();
cy.get(rangeSelected).click();
cy.wait(delay * 2);
cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').contains('Refresh').click();
};

export const landOnEventHome = () => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics`);
cy.wait(delay);
};

export const landOnEventExplorer = () => {
cy.visit(
`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/explorer`
);
supressResizeObserverIssue();
cy.wait(delay);
};

export const landOnEventVisualizations = () => {
cy.visit(
`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/explorer`
);
supressResizeObserverIssue(); // have to add
cy.get('button[id="main-content-vis"]').contains('Visualizations').click();
supressResizeObserverIssue();
cy.wait(delay);
};

export const landOnPanels = () => {
Expand Down Expand Up @@ -252,3 +248,20 @@ export const renderGaugeChart = () => {
.type('Gauge')
.type('{enter}');
};

export const HOST_TEXT_1 = "artifacts.opensearch.org";
export const HOST_TEXT_2 = "www.opensearch.org";
export const HOST_TEXT_3 = "cdn.opensearch-opensearch-opensearch.org";
export const HOST_TEXT_4 = "opensearch-opensearch-opensearch.org";
export const AGENT_TEXT_1 = "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)";
export const AGENT_TEXT_2 = "Mozilla/5.0 (X11; Linux i686) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.50 Safari/534.24";
export const AGENT_TEXT_3 = "Mozilla/5.0 (X11; Linux x86_64; rv:6.0a1) Gecko/20110421 Firefox/6.0a1";
export const BAR_LEG_TEXT_1 = `${AGENT_TEXT_1},count()`;
export const BAR_LEG_TEXT_2 = `${AGENT_TEXT_2},count()`;
export const BAR_LEG_TEXT_3 = `${AGENT_TEXT_3},count()`;
export const VIS_TYPE_PIE = 'Pie';
export const VIS_TYPE_VBAR = 'Vertical bar';
export const VIS_TYPE_HBAR = 'Horizontal bar';
export const VIS_TYPE_HEATMAP = 'Heatmap';
export const FIELD_HOST = 'host';
export const FIELD_AGENT = 'agent';
4 changes: 2 additions & 2 deletions common/types/explorer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -289,7 +289,7 @@ export interface PatternTableData {
pattern: string;
sampleLog: string;
anomalyCount?: number;
};
}

export interface ConfigListEntry {
label: string;
Expand Down Expand Up @@ -379,7 +379,7 @@ export interface VisMeta {
}

export interface VisualizationState {
query: Query;
queryState: Query;
visData: any;
visConfMetadata: ConfigList;
visMeta: VisMeta;
Expand Down
37 changes: 16 additions & 21 deletions public/components/common/search/search.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
import './search.scss';

import React, { useState } from 'react';
import { isEqual } from 'lodash';
import {
EuiFlexGroup,
EuiButton,
Expand All @@ -16,7 +17,7 @@ import {
EuiBadge,
EuiContextMenuPanel,
EuiToolTip,
EuiCallOut
EuiCallOut,
} from '@elastic/eui';
import { DatePicker } from './date_picker';
import '@algolia/autocomplete-theme-classic';
Expand All @@ -26,6 +27,7 @@ import { PPLReferenceFlyout } from '../helpers';
import { uiSettingsService } from '../../../../common/utils';
import { APP_ANALYTICS_TAB_ID_REGEX } from '../../../../common/constants/explorer';
import { LiveTailButton, StopLiveButton } from '../live_tail/live_tail_button';
import { PPL_SPAN_REGEX } from '../../../../common/constants/shared';
export interface IQueryBarProps {
query: string;
tempQuery: string;
Expand Down Expand Up @@ -68,7 +70,6 @@ export const Search = (props: any) => {
showSavePanelOptionsList,
showSaveButton = true,
handleTimeRangePickerRefresh,
liveTailButton,
isLiveTailPopoverOpen,
closeLiveTailPopover,
popoverItems,
Expand All @@ -84,14 +85,9 @@ export const Search = (props: any) => {
liveTailName,
searchError = null,
curVisId,
spanValue,
setSubType,
metricMeasure,
setMetricMeasure,
setMetricLabel,
metricChecked,
} = props;

const appLogEvents = tabId.match(APP_ANALYTICS_TAB_ID_REGEX);
const [isSavePanelOpen, setIsSavePanelOpen] = useState(false);
const [isFlyoutVisible, setIsFlyoutVisible] = useState(false);
Expand Down Expand Up @@ -222,15 +218,12 @@ export const Search = (props: any) => {
showOptionList={
showSavePanelOptionsList &&
searchBarConfigs[selectedSubTabId]?.showSavePanelOptionsList

}
curVisId={curVisId}
spanValue={spanValue}
setSubType={setSubType}
metricMeasure={metricMeasure}
setMetricMeasure={setMetricMeasure}
setMetricLabel={setMetricLabel}
metricChecked={metricChecked}
isSaveAsMetricEnabled={
isEqual(curVisId, 'line') && tempQuery.match(PPL_SPAN_REGEX) !== null
}
/>
<EuiPopoverFooter>
<EuiFlexGroup justifyContent="flexEnd">
Expand Down Expand Up @@ -263,17 +256,19 @@ export const Search = (props: any) => {
</>
)}
</EuiFlexGroup>
{ searchError && searchError.error && (
{searchError && searchError.error && (
<EuiFlexGroup gutterSize="s" justifyContent="flexStart" alignItems="flexStart">
<EuiFlexItem>
<EuiCallOut title={JSON.parse(searchError.message).error.reason} color="danger" iconType="alert">
<p>
{JSON.parse(searchError.message).error.details}
</p>
<EuiCallOut
title={JSON.parse(searchError.message).error.reason}
color="danger"
iconType="alert"
>
<p>{JSON.parse(searchError.message).error.details}</p>
</EuiCallOut>
</EuiFlexItem>
</EuiFlexGroup>)
}
</EuiFlexGroup>
)}
{flyout}
</div>
);
Expand Down
48 changes: 22 additions & 26 deletions public/components/event_analytics/explorer/explorer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -187,10 +187,8 @@ export const Explorer = ({
value: string;
}>();
const [viewLogPatterns, setViewLogPatterns] = useState(false);
const [spanValue, setSpanValue] = useState(false);
const [subType, setSubType] = useState('visualization');
const [metricMeasure, setMetricMeasure] = useState('');
const [metricLabel, setMetricLabel] = useState([]);
const [metricChecked, setMetricChecked] = useState(false);
const queryRef = useRef();
const appBasedRef = useRef('');
Expand Down Expand Up @@ -570,7 +568,10 @@ export const Explorer = ({
await updateQueryInStore(patternSelectQuery);
// Passing in empty string will remove pattern query
const patternErrorHandler = getErrorHandler('Error fetching patterns');
getPatterns(selectedIntervalRef.current?.value.replace(/^auto_/, '') || 'y', patternErrorHandler);
getPatterns(
selectedIntervalRef.current?.value.replace(/^auto_/, '') || 'y',
patternErrorHandler
);
}
};

Expand Down Expand Up @@ -645,7 +646,10 @@ export const Explorer = ({
getErrorHandler('Error overriding default pattern')
);
setIsOverridingPattern(false);
await getPatterns(selectedIntervalRef.current?.value.replace(/^auto_/, '') || 'y', getErrorHandler('Error fetching patterns'));
await getPatterns(
selectedIntervalRef.current?.value.replace(/^auto_/, '') || 'y',
getErrorHandler('Error fetching patterns')
);
};

const totalHits: number = useMemo(() => {
Expand Down Expand Up @@ -850,7 +854,10 @@ export const Explorer = ({
})
);
await getPatterns(
selectedIntervalRef.current?.value.replace(/^auto_/, '') || 'y',
selectedIntervalRef.current?.value.replace(
/^auto_/,
''
) || 'y',
getErrorHandler('Error fetching patterns')
);
}}
Expand Down Expand Up @@ -1253,7 +1260,7 @@ export const Explorer = ({
? JSON.stringify(userVizConfigs[curVisId])
: JSON.stringify({}),
description: vizDescription,
subType: subType,
subType,
})
.then((res: any) => {
setToast(
Expand Down Expand Up @@ -1288,7 +1295,7 @@ export const Explorer = ({
? JSON.stringify(userVizConfigs[curVisId])
: JSON.stringify({}),
description: vizDescription,
subType: subType,
subType,
})
.then((res: any) => {
batch(() => {
Expand Down Expand Up @@ -1430,25 +1437,17 @@ export const Explorer = ({
[tempQuery]
);

const generateViewQuery = (query: string) => {
if (query.includes(appBaseQuery)) {
if (query.includes('|')) {
const generateViewQuery = (queryString: string) => {
if (queryString.includes(appBaseQuery)) {
if (queryString.includes('|')) {
// Some scenarios have ' | ' after base query and some have '| '
return query.replace(' | ', '| ').replace(appBaseQuery + '| ', '');
return queryString.replace(' | ', '| ').replace(appBaseQuery + '| ', '');
}
return '';
}
return query;
return queryString;
};

useEffect(() => {
if (isEqual(selectedContentTabId, TAB_CHART_ID)) {
const statsTokens = queryManager.queryParser().parse(tempQuery).getStats();
const updatedDataConfig = getDefaultVisConfig(statsTokens);
setSpanValue(!isEqual(typeof updatedDataConfig.span, 'undefined'));
}
}, [tempQuery, selectedContentTabId, curVisId]);

return (
<TabContext.Provider
value={{
Expand All @@ -1469,7 +1468,9 @@ export const Explorer = ({
query,
}}
>
<div className={`dscAppContainer${uiSettingsService.get('theme:darkMode') && ' explorer-dark'}`}>
<div
className={`dscAppContainer${uiSettingsService.get('theme:darkMode') && ' explorer-dark'}`}
>
<Search
key="search-component"
query={appLogEvents ? generateViewQuery(tempQuery) : query[RAW_QUERY]}
Expand Down Expand Up @@ -1504,12 +1505,7 @@ export const Explorer = ({
liveTailName={liveTailNameRef.current}
searchError={explorerVisualizations}
curVisId={curVisId}
spanValue={spanValue}
setSubType={setSubType}
metricMeasure={metricMeasure}
setMetricMeasure={setMetricMeasure}
setMetricLabel={setMetricLabel}
metricChecked={metricChecked}
/>
<EuiTabbedContent
className="mainContentTabs"
Expand Down
4 changes: 2 additions & 2 deletions ...ents/event_analytics/explorer/save_panel/__tests__/__snapshots__/save_panel.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -738,7 +738,7 @@ exports[`Saved query table component Renders saved query table 1`] = `
onMouseOver={[Function]}
>
<EuiSwitch
checked={true}
checked={false}
compressed={true}
disabled={true}
label="Save as Metric"
Expand All @@ -751,7 +751,7 @@ exports[`Saved query table component Renders saved query table 1`] = `
className="euiSwitch euiSwitch--compressed"
>
<button
aria-checked={true}
aria-checked={false}
aria-labelledby="random_html_id"
className="euiSwitch__button"
disabled={true}
Expand Down
Loading