Difficulties with concentration lead to examinations not going as planned

Question

Difficulties with concentration lead to examinations not going as planned

I'm currently running osx 10.9.2, protractor version 0.21.0, selenium-server-standalone version 2.40.0, and chromedriver version 2.9.

I have encountered some issues that I believe are related to a window focusing problem.

When I execute my end-to-end test using protractor, the browser window appears but my terminal remains in focus. This is evident from the fact that "Terminal" is displayed in my menu bar instead of "Chrome" (which indicates which application is active on OSX).

I attempted to resolve this by trying the following without success:

browser.driver.getAllWindowHandles().then(function(handles) {
  console.log(handles[0]);
  browser.driver.switchTo().window(handles[0]);
});

This issue results in certain tests failing. For instance, tests that involve clicking on a field with a bootstrap datepicker do not display the calendar, causing the test to be unable to interact with the datepicker.

The problem is exacerbated when using Firefox. In Firefox, dropdown menus do not appear when clicked if the browser is not in focus.

Interestingly, manually clicking on the browser window after it initially appears allows the tests to run normally.

Attempting the tests on a freshly installed Debian Linux system yielded similar behavior as described above.

Here are links to my configuration files: https://gist.github.com/giosakti/ca24a13705d15f4374b0

javascript angularjs selenium-webdriver protractor

Answer 1

Answer №1

It can be tricky to ensure the correct order of window handlers in IE & Firefox, requiring iteration. Focus on new browser windows/tabs can also pose challenges.

To address these issues, I have created:

A function to help overcome these challenges

// Requires an element to verify the correct popup
var waitForPopUpHandle = function(elm, errorMessage) {
    if (errorMessage == null) {
        errorMessage = 'Expected a new browser tab or window to pop up';
    };
    if (elm == null) {
        throw 'waitForPopUpHandle must have an element to wait for!';
    };

    browser.ignoreSynchronization = true; // not a protractor page
    // IE & Firefox do not guarantee window handler order, so iteration is necessary.
    // Initially, wait for more than 1 browser tab
    browser.manage().timeouts().implicitlyWait(300); // a reasonable wait-retry time
    var i = 0;
    var popUpHandle = browser.driver.wait(function() {
        return browser.getAllWindowHandles().then(function(handles) {
            if (handles.length > 1) {
                return browser.switchTo().window(handles[i]).then(function() {
                    return browser.driver.isElementPresent(elm).then(function(result) {
                        if (result) {
                            return handles[i];
                        } else {
                            browser.sleep(400); // take a break
                            i = i + 1;
                            if (i >= handles.length) {
                                i = 0;
                            };
                            return false;
                        };
                    });
                });
            } else {
                browser.sleep(400); // take a break
                return false;
            };
        });
    }, browser.params.timeouts.pageLoadTimeout, errorMessage);
    // restore implicit wait
    browser.manage().timeouts().implicitlyWait(0); //restore

    return popUpHandle;
};

An example of using this function

var popUpHandle = waitForPopUpHandle(by.css('div.some-element-unique-to-that-popup'));
browser.switchTo().window(popUpHandle).then(function() {
    browser.ignoreSynchronization = true; // not an angular page
    browser.driver.findElement(by.css('div.some-element-unique-to-that-popup')); // wait for the elm
    // your expect()'s go here ...
    // ...
    browser.close().then(function() {
        // This close() promise is necessary on IE and probably on Firefox too
        var mainTab = waitForMainWindow();
        expect(browser.switchTo().window(mainTab).then(function() {
            browser.ignoreSynchronization = false; // restore if main window is an angular page
            // Ensure we are back on the main window
            // ....
            return true;
        })).toBe(true);
    });
});

Finally, the waitForMainWindow function

var waitForMainWindow = function(errorMessage) {
    if (errorMessage == null) {
        errorMessage = 'Expected main browser window to be available';
    };

    browser.ignoreSynchronization = true; // not an angular page
    return browser.driver.wait(function() {
        return browser.getAllWindowHandles().then(function(handles) {
            if (handles.length > 1) {
                var hnd = handles[handles.length - 1];
                return browser.switchTo().window(hnd).then(function() {
                    return browser.close().then(function() {
                        browser.sleep(400); // wait for close
                        return false;
                    });
                });
            } else {
                return handles[0];
            };
        });
    }, 5000, errorMessage);
};

Answer 2

It can be tricky to ensure the correct order of window handlers in IE & Firefox, requiring iteration. Focus on new browser windows/tabs can also pose challenges.

To address these issues, I have created:

A function to help overcome these challenges

