Module Tracy Debugger

[Robin S]

Thank you adrian, that file has fixed it.

[adrian]

Ok, the latest version comes with the new Console panel that I introduced a few posts back.

Here are the key points/features on this panel:

• Has full access to all PW variables: $pages, $page, $user, etc
• Works really nicely with fl() calls, but you can also make use of d(), l(), or even simply echo()
• All output is generated via ajax, and so is virtually instant
• No need for editing a template file and reloading the page in browser - simply type your code in the console panel for an instant result
• Only available to superusers
• Caches code in the filesystem so it stored between page reloads, navigation to other pages, and even browser restarts

Note that for those of you upgrading you will need to install the new Process Tracy Console module that is now included. For new installs, this will be installed automatically with the main module.

Remember that this allows you to run any PHP code, so be careful!

Please let me know what you think.

Here are some example calls and their results:

[adrian]

Just added a ToDo panel:

It reports the following comment types: 'todo', 'fixme', 'pending', 'xxx', 'hack', 'bug'

If you have your editor configured, the comment text link opens the file to the line of the comment.

The icon reports: the number of items in the template file for the current file / the total number of items across all files.

Red: there are items for the current page's template file.

Orange: there are items in other files, but none in the current page's template file.

Green: no items in any files under /site/templates/

Please let me know if you find any items that aren't being reported, or items repotred that shouldn't be.

One other key change in the last commit is to the Console Panel - you can now use CTRL+Enter or CMD+Enter to run the code. This keeps your hands on the keyboard and keeps the code textarea focused making it much easier to quickly make and test changes to your code.

[tpr]

Great addition, thanks! Even works in .latte files "{*comment*}".

How about cutting off the comment characters in the panel? That would make todos more readable.

[adrian]

Great addition, thanks! Even works in .latte files "{*comment*}".

Great to hear. I actually just committed a new version that significantly changes how some of the comments are parsed - could you please check to make sure this is still working.

How about cutting off the comment characters in the panel? That would make todos more readable.

I had been thinking about that - you made me decide to go ahead with it. I also added a new column showing the type of the comment to make it easier to scan. I updated the screenshot a couple of posts above. Please let me know what you think and if you have any other tweaks/suggestions.

I have been wondering if anyone might want to configure the comment types that are parsed. As I mentioned above, they are currently:

'todo', 'fixme', 'pending', 'xxx', 'hack', 'bug'

but if some of you use others, then I'd be happy to make this configurable, or hardcode in a few key additions.

[tpr]

Thanks, it's much readable this way.

Some quick tests for comments:

PHP: OK ("//")
Latte: aren't shown ("{*todo this is Latte comment*}")
JavaScript: ("//"): seems not picked up
CSS: nope ("/*todo what is this?*/")
SCSS: nope ("//todo what is this?")

Maybe the panel title could be more readable by removing the brackets.
Also there's no space between the words now: "ToDo(0/3)".
My suggestion would look like "ToDo 0/3"

[adrian]

13 minutes ago, tpr said:

Thanks, it's much readable this way.

Some quick tests for comments:

PHP: OK ("//")
Latte: aren't shown ("{*todo this is Latte comment*}")
JavaScript: ("//"): seems not picked up
CSS: nope ("/*todo what is this?*/")
SCSS: nope ("//todo what is this?")

Maybe the panel title could be more readable by removing the brackets.
Also there's no space between the words now: "ToDo(0/3)".
My suggestion would look like "ToDo 0/3"

@tpr - thanks for your feedback as always.

I have tweaked the spacing and layout of the icon.

As for the comments that are not working for you - I am not sure why - all those were working for me here, except the Latte one which I have just fixed at my end and will commit a little later.

Any chance you could send some scss, css, and js files that aren't working for you so I can test here?

[tpr]

Thanks! As for js/css comments: silly me, they are stripped on minification

My source files are one dir up from /site dir, maybe that's why their comments are not showing up?

But there was an umninified Js file whose comment was shown before the update (baguetteBox.js), and it's in site/scripts folder.

[adrian]

1 minute ago, tpr said:

Thanks! As for js/css comments: silly me, they are stripped on minification

My source files are one dir up from /site dir, maybe that's why their comments are not showing up?

Yeah, that would be it - not sure how to best handle your situation. Currently I search through all files under /site/templates and all subdirectories. Maybe I could just add a config setting for defining additional alternate paths. Do you think one single text field for entering one additional path would be sufficient? It would search this and all it's subdirectories as well.

[tpr]

I'll think about if the config setting is necessary, maybe others could drop in their thoughts on this.

Did you read the last sentence in my previous post? Just edited the post while you replied.

[adrian]

12 minutes ago, tpr said:

But there was an umninified Js file whose comment was shown before the update (baguetteBox.js), and it's in site/scripts folder.

Any chance you can send me this js file?

To clarify - are you saying it worked before my changes here: https://github.com/adrianbj/TracyDebugger/commit/8b3ac0823b72dec2caeb8c72ba4dd443a56ec70a

Anyway, if you can send through, I am sure I can figure out why it's no longer working.

[adrian]

Just to follow up, @tpr figured out why the js file wasn't being parsed for him - it's amazing what a single missing space can do  His PR has been merged and I have also added support for latte {*TODO this*} style comments. If there are any other comment tag types that anyone needs supported, please let me know.

[adrian]

