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

[ML] Advanced wizard functional UI tests #49480

Merged
merged 15 commits into from
Oct 29, 2019
Merged

[ML] Advanced wizard functional UI tests #49480

Show file tree
Hide file tree
Changes from 12 commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
09a65c9
Add data-test-subj attributes
pheyos Oct 16, 2019
e46b3ff
Add more service functions and update existing ones
pheyos Oct 16, 2019
292f2f7
Add jobWizardAdvanced service
pheyos Oct 16, 2019
25174f1
Add test to create advanced job
pheyos Oct 16, 2019
543e7cc
Fix advanced section selector
pheyos Oct 17, 2019
5ef0edb
Add detector results existence check
pheyos Oct 17, 2019
c58dca7
Add advanced job cloning and support for detector descriptions
pheyos Oct 25, 2019
594cc45
Add validations for datafeed config fields
pheyos Oct 25, 2019
178a449
Support optional datafeed config values / default values
pheyos Oct 25, 2019
38cb287
Refactor combo box assertions to take string[] as parameter
pheyos Oct 25, 2019
dca9a83
Removed not needed fields from ml/farequote archive mapping
pheyos Oct 28, 2019
cf6fc45
Use ecommerce data instead of farequote, add categorization job
pheyos Oct 28, 2019
242be04
Remove debug comments and suite restriction
pheyos Oct 28, 2019
f32ca31
Use ML states enums, rename detector FC
pheyos Oct 29, 2019
dfe2e17
Add ml namespace to subj names
pheyos Oct 29, 2019
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
3 changes: 3 additions & 0 deletions .../plugins/ml/public/jobs/jobs_list/components/start_datafeed_modal/start_datafeed_modal.js
View file
Open in desktop
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
2 changes: 1 addition & 1 deletion x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/datafeed_step/datafeed.tsx
View file
Open in desktop
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
13 changes: 7 additions & 6 deletions ...omponents/pick_fields_step/components/advanced_detector_modal/advanced_detector_modal.tsx
View file
Open in desktop
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
15 changes: 12 additions & 3 deletions ...ew/pages/components/pick_fields_step/components/advanced_detector_modal/modal_wrapper.tsx
View file
Open in desktop
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
18 changes: 14 additions & 4 deletions .../new_job_new/pages/components/pick_fields_step/components/advanced_view/detector_list.tsx
View file
Open in desktop
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="detectorDescription">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this subject be mlDetectorDescription?

Copy link
Member Author

@pheyos pheyos Oct 29, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It was originally planned to be nested subject only as it's not necessarily unique on its own, i.e. it's currently used as

mlAdvancedDetector ${detectorIndex} > detectorIdentifier

but it makes sense to keep our ml namespace here as well.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Renamed in dfe2e17

{d.detector_description}
</div>
) : (
detectorToString(d)
<DetectorIdentifier 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)}
<DetectorIdentifier 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 DetectorIdentifier: FC<{ detector: Detector }> = ({ detector }) => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i'm not sure about the name DetectorIdentifier.
It's not obvious what it'll produce.
The component produces a string describing the detector. something like StringifiedDetector is closer to what it's doing, but that's not great either.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Renamed in f32ca31

return <div data-test-subj="detectorIdentifier">{detectorToString(detector)}</div>;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this subject be mlDetectorIdentifier?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See above, renamed in dfe2e17

};
2 changes: 1 addition & 1 deletion ...ew_job_new/pages/components/pick_fields_step/components/advanced_view/metric_selector.tsx
View file
Open in desktop
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