Skip to content

Commit

Permalink
[ILM] Policy phases redesign (#88671)
Browse files Browse the repository at this point in the history 
* Phases redesign

* Title and name field layout

* Active highlight wip

* Copy comments

* Updated data allocation dropdown

* Min age error message

* Fixed tests

* Fixed edit policy integration tests

* Fixed more tests

* Cleaned up test files

* Use hotProperty instead of a string

* Clean up in phase component

* Fixed i18n files

* Updated optional fields

* Updated aria attributes after running axe tests

* Added review suggestions

* Reversed data allocation field changes

* Fixed type error

* Reversed on/off label and prepend input label

* Deleted property consts from phases components

* Removed not needed i18n consts and added i18n where missing

* Fixed merge conflicts with master

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
  • Loading branch information
@yuliacech @kibanamachine
yuliacech and kibanamachine authored Jan 27, 2021
1 parent 0a7a9e4 commit d931ed6
Show file tree
Hide file tree
Showing 35 changed files with 1,030 additions and 1,248 deletions.
39 changes: 16 additions & 23 deletions x-pack/plugins/index_lifecycle_management/__jest__/client_integration/app/app.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@ const PERCENT_SIGN_NAME = 'test%';
const PERCENT_SIGN_WITH_OTHER_CHARS_NAME = 'test%#';
const PERCENT_SIGN_25_SEQUENCE = 'test%25';

const createPolicyTitle = 'Create Policy';
const editPolicyTitle = 'Edit Policy';

window.scrollTo = jest.fn();

jest.mock('@elastic/eui', () => {
Expand Down Expand Up @@ -52,7 +55,7 @@ describe('<App />', () => {
await actions.clickCreatePolicyButton();
component.update();

expect(testBed.find('policyTitle').text()).toBe(`Create an index lifecycle policy`);
expect(testBed.find('policyTitle').text()).toBe(createPolicyTitle);
expect(testBed.find('policyNameField').props().value).toBe('');
});

Expand All @@ -68,7 +71,7 @@ describe('<App />', () => {
await actions.clickCreatePolicyButton();
component.update();

expect(testBed.find('policyTitle').text()).toBe(`Create an index lifecycle policy`);
expect(testBed.find('policyTitle').text()).toBe(createPolicyTitle);
expect(testBed.find('policyNameField').props().value).toBe('');
});
});
Expand All @@ -89,9 +92,7 @@ describe('<App />', () => {
await actions.clickPolicyNameLink();
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${SPECIAL_CHARS_NAME}`
);
expect(testBed.find('policyTitle').text()).toBe(`${editPolicyTitle} ${SPECIAL_CHARS_NAME}`);
});

test('loading edit policy page url works', async () => {
Expand All @@ -102,9 +103,7 @@ describe('<App />', () => {
const { component } = testBed;
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${SPECIAL_CHARS_NAME}`
);
expect(testBed.find('policyTitle').text()).toBe(`${editPolicyTitle} ${SPECIAL_CHARS_NAME}`);
});

// using double encoding to counteract react-router's v5 internal decodeURI call
Expand All @@ -117,9 +116,7 @@ describe('<App />', () => {
const { component } = testBed;
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${SPECIAL_CHARS_NAME}`
);
expect(testBed.find('policyTitle').text()).toBe(`${editPolicyTitle} ${SPECIAL_CHARS_NAME}`);
});
});

Expand All @@ -136,9 +133,7 @@ describe('<App />', () => {
const { component } = testBed;
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_NAME}`
);
expect(testBed.find('policyTitle').text()).toBe(`${editPolicyTitle} ${PERCENT_SIGN_NAME}`);
});

test('loading edit policy page url with double encoding works', async () => {
Expand All @@ -149,9 +144,7 @@ describe('<App />', () => {
const { component } = testBed;
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_NAME}`
);
expect(testBed.find('policyTitle').text()).toBe(`${editPolicyTitle} ${PERCENT_SIGN_NAME}`);
});
});

Expand All @@ -174,7 +167,7 @@ describe('<App />', () => {
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
`${editPolicyTitle} ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
);
});

