Design View Stuck/Unresponsive - when using onbeforeunload

Wappler General Bugs
#1

Wappler Version : 4.1.2
Operating System : Windows 11
Server Model: Node v14
Database Type: MySQL
Hosting Type: Docker

Expected behavior

The design view should refresh after every update.

Actual behavior

Design view is not updating and forcing me to close then reopen the document.

How to reproduce

I’m unsure how this could be reproduced as it has just started happening randomly today.

The steps I have taken to remediate the issue are as follows.

  • Restarted Wappler. Same issue after a minute of working.
  • Closed Wappler, deleted the roaming folder, then reopened Wappler. Same issue after a minute.
  • Uninstalled Wappler, deleted the Roaming folder, restarted PC, reinstalled Wappler. Created a new document to rebuild the one I was working on (in case of any bugged code I could not see). Worked for an hour before the same error started to occur.

Wappler - The Visual Web App Creator 2021-10-14 23-42-02

Wappler 4.2.0 Released
#2
#3

MacOS, v4.1.0

I have come across a similar issue where the design view doesn’t update when making any changes in the code view. Also, when this happens, no element in the design view can be selected to navigate to that code directly. It can happen anytime when working. The only way to resolve this issue is to restart wappler.

#4

Hey, I restarted Wappler with logging and have attached the log file. As you can see, webview errors out with Error occurred in handler for 'GUEST_VIEW_MANAGER_CALL'

As at the moment, Wappler has become almost unusable from a visual standpoint. I also just updated to 4.1.3 about 15 minutes ago.

wappler-log.zip (3.5 KB)

#5

Well it seems somehow this specific page crashes design view.

Do you have only problems with this page?

Can you try to isolate which part of the page is causing troubles by start rebuilding it in small steps and adding the different components one by one till you add the troubles some one.

#6

btw if design view gets stuck and refresh no longer works - the editor tab close and reopen should be enough to load it working again.

#7
#8

Btw are you refreshing the design view a lot manually? Maybe this causes the problem eventually …

#9

Hi George,

I think I may have figured out the issue.

In the error console just below the design view, I noticed I finally got some errors that weren’t there before. They pointed to a ‘beforeunload’ event listener I have to warn the user their data won’t be saved if they navigate away from the page. Because there is only a load event on App Connect, I needed to add this to the bottom of the content page.

I assume that because of this script, and because there is no browser alert box in the design view, that it may be getting stuck behind this?

I have taken this script out for the time being and the design view is going strong for now, no issues yet.

No not usually. I was looking to see if there were other errors or the same error being thrown in the logs.

#10

Great catch! That was it! the onbeforeunload event handler was actually prevending the design view from refreshing - and getting it stuck! So that was the root cause!

Now we have a case to reproduce so we can solve it!

Thanks a lot!

#11
#12

Awesome! Hopefully we’ll have some more event handlers for navigating away from page one day. At least this wasn’t a bug. I thought Windows 11 was a bad choice to upgrade to for a while there.

I have just created a modal, rather than a new route, so I can control the navigations.

Thanks George!

#13

will be fixed in the next update - now we just ignore any onbeforeunload events in design view - you always want to be able to refresh there.

1 Like
#14

@George, Just as a matter of clarity, here is the offending code I was using. :slight_smile:

    window.addEventListener('beforeunload', function (e) {
        e.preventDefault();
        e.returnValue = '';
    });

    window.addEventListener('unload', function() {
        dmx.parse('content.guard_datastore.clear()');
        dmx.parse('content.phone_holding.clear()');
        dmx.parse('content.email_holding.clear()');
    });

    window.addEventListener('load', function() {
        dmx.parse('content.guard_datastore.clear()');
        dmx.parse('content.phone_holding.clear()');
        dmx.parse('content.email_holding.clear()');
    });
1 Like
#15
#16

Fixed in Wappler 4.2.0

#17
#18

This topic was automatically closed after 46 hours. New replies are no longer allowed.