Monaco editor - Format Document options not available

Wappler General Bugs
#1

It’s great to have the new code editor for PHP files, but one of the features I was particularly looking forward to was the code formatter; unfortunately it doesn’t seem to be available.

It was mentioned that this might be implemented as an automatic on save feature (hopefully with a setting to make this optional). I imagine this has just not been implemented yet, but I thought I would mention it in case it’s a bug - or if there is some way of enabling which I’ve missed.

The right-click panel omits the formatting options for PHP files. However, the options do still appear for HTML files - but they no longer work.

#2

What do you mean? What’s not working?

#3

For PHP files, the formatting options don’t appear:

image

and they’re not in the list which appears if you choose Command Palette.

For HTML files, the option do appear. I’ve selected a DIV where I’m messed up the format:

image

so I’ll have options to format either the selection or the whole document

Unfortunately the options don’t have any affect. (Except strangely, a selection was reformatted on one occasion - but I can’t reproduce it. This was with an HTML file I’ll try again with different files.)

#4
#5

It seems to be working now for HTML files. I’ve restarted Wappler a few times and recreated the dmxConnectLib folder folder, in case that might have made any difference. It works with the shortcut keys and the right-click menu. I couldn’t get it work with either before.

It still doesn’t work with PHP files. Perhaps that’s not implemented yet. However I found out something which surprised me about Wappler and includes.

I duplicated a PHP file and gave it an .htm extension, so I could try out the reformatting. Most of my files are PHP files. The file contains four PHP includes and I assumed these sections of the file wouldn’t be visible, but the formatting would work anyway. I was surprised to find that the includes displayed just fine, even with an .htm extension. (Obviously the includes don’t appear in the browser.)

#6

The monaco editor handles php files differently, it has only syntax highlighting support build in and doesn’t support mixed modes. We are working on extending the monaco editor, but that takes some time. If you want to format the html in a php document, you can change the language mode to html, then the format document and auto completion from html are available.

#7

I can’t say I am overly impressed by this Monaco editor. When you select something in Design view and change to code or split view the code is not highlighted. Also when you select a tag it highlights all the matching tags. I’d prefer if I select ta tag it only highlights the closing or opening paired tag. I am finding this new code editor less than useful.

#8

Hi @brad, the function is there, just not implemented in the theme that you are using. Switch to Textmate and you can see for yourself.

image
image.png781×561 19.9 KB

#9

Thanks Ben, I have played around with those settings. In my opinion the new code view is still horrible. Code doesn’t get selected and the formatting is atrocious. MAybe once the formatting options are available I will change my mind on the formatting. But for me the lack of highlighting is a huge downgrade.

2 Likes
#10

Don’t judge the king by its clothes Brad :slight_smile:

Color themes are just different and also highlighting but we are fine tuning those.

#11

I have no issues with the different themes. There is a good selection. But it was mentioned either in this thread or somewhere else that the code editor was now complete and would be moved from experimental next week if no issues.

I see an issue. It’s all but useless. Even the auto close tags doesn’t work. It’s not even close to ready. Definitely not up to the standard we have come to know from he Wappler Team. As is, it’s really nothing more than a themed text editor. :frowning:

#12

Thanks Patrick. That solution works very well. I hadn’t noticed that option before.

1 Like
#13

We should probably enable this option for default for all files that have design view @patrick

As those are html based even if the extension is php

1 Like
#14

It seems to be working pretty well for me. The syncing is really good. I would say highlighting is better and code completion is good too. I would still like to be able to edit the highlighting if possible but I’m still experimenting with the themes.

I noticed the strange highlighting you mentioned - where all divs for example were selected. This seems to have gone now or perhaps it was with a particular theme.

#15

That’s strange, as I don’t get any code completion at all?

#16

@brad, if there are issues with the editor please post them in separate topics explaining more detailed what the issue is and how to reproduce it. Saying it’s not working or it’s useless doesn’t help us improve it.

The Monaco editor is still an experimental feature, which needs a few more improvements.

Please post this in separate topic and explain what file type are you working on and exact steps to reproduce.

Please explain this in a new topic, more detailed with exact examples.

Please explain this in a new topic, providing more details like the file type you are working on and what doesn’t work exactly.

#17

I’m not quite sure how it works. When I first tried it, it seemed to work as expected, eg:

image

but the list of options which appears is related to recently-used words. I mentioned this after an earlier release, thinking it was a bug, but I think it’s a (potentially useful) feature.

A powerful aspect of code completion is due to Emmet being built in. Eg if I start to type and the editor recognises an abbreviation, you will see something like this:

image

and pressing the Tab key will produce:

image

… with the cursor position so you can start typing.

Or, another example:

image

will produce:

image

Anyway, I think there’s lots to discover. The code formatter alone is something which makes it a big upgrade from my point of view - after @patrick’s tip about getting it to work with PHP files.

#18

I had come across but didn’t know in what circumstances. I think this is the issue:

image
which is very annoying if you want only the opening and closing tags to be highlighted.

This happens if the Language Mode is set to PHP. If you switch it to HTML (even for PHP files), the selection works as you would expect. This is also what’s needed for the code formatter to work as mentioned earlier so it’s generally the best option.

#19

You can turn that off in the options.

image
image.png794×600 19.1 KB

#20

Thanks Patrick. I thought that referred to highlighting search results. (The search facility in the new editor is a huge improvement.)

Is your version different to mine or have I missed a setting somewhere? I’m missing a few options:

image