Expand All @@ -188,7 +181,7 @@ describe('<App />', () => {

// known issue https://github.com/elastic/kibana/issues/82440
expect(testBed.find('policyTitle').text()).not.toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
`${editPolicyTitle} ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
);
});

Expand All @@ -203,7 +196,7 @@ describe('<App />', () => {
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
`${editPolicyTitle} ${PERCENT_SIGN_WITH_OTHER_CHARS_NAME}`
);
});
});
Expand All @@ -225,7 +218,7 @@ describe('<App />', () => {
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_25_SEQUENCE}`
`${editPolicyTitle} ${PERCENT_SIGN_25_SEQUENCE}`
);
});

Expand All @@ -239,7 +232,7 @@ describe('<App />', () => {

// known issue https://github.com/elastic/kibana/issues/82440
expect(testBed.find('policyTitle').text()).not.toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_25_SEQUENCE}`
`${editPolicyTitle} ${PERCENT_SIGN_25_SEQUENCE}`
);
});

Expand All @@ -254,7 +247,7 @@ describe('<App />', () => {
component.update();

expect(testBed.find('policyTitle').text()).toBe(
`Edit index lifecycle policy ${PERCENT_SIGN_25_SEQUENCE}`
`${editPolicyTitle} ${PERCENT_SIGN_25_SEQUENCE}`
);
});
});
Expand Down
46 changes: 28 additions & 18 deletions ...ndex_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.helpers.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,13 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
component.update();
};

const createFormCheckboxAction = (dataTestSubject: string) => async (checked: boolean) => {
await act(async () => {
form.selectCheckBox(dataTestSubject, checked);
});
component.update();
};

function createFormSetValueAction<V extends string = string>(dataTestSubject: string) {
return async (value: V) => {
await act(async () => {
Expand Down Expand Up @@ -146,17 +153,21 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
forceMergeFieldExists: () => exists(toggleSelector),
toggleForceMerge: createFormToggleAction(toggleSelector),
setForcemergeSegmentsCount: createFormSetValueAction(`${phase}-selectedForceMergeSegments`),
setBestCompression: createFormToggleAction(`${phase}-bestCompression`),
setBestCompression: createFormCheckboxAction(`${phase}-bestCompression`),
};
};

const setIndexPriority = (phase: Phases) =>
createFormSetValueAction(`${phase}-phaseIndexPriority`);
const createIndexPriorityActions = (phase: Phases) => {
const toggleSelector = `${phase}-indexPrioritySwitch`;
return {
indexPriorityExists: () => exists(toggleSelector),
toggleIndexPriority: createFormToggleAction(toggleSelector),
setIndexPriority: createFormSetValueAction(`${phase}-indexPriority`),
};
};

const enable = (phase: Phases) => createFormToggleAction(`enablePhaseSwitch-${phase}`);

const warmPhaseOnRollover = createFormToggleAction(`warm-warmPhaseOnRollover`);

const setMinAgeValue = (phase: Phases) => createFormSetValueAction(`${phase}-selectedMinimumAge`);

const setMinAgeUnits = (phase: Phases) =>
Expand Down Expand Up @@ -190,13 +201,15 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
await createFormSetValueAction(`${phase}-selectedReplicaCount`)(value);
};

const setShrink = (phase: Phases) => async (value: string) => {
await createFormToggleAction(`${phase}-shrinkSwitch`)(true);
await createFormSetValueAction(`${phase}-selectedPrimaryShardCount`)(value);
const createShrinkActions = (phase: Phases) => {
const toggleSelector = `${phase}-shrinkSwitch`;
return {
shrinkExists: () => exists(toggleSelector),
toggleShrink: createFormToggleAction(toggleSelector),
setShrink: createFormSetValueAction(`${phase}-primaryShardCount`),
};
};

const shrinkExists = (phase: Phases) => () => exists(`${phase}-shrinkSwitch`);

const setFreeze = createFormToggleAction('freezeSwitch');
const freezeExists = () => exists('freezeSwitch');

Expand Down Expand Up @@ -250,25 +263,22 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
toggleRollover,
toggleDefaultRollover,
...createForceMergeActions('hot'),
setIndexPriority: setIndexPriority('hot'),
setShrink: setShrink('hot'),
shrinkExists: shrinkExists('hot'),
...createIndexPriorityActions('hot'),
...createShrinkActions('hot'),
setReadonly: setReadonly('hot'),
...createSearchableSnapshotActions('hot'),
},
warm: {
enable: enable('warm'),
warmPhaseOnRollover,
setMinAgeValue: setMinAgeValue('warm'),
setMinAgeUnits: setMinAgeUnits('warm'),
setDataAllocation: setDataAllocation('warm'),
setSelectedNodeAttribute: setSelectedNodeAttribute('warm'),
setReplicas: setReplicas('warm'),
setShrink: setShrink('warm'),
shrinkExists: shrinkExists('warm'),
...createShrinkActions('warm'),
...createForceMergeActions('warm'),
setReadonly: setReadonly('warm'),
setIndexPriority: setIndexPriority('warm'),
...createIndexPriorityActions('warm'),
},
cold: {
enable: enable('cold'),
Expand All @@ -279,7 +289,7 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
setReplicas: setReplicas('cold'),
setFreeze,
freezeExists,
setIndexPriority: setIndexPriority('cold'),
...createIndexPriorityActions('cold'),
...createSearchableSnapshotActions('cold'),
},
delete: {
Expand Down
38 changes: 6 additions & 32 deletions ...ns/index_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,9 +76,6 @@ describe('<EditPolicy />', () => {
max_size: '50gb',
unknown_setting: 123, // Made up setting that should stay preserved
},
set_priority: {
priority: 100,
},
},
min_age: '0ms',
},
Expand Down Expand Up @@ -126,8 +123,10 @@ describe('<EditPolicy />', () => {
await actions.hot.toggleForceMerge(true);
await actions.hot.setForcemergeSegmentsCount('123');
await actions.hot.setBestCompression(true);
await actions.hot.toggleShrink(true);
await actions.hot.setShrink('2');
await actions.hot.setReadonly(true);
await actions.hot.toggleIndexPriority(true);
await actions.hot.setIndexPriority('123');

await actions.savePolicy();
Expand Down Expand Up @@ -186,13 +185,7 @@ describe('<EditPolicy />', () => {
const hotActions = policy.phases.hot.actions;
const rolloverAction = hotActions.rollover;
expect(rolloverAction).toBe(undefined);
expect(hotActions).toMatchInlineSnapshot(`
Object {
"set_priority": Object {
"priority": 100,
},
}
`);
expect(hotActions).toMatchInlineSnapshot(`Object {}`);
});

test('enabling searchable snapshot should hide force merge, freeze and shrink in subsequent phases', async () => {
Expand Down Expand Up @@ -260,6 +253,7 @@ describe('<EditPolicy />', () => {
"priority": 50,
},
},
"min_age": "0ms",
}
`);
});
Expand All @@ -270,6 +264,7 @@ describe('<EditPolicy />', () => {
await actions.warm.setDataAllocation('node_attrs');
await actions.warm.setSelectedNodeAttribute('test:123');
await actions.warm.setReplicas('123');
await actions.warm.toggleShrink(true);
await actions.warm.setShrink('123');
await actions.warm.toggleForceMerge(true);
await actions.warm.setForcemergeSegmentsCount('123');
Expand All @@ -290,9 +285,6 @@ describe('<EditPolicy />', () => {
"max_age": "30d",
"max_size": "50gb",
},
"set_priority": Object {
"priority": 100,
},
},
"min_age": "0ms",
},
Expand All @@ -316,24 +308,12 @@ describe('<EditPolicy />', () => {
"number_of_shards": 123,
},
},
"min_age": "0ms",
},
},
}
`);
});

test('setting warm phase on rollover to "false"', async () => {
const { actions } = testBed;
await actions.warm.enable(true);
await actions.warm.warmPhaseOnRollover(false);
await actions.warm.setMinAgeValue('123');
await actions.warm.setMinAgeUnits('d');
await actions.savePolicy();
const latestRequest = server.requests[server.requests.length - 1];
const warmPhaseMinAge = JSON.parse(JSON.parse(latestRequest.requestBody).body).phases.warm
.min_age;
expect(warmPhaseMinAge).toBe('123d');
});
});

describe('policy with include and exclude', () => {
Expand Down Expand Up @@ -458,9 +438,6 @@ describe('<EditPolicy />', () => {
"max_age": "30d",
"max_size": "50gb",
},
"set_priority": Object {
"priority": 100,
},
},
"min_age": "0ms",
},
Expand Down Expand Up @@ -662,9 +639,6 @@ describe('<EditPolicy />', () => {
"allocate": Object {
"number_of_replicas": 123,
},
"set_priority": Object {
"priority": 50,
},
}
`);
});
Expand Down
Loading

0 comments on commit d931ed6

Please sign in to comment.