Bug Report - nothing displays in Design View

Wappler General Bugs
#1

OS info

  • Operating System : Windows 11 Version 21H2 Builld 22000.978
  • Wappler Version : 5.1.1

Problem description

When I open one of my pages in Wappler, nothing displays in Design View. This page renders as expected in a web browser. All other pages on my site display as expected in Design View. It’s just this one page that doesn’t display. It just happened today. Last night the page displayed as expected, but today, it doesn’t. The code is there in Code View and all components display properly in App Structure.

Steps to reproduce

  1. Open Wappler
  2. Open the page in Design View
    report1663724081128.zip (88.1 KB)
Design view loses styling after specific changes
Wappler 5.1.4 Released
#2

Having only one page misbehave sounds more like coding errors than a problem with Wappler.

If you want us to help you out, please paste the code of the page here so that we can have a look at it.

#3

Thanks for taking a look, Ben. I understand your logic. It is strange that it’s only happening with one page. What led me to believe it’s an issue with Wappler is that the page renders perfectly in a browser, but not in Wappler’s Design View. Why would the browser not have an issue with the page, but Wappler would have an issue? Please don’t take that question as condescending. I’m actually curious and want to learn from the experts. There is too much code to paste here in the community. However, I’ve uploaded the content page and layout page that Wappler cannot render in the Design View to a share. If you can take a look and let me know if you find any issues in the code that are causing this, it would be greatly appreciated.

You will find the page files here:
https://drive.google.com/drive/folders/1FBJ2k2Z28DlFkIEKvgzH8QpF5fPRhc07?usp=sharing

#4

I am not sure where the problem lies, but I can see the page in Design View.

image
image1920×1048 182 KB

What I did,

  1. created a new page called test
  2. copied the code from member-aws-cp starting with the navbar down to the footer.
  3. copied the script after the footer
  4. continued to copy each segment above the navbar. I.e.
    Modals
    Arrays
    Variables
    Form
    Server Connects
    The rest

And all showed perfectly.

Then I created a new page called junk and copied all from member-aws-cp and pasted directly into the new page. Same problem with no show.

There has to be a glitch, maybe a hidden character or similar that is stopping the page from showing.

I hope this helps.

As a side note, mighty job! Not only from you but also for Wappler being able to cope with 10,000 lines of code.

#5
#7

@patrick Patrick, will you please let me know when you have downloaded the page files from the share? I’d like to remove them from the public share after you have what you need.

#8

I’ve downloaded them, didn’t have time to look at them yet.

#9

No worries. There’s a lot to look at.

#10

I can confirm this issue for me.
After Wappler restart - Design view started to show.

Evidence bellow:

no_nothing
no_nothing2542×1236 779 KB

#11
#12

Fixed in Wappler 5.1.4

#13
#14

@George @Teodor @patrick - The update to 5.1.4 did not resolve my issue. Design view still shows a blank page. I rebooted the server and my laptop after the update and the issue persists.

#15

What exactly is the contents of your page and which frameworks do you use?

Also maybe your page content is just hidden by some css? Does it displays all well in the browser?

#16

The entire page displays perfectly in a browser. It just doesn’t display in Design View in Wappler. There is no css or anything else hiding the page content.

In this posting/bug report, I previously provided Patrick with my content file and my layout file. The files show all of my frameworks. But just to answer your question quickly, the frameworks are App Connect local, Bootstrap 5 local, Font Awesome 5 local, and jQuery Slim 3.5.1 local. The server model is node.js and the links are relative to site root. All code is visible in Code View. However, the Design View doesn’t display the page when I’m connected to any environment, Development (local Docker), Staging, or Production.

#17

I’ve found when the issue occurs. When my code goes over 10,080 lines, the Design View goes blank. When I delete the lines of code over number 10,080, the page displays in Design View again. Have I hit some sort of limit in Wappler?

#18

There must be something on this page that breaks the design view. I’ve seen projects with 23k+ lines of code which work fine in Wappler.