Warning before code rewriting

I just updated a couple of pages on a site I had transferred from Dreamweaver to Wappler. I made a few simple changes to some text on a static page and uploaded it. I should have checked first - Wappler had attempted to update the code and the result was somewhat chaotic; the layout was all over the place. I used a backup and did the update in DW.

The site has changed little in the last 16 years (except for the main content which is updated via a MySQL backend). I appreciate that Wappler thought a few improvements were due and had a go - but the result wasn’t an improvement.

It would be a good idea - and reassuring - if Wappler would give a warning before updating HTML or rewriting any existing code. Perhaps it could offer to make a backup if you choose ‘ok’.

Hello Tom
What exactly was rewritten on your page?

Wappler had made various changes which are unlikely to cause a problem, eg:
<br /> to <br>
<?php include("footer.php"); ?> to <?php include 'footer.php';?>; ?>
It also appended the <head> tag to the previous line rather than keeping it on its own line. Similarly with </html>. I don’t know why it should make these changes.

What caused the problem was including <tbody></tbody> tags where there weren’t any before. Perhaps not surprisingly, Wappler didn’t realise this page included some nested tables and trying to work out how to update such a page was too much.

I don’t expect Wappler to do anything useful with such ancient HTML, but in such cases (and generally), I would prefer to know if existing code is being rewritten. An option to display warnings or not would be ideal.

Of course I can continue using DW for such sites, but I would rather use Wappler. However, in this case there doesn’t seem to be any way of preventing Wappler from destroying the page. (I know, I could redo the website… and one day I’m sure I shall.)

I have started rewriting some of my documents and templates to adhere to the Wappler workflow. I find that Wappler keeps a far better check on my code than my previous editor.

As an example, using Bootstrap, I am forced to use

container -> row -> column

If i want to keep the App Structure happy. This is good practice as are the changes that you have shown above.

I agree - and I’m not against being encouraged (even forced) to follow best practices. Having said that, Wappler doesn’t yet recognise all the elements it should (as you’ve mentioned before). I recently used a structure like this (within a container):

<dl class="row fulldesc text-info"> 
        <dt class="col-sm-3"></dt>
        <dd class="col-sm-9"></dd>
</dl>

…and Wappler didn’t recognise any of the tags.

My specific concern is the feasibility of maintaining old sites, which isn’t a problem within Dreamweaver - and essentially is something Wappler is more than capable of. However in the case I mentioned, it’s not possible - but would be if Wappler gave an option, for cases such as these, not to ‘improve’ the code.

I would like such an option anyway - either to warn you that changes are going to be made, or, ideally, to display a list of changes which it considers need making. I think a concern people have about code generators of any sort is the fact that you are not in control; with this feature, you would be.

To understand what is going on here, I will explain the inner working of Wappler when working with a HTML dom.

First note that Wappler is build on top of the latest Chrome dom engine, so the dom processing is entirely done with the chrome native dom parser. Which is actually a very good thing as it enforces you to have a valid html structure depending on the doctype you use. So the dom parser always makes your html dom valid just like in the real browser.

That is why you see some missing elements added like thead because that is what happens in the real browser as well.

The php code we handle by ourselves and the right syntax is enforced there. If you check the php docs you will see that having the file name in enclosed in () is not really valid any longer but works for compatibility.

As for the App Structure that is just another view on top of the html which only shows the elements we recognize in the currently included frameworks. So that is definitely not all html tags but just the known components. For all html tags you should check the Dom Tree

Thanks George. It’s useful to have a little ‘under the hood’ information and it all makes sense. I thought something like this must be going on to explain the variations when viewing a document using the DOM and the App Structure panels.

I appreciate too that you don’t want to encourage or generate any non-standard or non-current code - and I’m not suggesting you should. For a user starting with Wappler from scratch, this wouldn’t be an issue. However, I imagine a lot of your potential users, at least at this stage, may be current Dreamweaver users. I expect they will be impressed at how easily they can transfer their sites from DW. They might not be so impressed if Wappler rewrites old code, causing pages to break - particularly if they find they’ve updated their live sites automatically (which is easy to do - perhaps too easy).

I don’t think you need change anything - except perhaps optionally interrupt the code rewriting process with a warning message, and an option to cancel (ideally with some explanation). If users choose to disable this message - of if it’s never relevant anyway - then it would hardly be an issue. Perhaps you check the DOCTYPE and only display a warning if it indicates the page is probably old.