Process Javascript in inactive tab on iPad - javascript

I have this solution that takes the user through a series of questions. At the end the user can click a button that opens a new window with a form to enter contact info. The population of this popup window is done through JavaScript from the calling window.
The process (in JS) is this:
Open popup window with loading gif
Store additional information remotely through ajax
Populate popup window with contact form
This all works fine in desktop browsers but not on iPads (using Safari where all windows are displayed as tabs). I have a suspicion that the JavaScript in the parent tab is halted when the "popup" tab gets displayed. To support this theory I can actually get the popup tab populated if I switch back to the parent tab immediately after the popup tab is displayed.
Can anyone confirm this? And of course if there's a solution I would very much like to hear about it.
Needless to say it works like a charm on my Android tablet :-)

Try using window focus and blur to activate some javascript when the focus is back on your tab.
See: https://stackoverflow.com/a/3479936/1712686

Related

Javascript : Alert Box dismissed when tabs switched

How not to allow Alert Box to be dismissed when tabs switched.
Using alert("Test"); on Google Chrome, when you switch tabs, the alert dialog box disappears, and when you're back on the same tab you have full access.
What I want is to do the same thing as stackoverflow website when you create a question and try to close the tab, there's a dialog box that pops up that doesn't allow you to go anywhere until you choose between (Leave or Stay).
IE and Firefox work differently, I mean block the tab when using alert("Test"); statement but Google Chrome doesn't block.
I sent a bug report to Google but they replied to me that :
This is working as intended, see Issue 629964.
It's not a security bug; a user could make the dialog box disappear with developer tools or myriad other tricks as well.
I was able to get around this issue by calling my javascript alert in an iframe
I would like to point out that this appears to have reached a compromise; current (Version 110.0.5481.104 (Official Build) (64-bit)) shows alert() and confirm() on the tab, but do not prevent going to another tab.
When user returns to the original tab - the message box is still there waiting for them.
So this allows persistence, without "hijacking the browser". :)

Upload image in chrome extension and extension popup closes

I need to upload image with chrome extension, when file browser is clicked the extension popup closes. How can I handle both the file browser and popup to remain open.
It's a tricky question to answer.
The basic idea is that whenever the popup window loses focus, it is supposed to immediately close, which entails the destruction of the popup's JavaScript context (and your logic breaks as a result). This is not something you can influence.
Modal dialogs such as the file input ought to be an exception, but that doesn't work consistently across all platforms Chrome runs on. Evidence: question, bug.
Whenever you want something to survive popup closing, you normally put it in the background page. This lead to this workaround that places the File input in the background page and triggers its selection from the popup. But there's (unconfirmed) evidence that this does not work anymore. The question above has another, supposedly working answer by injecting the input tag into the current page, but that's subject to failing on "unscriptable" pages such as Chrome Web Store or internal chrome:// pages.
The safest way would be to open a separate tab or popup window to handle the process. This is obviously awkward UX though.
Not sure if you'd actually want to do this, but if you have a small app and it's not a main feat (or you've got high hopes of chrome dev's solving this issue) - as a temp solution you can ask your users to open dev tools while uploading files, popup won't close.
Though you're better off putting your logic into a separate file (eg 'background.html') and opening it from popup as a tab like this:
chrome.tabs.create({url: chrome.extension.getURL('background.html')});

Parent window freezes when window.open which triggers print onLoad

I have a scenario where in my webpage i do a window.open() which opens up another window whose onLoad() invokes window.print(). In this flow, the parent window remains frozen disallowing any links to be clicked on. How to I get away with this problem?
For example:
An HTML page has three links: create, manage and print. The javascript code for the print link is the following:
var url = '/actions/print/';
var win = window.open(url,"Title_","resizable=yes,scrollbars=yes,directories=no,titlebar=no,location=no,status=no,menubar=no,width="+width+",height="+height);
now, the HTML rendered by /actions/print is:
<html><body onload="window.print();"> ... Content goes here ...</body></html>
So as you can see, clicking on print opens up a new window and triggers print immediately. In this state, when i go back to parent window with three links and try to click on other links, it doesn't work and appears frozen.
You can't resolve this issue on OS X. Which I am pretty sure you only tested on.
Here is how I came to that conclusion after testing on different browsers and plateforms.
Chrome, Safari and Firefox on OS X did not allow interactivity with parent window when a print modal was opened from a child window (closing the print dialog, but not the pop up, re-enabled interactivity).
IE8 on Win XP, IE11, Chrome and Firefox (all on Win7) always allowed interactivity with this same scenario.
This led me to believe this was an OS X restriction or recommendation. On further research, here is what I found on developer.apple.com, confirming my doubts:
A document-modal dialog prevents the user from doing anything else within a particular document. The user can switch to other documents in the app and to other apps. Document-modal dialogs should be sheets, which are described in Using Document-Modal Dialogs (Sheets).
Use a sheet when multiple documents can appear in a single window at different times. For example, a tabbed browser can display different documents in a single window at different times. A sheet is appropriate in this situation, even though it applies to only the document that is currently visible in the window. Because users must in effect dismiss the current document before viewing a different document in the same window, they should first dismiss the sheet.
https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/WindowDialogs.html

OnUnload not working in chrome and opera

I know there are many links regarding Onbeforeunload,BeforeUnload and Onunload events of JavaScript which have some cross browser problems. After going through, possibly, all the questions, I want to ask this again
Is there any way so that onunload can work for Chrome and Opera?
I don't want to use onbeforeunload as it pops up before closing window.In my application user clicks a "Save And Exit" button after which an alert box is popped up showing "Your details are saved" with OK button. clicking on OK button redirects user to a new popup asking the window is about to close with yes and no buttons. onbeforeunload event as returns a string, hence it doesn't allow me to show the "AlertBox" asks for leave this page and stay on this page. which is not in alliance with my application requirement as i want as alert box. (working fine in IE, not working in Opera and chrome).
i am using unload and onbeforeunload events from code behind c#

avoid the confirm dialog box when trying to close IE popup

How to avoid the confirm dialog box “the web page you are viewing is trying to close the window” when trying to close IE popup?
Make sure the window you are trying to close is one you opened with JavaScript, and not the one the user arrived at your site with (complete with history they might want to go back through).
This hack used to work in IE, but not sure if it still does:
window.opener = window;
window.close();

Categories

Resources