Opened 8 years ago

Closed 7 years ago

Last modified 7 years ago

#8034 closed bug (notabug)

Malfunction after cancel the "onBeforeUnload" prompt in Android Browser

Reported by: pigletso Owned by: pigletso
Priority: minor Milestone: 1.10.0
Component: ui.dialog Version: 1.8.17
Keywords: Cc:
Blocked by: Blocking:

Description

Browser: Android browser (Android 2.3.5)
Version: 1.6.2 & 1.7.1(Jquery), 1.8.16 & 1.8.17(JqueryUI)
OS: Android

I was developing a website using UIDialog and using "onBeforeUnload" javascript method to warn use when leave the page.

Desktop browser chrome and firefox works great but I tried in my Galaxy S2 with Android version 2.3.5 default browser and malfunctioned.

Here are the steps to the bug:

  1. Create a webpage with a button to open a UIDialog.
  2. Setup the "onBeforeUnload" javascript method.
  3. Use Android browser to open the webpage.
  4. Exit the page and press "Don't exit" when asking if you want to exit.
  5. Press the button to open the UIDialog.(<- cannot setup UIDialog in my main project, failed in $('#dialog').dialog({}) function)
  6. Try to close the UIDialog.(<- cannot close in my blank test page(I just pressed the right upper corner "x" button of the UIDialog))

Here is the test page I used(Jquery 1.6.2 & JqueryUI 1.8.16):

<!doctype html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>
            Moblie test page
        </title>
        <!-- JQuery -->
        <script src="jqueryui/js/jquery-1.6.2.min.js"></script>
        <!-- JQuery UI -->
        <script src="jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script>
        <link rel="stylesheet" href="jqueryui/css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css" />
        <script>
            function popup(){
                $('#dialog').dialog('destory');
                $('#dialog').dialog({
                    modal: true,
                    title: "popup"
                });
            }
            window.onbeforeunload = function(){
                return "Click false and try popup again.";
            }
        </script>
    </head>
    <body>
        <input type="button" value="Popup" onclick="popup();"/><br />
        <input type="button" value="Exit" onclick="window.location.reload();"/>
        <div id="dialog">
        </div>
    </body>
</html>

Change History (13)

comment:1 Changed 8 years ago by tj.vantoll

Test case - http://jsfiddle.net/MbNfr/3/embedded/result/

On Android 2.3.4 I wasn't prompted in the default browser when I clicked the Exit button, it just refreshed the page. I couldn't find anything online about Android's support of the function. Running typeof window.onbeforeunload returns function, but it doesn't seem to do anything. Since I wasn't prompted when I clicked Exit I can't recreate this issue and don't really know how I could.

Anyways, you have "destroy" spelled wrong on this line, which might create issues.

$('#dialog').dialog('destory');

comment:2 Changed 8 years ago by Scott González

Owner: set to pigletso
Status: newpending

@pigletso Does tj's test case fail for you?

comment:3 in reply to:  2 Changed 8 years ago by pigletso

Status: pendingnew

Replying to scott.gonzalez:

@pigletso Does tj's test case fail for you?

It worked the same as you mentioned: it just refreshed the page

And desktop browser worked well.

May be this test have to work with real page instead of jsfiddle?

Thank you for the wrong spelling issue.

comment:4 Changed 8 years ago by Scott González

Status: newpending

@pigletso Ok, can you try against http://jsfiddle.net/MbNfr/3/show then? That will render the same code but as a normal page, with nothing from jsFiddle present. If that page also works for you, then we can dig into the differences between that and your code and figure out what exactly is causing the failure.

comment:5 in reply to:  4 Changed 8 years ago by pigletso

Status: pendingnew

Replying to scott.gonzalez:

@pigletso Ok, can you try against http://jsfiddle.net/MbNfr/3/show then? That will render the same code but as a normal page, with nothing from jsFiddle present. If that page also works for you, then we can dig into the differences between that and your code and figure out what exactly is causing the failure.

This time my android browser could cancel from exiting the page, but it failed when I want to popup the UIDialog again.

Failed at the fifth action

  1. Press the button to open the UIDialog.

comment:6 Changed 8 years ago by tj.vantoll

I'm seeing the issue now as well. This does work on mobile Firefox.

comment:7 in reply to:  6 Changed 8 years ago by pigletso

Replying to tj.vantoll:

I'm seeing the issue now as well. This does work on mobile Firefox.

Yes this is work on Firefox but I was targeting the default Android browser one.

I also tried in other mobile browser, some of them were created by using WebKit was failed in this test too.

comment:8 Changed 8 years ago by tj.vantoll

If I remove $('#dialog').dialog('destroy') this works fine - http://jsfiddle.net/MbNfr/5/show/

That line is unnecessary, the code is smart enough to reuse the same instance since you're using the same div. Also, in 1.9 calling destroy before initialization throws an error (see #5972).

comment:9 Changed 7 years ago by Scott González

Milestone: 1.9.01.10.0

comment:10 Changed 7 years ago by bavanyo

Status: newopen

comment:11 Changed 7 years ago by Jörn Zaefferer

If I remove $('#dialog').dialog('destroy') this works fine

So is this issue invalid then? Looks to me like that.

comment:12 Changed 7 years ago by mikesherov

Resolution: notabug
Status: openclosed

This issue IS invalid. Seems like it was erroneously set to open before tj. vantoll had appropriate privileges to close this.

comment:13 in reply to:  12 Changed 7 years ago by tj.vantoll

Replying to mikesherov:

This issue IS invalid. Seems like it was erroneously set to open before tj. vantoll had appropriate privileges to close this.

Correct.

Note: See TracTickets for help on using tickets.