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.

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

[ML] Advanced wizard functional UI tests #49480

Merged
merged 15 commits into from
Oct 29, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,7 @@ export class StartDatafeedModal extends Component {
onClose={this.closeModal}
style={{ width: '850px' }}
maxWidth={false}
data-test-subj="mlStartDatafeedModal"
>
<EuiModalHeader>
<EuiModalHeaderTitle>
Expand Down Expand Up @@ -178,6 +179,7 @@ export class StartDatafeedModal extends Component {
<EuiModalFooter>
<EuiButtonEmpty
onClick={this.closeModal}
data-test-subj="mlStartDatafeedModalCancelButton"
>
<FormattedMessage
id="xpack.ml.jobsList.startDatafeedModal.cancelButtonLabel"
Expand All @@ -189,6 +191,7 @@ export class StartDatafeedModal extends Component {
onClick={this.save}
isDisabled={startDisabled}
fill
data-test-subj="mlStartDatafeedModalStartButton"
>
<FormattedMessage
id="xpack.ml.jobsList.startDatafeedModal.startButtonLabel"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ export const DatafeedStep: FC<StepProps> = ({ setCurrentStep, isCurrentStep }) =
{isCurrentStep && (
<Fragment>
<EuiFlexGroup gutterSize="xl">
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedDatafeedQueryEditor">
<QueryInput setIsValidQuery={setIsValidQuery} />
</EuiFlexItem>
<EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -213,7 +213,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
<ModalWrapper onCreateClick={onCreateClick} closeModal={closeModal} saveEnabled={saveEnabled()}>
<Fragment>
<EuiFlexGroup>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedFunctionSelect">
<AggDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -224,7 +224,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
/>
</AggDescription>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedFieldSelect">
<FieldDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -239,7 +239,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
</EuiFlexGroup>
<EuiHorizontalRule margin="l" />
<EuiFlexGrid columns={2}>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedByFieldSelect">
<ByFieldDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -251,7 +251,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
/>
</ByFieldDescription>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedOverFieldSelect">
<OverFieldDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -263,7 +263,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
/>
</OverFieldDescription>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedPartitionFieldSelect">
<PartitionFieldDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -275,7 +275,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
/>
</PartitionFieldDescription>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem data-test-subj="mlAdvancedExcludeFrequentSelect">
<ExcludeFrequentDescription>
<EuiComboBox
singleSelection={{ asPlainText: true }}
Expand All @@ -301,6 +301,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
placeholder={descriptionPlaceholder}
value={descriptionOption}
onChange={e => setDescriptionOption(e.target.value)}
data-test-subj="mlAdvancedDetectorDescriptionInput"
/>
</DescriptionDescription>
</EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,11 @@ interface Props {
export const ModalWrapper: FC<Props> = ({ onCreateClick, closeModal, saveEnabled, children }) => {
return (
<EuiOverlayMask>
<EuiModal onClose={closeModal} maxWidth={MAX_MODAL_WIDTH}>
<EuiModal
onClose={closeModal}
maxWidth={MAX_MODAL_WIDTH}
data-test-subj="mlCreateDetectorModal"
>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
Expand All @@ -41,14 +45,19 @@ export const ModalWrapper: FC<Props> = ({ onCreateClick, closeModal, saveEnabled
<EuiModalBody>{children}</EuiModalBody>

<EuiModalFooter>
<EuiButtonEmpty onClick={closeModal}>
<EuiButtonEmpty onClick={closeModal} data-test-subj="mlCreateDetectorModalCancelButton">
<FormattedMessage
id="xpack.ml.newJob.wizard.pickFieldsStep.advancedDetectorModal.cancelButton"
defaultMessage="Cancel"
/>
</EuiButtonEmpty>

<EuiButton onClick={onCreateClick} isDisabled={saveEnabled === false} fill>
<EuiButton
onClick={onCreateClick}
isDisabled={saveEnabled === false}
fill
data-test-subj="mlCreateDetectorModalSaveButton"
>
<FormattedMessage
id="xpack.ml.newJob.wizard.pickFieldsStep.advancedDetectorModal.saveButton"
defaultMessage="Save"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ import { JobCreatorContext } from '../../../job_creator_context';
import { AdvancedJobCreator } from '../../../../../common/job_creator';
import { Validation } from '../../../../../common/job_validator';
import { detectorToString } from '../../../../../../../util/string_utils';
import { Detector } from '../../../../../common/job_creator/configs';

interface Props {
isActive: boolean;
Expand Down Expand Up @@ -62,6 +63,7 @@ export const DetectorList: FC<Props> = ({ isActive, onEditJob, onDeleteJob }) =>
defaultMessage: 'Edit',
}
)}
data-test-subj="mlAdvancedDetectorEditButton"
/>
</EuiFlexItem>
<EuiFlexItem>
Expand All @@ -75,6 +77,7 @@ export const DetectorList: FC<Props> = ({ isActive, onEditJob, onDeleteJob }) =>
defaultMessage: 'Delete',
}
)}
data-test-subj="mlAdvancedDetectorDeleteButton"
/>
</EuiFlexItem>
</EuiFlexGroup>
Expand All @@ -98,14 +101,16 @@ export const DetectorList: FC<Props> = ({ isActive, onEditJob, onDeleteJob }) =>

<EuiFlexGrid columns={3}>
{detectors.map((d, i) => (
<EuiFlexItem key={i}>
<EuiFlexItem key={i} data-test-subj={`mlAdvancedDetector ${i}`}>
<EuiPanel paddingSize="m">
<EuiFlexGroup>
<EuiFlexItem>
{d.detector_description !== undefined ? (
<div style={{ fontWeight: 'bold' }}>{d.detector_description}</div>
<div style={{ fontWeight: 'bold' }} data-test-subj="mlDetectorDescription">
{d.detector_description}
</div>
) : (
detectorToString(d)
<StringifiedDetector detector={d} />
)}
</EuiFlexItem>
{isActive && (
Expand All @@ -117,7 +122,7 @@ export const DetectorList: FC<Props> = ({ isActive, onEditJob, onDeleteJob }) =>
{d.detector_description !== undefined && (
<Fragment>
<EuiHorizontalRule margin="s" />
{detectorToString(d)}
<StringifiedDetector detector={d} />
</Fragment>
)}
</EuiPanel>
Expand All @@ -142,6 +147,7 @@ const NoDetectorsWarning: FC<{ show: boolean }> = ({ show }) => {
defaultMessage: 'No detectors',
})}
iconType="alert"
data-test-subj="mlAdvancedNoDetectorsMessage"
>
<FormattedMessage
id="xpack.ml.newJob.wizard.pickFieldsStep.noDetectorsCallout.message"
Expand All @@ -166,3 +172,7 @@ const DuplicateDetectorsWarning: FC<{ validation: Validation }> = ({ validation
</Fragment>
);
};

const StringifiedDetector: FC<{ detector: Detector }> = ({ detector }) => {
return <div data-test-subj="mlDetectorIdentifier">{detectorToString(detector)}</div>;
};
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ export const MetricSelector: FC<Props> = ({
<EuiFlexGroup style={{ maxWidth: MAX_WIDTH }}>
<EuiFlexItem>
<EuiFormRow>
<EuiButton onClick={showModal}>
<EuiButton onClick={showModal} data-test-subj="mlAddDetectorButton">
<FormattedMessage
id="xpack.ml.newJob.wizard.pickFieldsStep.addDetectorButton"
defaultMessage="Add detector"
Expand Down
Loading