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

Reduce flakiness of input control vis test by using testSubjects.click. #21318

Closed
wants to merge 2 commits into from
Closed

Reduce flakiness of input control vis test by using testSubjects.click. #21318

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
584b4db
Reduce flakiness by using testSubjects.click. Simplify code by using …
cjcenizal Jul 26, 2018
4ef65f2
Remove 1s sleep and run tests 20x.
cjcenizal Jul 27, 2018
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
45 changes: 26 additions & 19 deletions test/functional/page_objects/visualize_page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -248,17 +248,28 @@ export function VisualizePageProvider({ getService, getPageObjects }) {

async setComboBox(comboBoxSelector, value) {
const comboBox = await testSubjects.find(comboBoxSelector);
await this.setComboBoxElement(comboBox, value);
await this.setComboBoxValue(comboBox, value);
await this.closeComboBoxOptionsList(comboBoxSelector);
await PageObjects.common.sleep(1000);
Copy link
Contributor

Choose a reason for hiding this comment

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

wonder if we could get rid of this sleep as part of this code?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I'll try it out.

}

async setComboBoxElement(element, value) {
const input = await element.findByTagName('input');
async setComboBoxElement(comboBox, value) {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I had to refactor out common functionality between setComboBox and setComboBoxElement into setComboBoxValue and then remove the dependency upon setComboBoxElement from setComboBox so that we could pass down the test subject selector to the other helper methods.

await this.setComboBoxValue(comboBox, value);

// Close list.
const isOptionsListOpen = await testSubjects.exists('comboBoxOptionsList');
Copy link
Contributor

Choose a reason for hiding this comment

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

Can closeComboBoxOptionsList function be used here instead?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I don't think so, since that method requires you to pass in a data-test-subj selector, and we don't have access to one in this method (we only have access to the combo box element itself).

if (isOptionsListOpen) {
const closeBtn = await comboBox.findByCssSelector('[data-test-subj="comboBoxToggleListButton"]');
await closeBtn.click();
}
}

async setComboBoxValue(comboBox, value) {
const input = await comboBox.findByTagName('input');
await input.clearValue();
await input.type(value);
await PageObjects.common.sleep(500);
await find.clickByCssSelector('.euiComboBoxOption');
await this.closeComboBoxOptionsList(element);
}

async filterComboBoxOptions(comboBoxSelector, value) {
Expand All @@ -267,16 +278,15 @@ export function VisualizePageProvider({ getService, getPageObjects }) {
await input.clearValue();
await input.type(value);
await PageObjects.common.sleep(500);
await this.closeComboBoxOptionsList(comboBox);
await this.closeComboBoxOptionsList(comboBoxSelector);
}

async getComboBoxOptions(comboBoxSelector) {
await testSubjects.click(comboBoxSelector);
const menu = await retry.try(
async () => await testSubjects.find('comboBoxOptionsList'));
const optionsText = await menu.getVisibleText();
const comboBox = await testSubjects.find(comboBoxSelector);
await this.closeComboBoxOptionsList(comboBox);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I think this comboBox might become stale in some situations.

await this.closeComboBoxOptionsList(comboBoxSelector);
return optionsText;
}

Expand All @@ -301,35 +311,32 @@ export function VisualizePageProvider({ getService, getPageObjects }) {

async clearComboBox(comboBoxSelector) {
log.debug(`clearComboBox for comboBoxSelector:${comboBoxSelector}`);
const comboBox = await testSubjects.find(comboBoxSelector);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Same here.

await retry.try(async () => {
const clearButtonExists = await this.doesComboBoxClearButtonExist(comboBox);
const clearButtonExists = await this.doesComboBoxClearButtonExist(comboBoxSelector);
if (!clearButtonExists) {
log.debug('Unable to clear comboBox, comboBoxClearButton does not exist');
return;
}

const clearBtn = await comboBox.findByCssSelector('[data-test-subj="comboBoxClearButton"]');
await clearBtn.click();
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Maybe clearBtn could also become stale?

await testSubjects.click(`${comboBoxSelector} comboBoxClearButton`);

const clearButtonStillExists = await this.doesComboBoxClearButtonExist(comboBox);
const clearButtonStillExists = await this.doesComboBoxClearButtonExist(comboBoxSelector);
if (clearButtonStillExists) {
throw new Error('Failed to clear comboBox');
}
});
await this.closeComboBoxOptionsList(comboBox);
await this.closeComboBoxOptionsList(comboBoxSelector);
}

async doesComboBoxClearButtonExist(comboBoxElement) {
return await find.exists(
async () => await comboBoxElement.findByCssSelector('[data-test-subj="comboBoxClearButton"]'));
async doesComboBoxClearButtonExist(comboBoxSelector) {
return await testSubjects.exists(`${comboBoxSelector} comboBoxClearButton`);
}

async closeComboBoxOptionsList(comboBoxElement) {
async closeComboBoxOptionsList(comboBoxSelector) {
// List is in a portal, not a child of the combobox, so we don't prepend with the selector.
const isOptionsListOpen = await testSubjects.exists('comboBoxOptionsList');
if (isOptionsListOpen) {
const closeBtn = await comboBoxElement.findByCssSelector('[data-test-subj="comboBoxToggleListButton"]');
await closeBtn.click();
await testSubjects.click(`${comboBoxSelector} comboBoxToggleListButton`);
}
}

Expand Down