// Requires an element to verify the correct popup
var waitForPopUpHandle = function(elm, errorMessage) {
    if (errorMessage == null) {
        errorMessage = 'Expected a new browser tab or window to pop up';
    };
    if (elm == null) {
        throw 'waitForPopUpHandle must have an element to wait for!';
    };

    browser.ignoreSynchronization = true; // not a protractor page
    // IE & Firefox do not guarantee window handler order, so iteration is necessary.
    // Initially, wait for more than 1 browser tab
    browser.manage().timeouts().implicitlyWait(300); // a reasonable wait-retry time
    var i = 0;
    var popUpHandle = browser.driver.wait(function() {
        return browser.getAllWindowHandles().then(function(handles) {
            if (handles.length > 1) {
                return browser.switchTo().window(handles[i]).then(function() {
                    return browser.driver.isElementPresent(elm).then(function(result) {
                        if (result) {
                            return handles[i];
                        } else {
                            browser.sleep(400); // take a break
                            i = i + 1;
                            if (i >= handles.length) {
                                i = 0;
                            };
                            return false;
                        };
                    });
                });
            } else {
                browser.sleep(400); // take a break
                return false;
            };
        });
    }, browser.params.timeouts.pageLoadTimeout, errorMessage);
    // restore implicit wait
    browser.manage().timeouts().implicitlyWait(0); //restore

    return popUpHandle;
};

An example of using this function

var popUpHandle = waitForPopUpHandle(by.css('div.some-element-unique-to-that-popup'));
browser.switchTo().window(popUpHandle).then(function() {
    browser.ignoreSynchronization = true; // not an angular page
    browser.driver.findElement(by.css('div.some-element-unique-to-that-popup')); // wait for the elm
    // your expect()'s go here ...
    // ...
    browser.close().then(function() {
        // This close() promise is necessary on IE and probably on Firefox too
        var mainTab = waitForMainWindow();
        expect(browser.switchTo().window(mainTab).then(function() {
            browser.ignoreSynchronization = false; // restore if main window is an angular page
            // Ensure we are back on the main window
            // ....
            return true;
        })).toBe(true);
    });
});

Finally, the waitForMainWindow function

var waitForMainWindow = function(errorMessage) {
    if (errorMessage == null) {
        errorMessage = 'Expected main browser window to be available';
    };

    browser.ignoreSynchronization = true; // not an angular page
    return browser.driver.wait(function() {
        return browser.getAllWindowHandles().then(function(handles) {
            if (handles.length > 1) {
                var hnd = handles[handles.length - 1];
                return browser.switchTo().window(hnd).then(function() {
                    return browser.close().then(function() {
                        browser.sleep(400); // wait for close
                        return false;
                    });
                });
            } else {
                return handles[0];
            };
        });
    }, 5000, errorMessage);
};

Answer 3

Answer №2

After some troubleshooting, I managed to find a solution! By downgrading Chrome using the installer from this website, the focus issues disappeared (although they still persist on Firefox).

If you search "chrome 34 focus issues" on Google, you'll come across several reports that may be related to this problem. One example can be found at this link.

However, it's unclear whether the issue was a bug or expected behavior of Chrome 34. For now, I've decided to block Google Updater and stick with Chrome 33.

Answer 4

After some troubleshooting, I managed to find a solution! By downgrading Chrome using the installer from this website, the focus issues disappeared (although they still persist on Firefox).

If you search "chrome 34 focus issues" on Google, you'll come across several reports that may be related to this problem. One example can be found at this link.

However, it's unclear whether the issue was a bug or expected behavior of Chrome 34. For now, I've decided to block Google Updater and stick with Chrome 33.

Difficulties with concentration lead to examinations not going as planned

Answer №1

A function to help overcome these challenges

An example of using this function

Finally, the waitForMainWindow function

Answer №2

Similar questions

List-style-type outside of a table's boundaries

Is there a way for blueimp to establish communication with a Java REST service?

Filtering an array of JSONs in Vue.js using a separate array of JSONs

When I try to use Node.js and Express, I encounter an issue where I receive the

How to Efficiently Organize OpenAI AI Responses Using TypeScript/JavaScript and CSS

Unexpected error in boot.ts file in Angular 2

The function image.getState is not recognized (when trying to implement ol in an Angular project)

Guidelines for toggling text visibility based on a randomly generated number with if statements in vanilla JavaScript

Refresh the Server Component once data has been modified by the Client Component within Next.js

Unable to invoke method because ViewChild component is undefined

The checkbox click function is not functioning properly when placed within a clickable column

Learn how to retrieve data using the $.ajax() function in jQuery and effectively showcase it on your HTML page

Utilizing Angular 2's offline capabilities for loading locally stored JSON files in a project folder

A reliable approach for dynamically altering SVG graphics

Is there a way to programmatically trigger the opening of the Inspect Element tool (F12) in

React 15 is found to be incompatible with React-redux due to certain compatibility

What is the process of sending data to another JSP page via AJAX when submitting data to a link within a JSP page?

Is it possible to include if else logic code within a catch statement?

Utilize Ajax to open and close an HTML tag within separate div elements

The solution to the issue: [splide] Unable to find a track/list element