Select box automatically opens on clicking button in Chrome Android and Chrome Responsive Mode using IONIC FRAMEWORK - angularjs

Short description of the problem:
I have a form in which a group of fields in repeated based on an array of objects.
There is a button which pushes an object into the array. So the user can add as many groups as he like one by one.
There is a select box as the first element of this group.
However, upon clicking the button, the select box is opened automatically after the new group appears.
Steps to reproduce:
1. Visit http://52.66.117.243/app-test/ for testing.
2. Scroll down and click on add more button.
3. The new select box for title automatically opens
Chrome in responsive mode is also able to reproduce the problem
I think the issue might be due to the click event passed on to the newly added select box since the position w.r.t screen of the button is occupied by the new select element. However, I cannot be very sure.
Interestingly, a small timeout before adding of the new elements seems to solve the problem.
If the problem is indeed the click event being propagated, can someone be kind enough to explain what is causing it, event bubbling/capturing on the ng-click or something else ?
Thank you.

Related

UI5 CheckBox Issue in sap.m.Table

I have an sap.m.Table populated with a number of items. One of the columns in the table contains a checkbox allowing the user to select / deselect it for a particular item.
I have an issue where the table scrolls automatically in the following case:
I change focus to another application on my computer. The specific application makes no difference.
I return to the UI5 application containing the table but I do NOT click anywhere in the application.
I scroll down the list using my mouse scroll wheel. I still have not clicked in the UI5 app in any way including the table's scroll bars so focus is still not in the UI5 app.
I select / deselect the check box for any random item in the list that within view which obviously places focus back to the UI5 app.
The list then scrolls on it's own as if it returns to the position in the list prior to the scroll being performed in step #3 above and selects / deselects a checkbox for a completely different item. It as if the list is retaining it's visible position on the screen and returns to that position to make it visible again on the screen.
If anyone can shed some light on this, requires further clarifying details and/or can suggest a work-a-round that would be great.
Thank you
*** UPDATE ***
December 16, 2022:
Here is an example in CodePen. I additionally noticed that it only happens if I first select a check box for an item, change focus to another application, then return to the UI5 app as per step #2 above.
*** UPDATE #2 ***
Thank you #Marc who identified work-a-rounds as per his comment below.
z

Scroll down on the terms and condition Textbox and click on Agree selenium

I am working on Protractor tests. Recently my web page changed where the terms and conditions are inside a textbox. Button Submit works only when the user scrolls through the textbox and clicks on Agree button. I tried the following option to scroll down but it is not scrolling down. Any help is greatly appreciated.
var scrollbar = element(by.id('terms-conditions'));
var checkbox = element(by.id('checkbox'));
scrollbar.click()
browser.executeScript('arguments[0].scrollIntoView()', scrollbar.getWebElement());
browser.executeScript('window.scrollTo(0,670);')
checkbox.click();
I followed the below link too but no luck.
Protractor: Scroll down
The second js execute statement you are using contains Window.scrollTo which references an open window in a browser. and using it only scrolls the complete window but not the pop-ups that appear inside a browser window
Refer here for documentation on Window.scrollTo
Normally terms and conditions shows up in a pop-up or may be a div and hence Window.scrollTo doesn't work
there are two ways you can do it
SOLUTION 1: use Jquery scrollTop() to scroll inside a specific webElement
Step 1: Identify the exact div that holds your terms of Service scroll bar
Step 2: Refine your js statement by trying directly in Chrome console
$('.modal-body').scrollTop() -> This returns the current position of scroll
$('.modal-body').scrollTop(10000) -> This sets the value of top position
Step 3: Incorporate this in your protractor script
browser.executeScript('$('.modal-body').scrollTop(10000)');
You can professionalize this by passing the element & scroll amount as arguments. Refer here
SOLUTION 2; The best way I see to submit a pop-up is not to deal with interface but to deal with the 'form' element behind it. Similar to how we deal with file uploads.No fuss & effective
May be try something like this, by making button visible first and then submit form
browser.executeScript is an asynchronous call, so you will need to put it into the controlFlow so that it will complete before clicking the checkbox:
scrollbar.click();
browser.controlFlow().execute(function() {
browser.executeScript('arguments[0].scrollIntoView()', scrollbar.getWebElement());
browser.executeScript('window.scrollTo(0,670);');
});
checkbox.click();

accessing invisible popup in selenium webdriver?

in a interview they have asked below questions please tell me code or approach ...
1-how to access invisible popup.in selenium alert pop can be accessible using alert.accept() but if alert popup is invisible then how can we use.
2-code for automatic image display slider,some image slider has next and previous button we have to click next or previous so please let me know how to develop it in both way by clicking next button on image or automatic image display slider
i am using selenium web driver,java,Firefox
thanks a lot
For the 1st question, AssertEquals will help us to go through invisible pop-ups and for the second one, I am not sure that they have asked the slider next or previous button will be on image....if it is outside image, then we can verify that if its present than click on particular id else not.

The whole app shifts towards left when Internet Explorer is not expanded to its whole width and length

I have reduced the length and width of IE browser window. The app loads properly for the first time. Now I have a form which opens on the click of a button on my Homepage. In the form, if I leave a field invalid and I click on save, the code is written such that if there is any field invalid, it will focus on the invalid field. So, with IE10 browser window small, when I leave a field in this form invalid and click on save, the whole app shifts towards left inlcuding the form and the fields inside the form. I have no clue why this is happening. I am using the following code to focus on the invalid field,
child.getEl().dom.scrollIntoView();
I am aware that there is some bug with scrollIntoView when using IE browser. Can someone suggest me the alternative to scrollIntoView()? Thanks in advance!
Used the foloowing instead of scrollIntoView(),
1) field.getEl().focus() to focus on invalid field
2) panel.body.el.scrollTo('Top',0,true) to scroll the form to the top every time we open it

Celerity - Help with popup_browser select list that updates div text on main browser

I'm screen scraping a page that includes a link that spawns a popup window that is comprised of a select list and a button to execute your selection. The objective is to click the link on the main page, make a selection on the pop-up window, click the link to confirm the selection and then view the new selection on the main webpage.
Here are the steps that I'm taking in Celerity and the results:
popup_browser = browser.image(:alt, 'Holidays').click_and_attach
#this creates a new browser to deal with the popup window
popup_browser.select_list(:id, 'ddlSlot1').select_value('Christmas')
#Selecting Christmas from the select list
popup_browser.link(:id, 'btnChangeHoliday').click
#Confirms/Implements selection
popup_browser.close
#Closes popup browser
puts browser.div(:id, 'HolidayName').text
#Here I try to print the updated holiday but nothing is printed (no text value)
Everything seems to work fine except for the last line. I've done some debugging and have confirmed that my selection has been made. It seems that the main webpage is not being updated after I click the ChangeHoliday button on the popup page.
Any thoughts or suggestions would be appreciated.
Thanks in advance for you help.
This turned out to be an easy fix. The only change required for the script to work is to add the resynchronize option to the browser initialization. After doing so the script works as expected.
browser = Celerity::IE.new(:resynchronize => true)

Resources