cancel
Showing results for 
Search instead for 
Did you mean: 

Code Editor: Overall Suggestions for Improvement

Here is a general set of recommendations for improvement of the Code Editor within PowerApps.  Some of these have been covered by other ideas, but I wanted to consolidate many of these, as well as add a few:

 

A few "low hanging fruit" items in the current code editor though would be VERY useful:

 

Proper handling of keyboard for a real editor - ie:

  • Enter key should go to new line, as it did prior to the most recent update.  Should be no reason to have to hit SHIFT-Enter (please do not follow the Excel model)

  • Tab key should indeed insert a Tab or four spaces (probably the latter is better) and not try to do ANY sort of autocomplete.  If this is seen as a necessary feature (autocomplete), please do so with another key or else a modifier on tab (shift-tab, etc), though Tab itself should do exactly what the key was intended to do when in the editor. 

  • Search/Replace hotkey (preferrably Control-F as in most editors, though may be problematic due to browser so other key is ok) - This would search the text in the current code editor, with option to replace.  See further bullet below
  • Alt-(Mouse Hi-Light) to selectively highlight a block of text NOT starting at the beginning of the line..  ie: if I highlight text starting at column 20 through column 50 on the first line, as I move down, only those columns should be selected a rectangle, and when I copy that, only those items should be copied.  
    Pasting in such a copied block, should also paste in a similar fashion (ie: say I move down and click on column 10, then each line from the copied block should also be pasted in starting on line 10).  
    This is similar to most code editors including Microsoft Visual Studio - and is VERY useful)

On the above, please look to your own products such as Visual Studio / VS Code (not Excel) for good examples of how the editor should do things.  Understand that a large portion of your target market is people who have experience in Excel - but this is not a good model, and I imagine event frustrating for them (while Excel does use SHIFT-ENTER for things, how many would like to see SHIFT-ENTER being the only way to get to a new line in MS Word?  🙂 ).  

Popout Code Editor to separate - resizable, moveable window - As per my prior idea

 

Option to turn off "auto execution" of code when in Code Editor "on demand" - PowerApps today executes code WHILE you're typing it, but this not only dramatically slows down the editor at times, but also throws errors in the midst of just changing the code.  This is highly annoying and there should be the option to turn this off (directly within the code editor window of the code I'm editing, not having to walk down through menus turn off/on - should be able to easily turn off and on "on demand" for just that window).  
The autoexecution is useful though and I'm not suggesting getting rid of it, but the ability to turn it off whilst editing would be useful.  
Note: the slowness this causes often is dependent on time of day and sometimes makes it almost impossible to use (has improved recently though).  May be dependent on how busy the backend PowerApps services in Azure are.

Checkbox on Code Editor window to make it "read only" - Often times I want to look at code, but do not want to mistakenly change things.  In some cases I've seen PowerApps (or the browser) misinterpret keystrokes (seems to be more timing) and have noticed at times that my code has changed or been deleted - probably due to my inadvertedly modifying it.  Would be nice to have a "Read Only" checkbox.


Search and Replace Capabilities - As mentioned above, we need the ability to search within a specific code block for text.  However, another use is the ability to search across ALL code blocks (and any controls, etc) for text - ie: in order to identify where a variable is used throughout and perhaps even replace, though there are other cases as well (the variable list in the menu is often too slow to use, but this doesn't address many of the use cases that good search and replace capability would provide).

Source Control Integration - There should be the ability to push code blocks into source control.  While PowerApps does indeed offer versioning, it is very granular.  

Fix minor issues with comments - While PowerApps now does very well with comments, there are still some issues as compared to other editors/languages) where the /* */ is not handled "properly" - primarily around nesting of comments within other comments - which is not something you'd do by design, but often is done to temporarily comment out large sections of code for testing purposes.  


These things would go a LONG way toward making the PowerApps code editor MUCH more useful, and alleviate at least some of the desire to have PowerApps use external editors like MS Code (though there are still good reasons that more advanced users may need this also).

 

Status: Under Review

Updating status and adding @GregLi

Comments
Power Apps
Status changed to: Under Review

Updating status and adding @GregLi

Advocate IV

Yes, we definitely need these changes. Suprised they're not already in the product.

Advocate I

Please add "properly handle Escape key" to the must haves. When autocomplete highlights intellisense suggestions, every other platform (VS, Code, Atom) that I've ever used turns off intellisense with escape. The powerapps platform exits the code editor without so much as a confirm dialog.

Continued Contributor
Continued Contributor

Agree with the above.

Would also like to add

  • Line numbers
  • Code folding
  • Code regions
Helper I

Wanted to throw in my support for these features as well! These would be incredibly helpful to have.

Helper V

Hotkey to toggle/select and expand/hide the formula bar. There are hotkeys for moving layers back and forth, so why is there not a hotkey to show/hide the formula bar?

 

Edit: 

I just figured I could work around this with chrome DevTools and custom code:

the css .formulaBar_<obfuscatedID> can be set to custom variables so that it is not overlapping the side-menus:

.formulaBar_*OBFUSCATED* {
    padding-right: 295px;
    padding-left:30px;
}

I guess it is possible to make it automatically be adjusted to the width of the sidebars, but as my css/html skills are rather limited.  

result:

A formula bar not covering the side panesA formula bar not covering the side panes



A hotkey can be assigned using the "accessKey" attribute:

<button class="button_*OBFUSCATED* " data-is-focusable="true" aria-label="Open formula bar tray" accesskey="z"><svg class="chevron_*OBFUSCATED*" role="presentation" focusable="false" aria-hidden="true" style="transform: rotate(0deg); fill: rgb(69, 69, 69);"><use xlink:href="#chevron-down"></use></svg></button>

This example till open/close the formula bar with [alt]+z. (on mac you must use command+alt+z)

I would not recommend anyone doing this, but this just shows what little must be done to make a huge improvement to the editor in my opinion.

Kudo Kingpin

I have three monitors, why can't I just pop out the code window so I can actually work instead of spending hours clicking the little arrow to make it bigger, then smaller to view the result, then bigger again... am I missing something obvious here? I have long strings of complicated code that is extremely difficult to work with in this "formula bar".