AEM: dialog-ready event not firing in ipad - ipad

I have a multi-field in AEM whose field values are populated on the event "dialog-ready". This is working fine in desktop. But in ipad, the cq-dialog is not opening as a dialog. It opens as a page in full screen mode. Thus the dialog-ready event is not firing and I get a empty field values.

Please try foundation-contentloaded event.

Related

IOS native controls invisible/hidden in PWA

We have a PWA (web app) that the user can add to the homescreen to make it look more like an app. Some users have reported a strange issue that only seems to appear on IOS sometimes when the following step has been made.
Open the app from the homescreen
Use the app for a while
Put it into background
Turn off the screen for a while
Turn the screen back on and put the app to foreground again
The bug is that nothing seems to happen when you click on a select or date input control. First I thought that there was some overlay in the app that was blocking the ui controls but the elements receive focus on click, but not options are shown.
Now it really becomes strange. When I tried to click a little bit under the select input an option was selected. The same thing occured with a time select. If I first clicked on the timeselect input control and then a little bit under, it updated the time.
So, the controls seems to be there but nothing is visible on the screen. I have only been able to reproduce this on my own once but multiple users have been reporting the same thing. The only way to work around the bug is to restart the app.
It seems to be for all native safari controls that shows some kind of modal/popover.
I've did an indepth investigation on this select dropdown problem and posted an issue at bugs.webkit.org: https://bugs.webkit.org/show_bug.cgi?id=238318
It's a problem with dropdowns of several components (such as select, input file/date/month) where either the animation to have the dropdown appear or disappear seems to get stuck. You can sometimes see the dropdown being tiny and very transparent (if you zoom into a screenshot) and sometimes you'll be able to select an option even though you don't see the dropdown.

set programmatically focus when new content is loaded on iOS

I'm trying to set up automatically focus on first loaded article. (f.e. user clicks on the button "load more" and new articles are loaded).
My react implementation:
I'm using ref attribute in <Link> component, which is from react-router library and then I'm calling focus() method in lifecycle method componentDidMount().
It works on all devices except iOS. If I turn on voiceover on iphone and then on webpage I click on the button, it doesn't automatically focus on first loaded article). It works just with html anchor tag.
I read some articles before and it looks that it's not possible to do this in this way but only with firing some event f.e. click event.
Can someone confirm that it's not possible to solve it in this way or there is any workaround without using jquery ?

How to send ENTER key in protractor tests on iOS?

I'm using ProtractorJS (and Appium) to test a website on browsers and devices. One of the tests is to type some text in the search box and then hit ENTER. Here is the snippet from the page object.
page.searchInput.sendKeys("Text");
page.searchInput.sendKeys(protractor.Key.ENTER);
The above two lines work fine on any browser and Android devices. However, the same test fails on iOS because the ENTER key is not sent. In the iOS keyboard the key I have to press is the "Search" one.
The test must trigger the search using the keyboard.
Any ideas on how to send the ENTER key on iOS?
If there is no button on the page, Safari will be stubborn about it and not submit the form. In general, I use the button tag instead of the input tag and have better results, but either way unless there is a submit button on the page, and that button is visible (see this question for reference: How to submit a form when the return key is pressed?), Safari will stubbornly refuse to submit the page. In this case, I would put a submit button on the page even though most users will never use it on mobile. You may have fits getting it past your design department. The other option is to use a blur event and trigger it that way.
You can send just new line symbol \n or create tap by coordinate proportions at the right lower corner of the app.

blur event not firing on iOS Mobile Safari in Sencha Touch

I'm using iOS 5.0.1, and Sencha Touch 2-rc1. I have a search input field where the focus event is getting triggered, as well as the submit event when I press 'Search' on the on-screen keyboard. The blur event doesn't get triggered when I expect it to, which would be when the 'Done' key is pressed, or the viewable area is tapped.
Note that the blur event IS getting triggered on my laptop in Chrome.
Not every element is focusable. At least <div> is not.
onblur is not firing because when a user taps on a div element, the focus doesn't go to the <div>.
Based on this post:
http://snook.ca/archives/accessibility_and_usability/elements_focusable_with_tabindex
tabindex on the correct div element can make a div focusable.
This is likely to be related to the event not "bubbling" up through the DOM. Or perhaps the code you've used includes an event.preventDefault(), but that would have killed more than just blur. I've also had this issue with clicking away from items which appear via javascript.
http://www.quirksmode.org/dom/events/blurfocus.html

autofocus with keyboard in an ipad html5 site

I'm working on an html5 app that will be used on iPads in a kiosk mode. The first thing users must do is sign in, so when the homepage loads, I'd like the onscreen keyboard to popup with the focus in the first field.
I've tried all the variants I can think of, including
html5 <input autofocus> attribute
calling document.getElementById("nameFirst").focus() in window onload
same as the previous, but the onload calls a timer method to invoke the focus call later
Has anyone figured out how to make the keyboard automatically appear?
Mobile Safari doesn't allow keyboard showing up without user touching text input element. I think it's by design.
http://www.quora.com/Mobile-Safari-iPhone-or-iPad-with-Javascript-how-can-I-launch-the-on-screen-keyboard

Resources