Thanks to some testing by @tpr the ToDo panel now supports the "loud" comment operator (/*!). If you don't know what this is, it lets you write comments that won't be lost when a scss file is compiled or a js file is minified, eg:

/*! TODO that won't be lost when compiled/minified */

This should be very handy if you you have your source scss and js files above the /site/templates/ folder

Also, @tpr mentioned the following which some of you might find useful:

Quote

As for JS, I use gulp-uglify to minify, and I need to set its settings to preserve "license" type comments to make it work. For SCSS it works out of the box.

 

[adrian]

Looking for a little advice.

I have just added ACE Editor to the Console panel (not committed yet):

Questions:

1. Do you think we need an option to revert to a standard textarea or is having ACE loaded the only option ok?
2. This works without having either of the PW ACE modules installed so I am just packaging the ACE core, the PHP highlighter, and one theme (tomorrow_night). Is everyone ok with this, or would you prefer to have the ability to change themes? If I do this, then I will probably require InputfieldAceExtended to be installed to prevent a huge download included with this module.
3. Any thoughts on whether adding a snippets manager to this panel would be useful? It would allow you to name and save code snippets which can be loaded dynamically from a select field.

Any thoughts or suggestions?

Thanks!

[Macrura]

i think the ace is an awesome addition, and can't see why anyone would want plain text..

i'm ok with having the ace in for Tracy, as it could be tricky to handle if someone doesn't have it, and since you only need PHP that makes the requirements less. Adding a config to deal with the big Ace could make things overly complex.

Snippets manager would be great!

[adrian]

Thanks @Macrura - I have gone with your suggestion and packaged the three required ACE files. I thought about using CDNJS instead, but if it's down, things would break and I'd need to add the textarea fallback anyway. This way just seems simpler.

Thanks for your thoughts on the snippets manager - I think it could be quite useful - so expect that to be added sometime soon.

The latest version just committed includes ACE editor, along with yet another new panel

ProcessWire Version Switcher

This new PW Version Panel lets you choose from any of the versions you have available and gives you the ability to switch versions instantly.

The available versions come from Ryan's ProcessWire Upgrades module - so any version that you installed via it will be available.

When you click change, it swaps the names of: wire/, .htaccess, and index.php - much easier than manually renaming.

The icon is green when you are using the latest version that is available on your system, and orange for any other version.

Please let me know if you have any problems with either of these additions.

PS - It's probably obvious, but the switcher is not recommended for live sites, so don't blame me if a version change breaks your site!

 

[netcarver]

@adrian, Git branch integration next? 

[adrian]

Just now, netcarver said:

@adrian, Git branch integration next? 

Hey @netcarver - do you mean as a way to install/switch PW version, or for switching branches of your website code (ie site folder) ? I have actually been thinking about the latter - I think it could be very cool, but I wonder how standard different devs are in their approach to versioning their site folder, vs the website root. How are they using gitignore? 

There are some topics around this, some of which you have contributed to:

https://processwire.com/talk/topic/2885-what-filesfolders-should-be-added-to-gitignore-for-regular-development/

https://processwire.com/talk/topic/8505-pw-and-git/

https://processwire.com/talk/topic/5417-using-git-with-a-cms-for-version-control-and-deployment-on-multiple-machines/

Do you have any specific ideas?

[netcarver]

@adrian, I haven't actually given it much thought yet - that was a spur-of-the-moment posting, though I definitely wasn't thinking of using it for the core.

Now I've spent a few more cycles on it, I can see that I have two different ways of using git for my PW-related stuff;

• For modules - in which case I just symlink in a subdirectory (suitably git init'd) from my master development directory so only some of the subdris in the site/modules/ directory will be git repos.
• For whole sites - in which case I install from the latest zip'd version of PW and then git init in the site/ subdirectory.

I'm sure there will be other ways to do this too.

[k07n]

What about 

if($PwVersion >= 3)

to

if($PwVersion >= 2.8)

?

[horst]

@adrian: I have a question to the snippets collection. Are those snippets only meant to run in the Tracy console? (now powered with ACE!)

 

[adrian]

13 hours ago, k07n said:

What about 

if($PwVersion >= 3)

to

if($PwVersion >= 2.8)

?

Yeah, good idea - I have made those changes locally - they should be committed later today.

 

5 minutes ago, horst said:

@adrian: I have a question to the snippets collection. Are those snippets only meant to run in the Tracy console? (now powered with ACE!)

I think that was/is my thought. I am not sure where or how else you would want to run them. My idea was to just have a way to store common debug snippets and also perhaps admin/db cleanup, manipulation, batch operation type snippets. Maybe you have some better / different ideas to share?

[horst]

No, - no other / better ideas here. Just trying hard to follow up with most of the new stuff here (in the forums).

Wondering how to best store / load / exchange them between different sites / installations. Textarea populated with json or simple json files?

[bernhard]

hi adrian,

thank you VERY much for the console. i will use it a lot i am sure. just used it the first time now and i have some questions/suggestions:

is it somehow possible to adjust the width of the ACE field. or maybe set both ACE and the yellow output panel to 100% with? that would be great in a blank window:

if you click on "open in new window" it opens in a new window but it creates some buggy code:

123foreach($pages->find('id>1') as $item) {    echo $item->title . ' - ' . $item->path . '<br>';}XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

also it would be cool to have the possibility for multiple console windows so that you can have some code snippets open and test different things without rewriting the codesnippet. at the moment it opens the console in ONE window.

 

once more thank you very much for all the work with tracy. it has already sped up my daily pw work and i'm sure the console will save me some hours of reloading the browser in the future  

[lpa]

Any idea why do I get "Error: Unrecognized path" in the console every time I try to run some code?