saucelabs/sample-app-web

Login will fail on a iOS simulator

wswebcreation opened this issue · 2 comments

When you try to test our website on an iOS simulator you will see that the data will be filled into the input fields, but the click on the login button will trigger and error like below

error_iphonexssimulator ios 12_0_2019-02-18t10-26-15 433z

This is a react issue, see facebook/react#10347 and this solution (which customers will never use) https://stackoverflow.com/questions/23892547/what-is-the-best-way-to-trigger-onchange-event-in-react-js

There is a workaround, but if we want to use this app for our (self service)customers they are not able

Basically what happens is that the setkeys in Appium is not triggering the onChange which should update the state. Because the fields are filled, but the state is empty, the click on the login button will trigger an empty state error (no username).

I think our app needs to be smart enough to handle this kind of automation otherwise customers will get stuck after the first test on iOS

I created a dirty hack for my appium scripts for the web that looks like this

    /**
     * Trigger the onChange on an element
     *
     * @param {string} selector the selector
     */
    triggerOnChange(selector) {
        if (browser.isIOS) {
            browser.execute((elementSelector) => {
                let input = document.querySelector(elementSelector);
                let lastValue = '';
                let event = new Event('input', { bubbles: true });
                let tracker = input._valueTracker;
                if (tracker) {
                    tracker.setValue(lastValue);
                }
                input.dispatchEvent(event);
            }, selector);
        }
    }

and you use it like this

        this.username.addValue(username);
        this.triggerOnChange('#user-name');

This has been fixed with Appium 1.17.0 and thus can be closed 🎉