live edit

I send to phpstrom a private feedback message about live edit .

Here some feedback about live edit ( edit html and css )
Take care with the number of port ( http://xxx:port/ ) when change it
---it must be the  same in phpstorm side and chrome side

Take care of the page open in the editor in the debuger and in the browser !!
---it could be not the same

Take care of the name before the run button
----the run button work only for the page show before the run icon
----run ll not apply to the active page in the editor !

phpstorm for live edit need a specific Javascript debug instance
----create i using Menu -> run ->edit -> javascript instance
----you have to create an instance of "Javascript Debug " for EACH  file you want to debug ( manual way)    !!!

If you don't want to create manually/explicitly a  "Javascript Debug"  instance ( use live edit in another word) and want to launch a debug session ( mean live edit session) ; you can using from the file locate inside the directory panel . Click on file -> righ click -> select debug . After this if you go to Menu -> run -> edit configuration , then you ll see that phpstrom create an instance of "Javascript Debug" for use but the color is grey  !! .

if you are in a page1.html in phpstorm editor and launch debug  the debug is only for this page1.html
if you edit another page page2.html selected from the project inside phpstrom the debugger is stick to page1.html
for launch page2.html ue the browsr icon  !!

It is really basic but here some issues i have with phpstorm .
the question is which file name is trigger/concern  by the action ?
I was thinking open the file launch the brower icon and then all work !!! but not

In this debug mode the sub menu Run ->update Live Edit  ll be available  ( Ctr F10 )
so the "debug" tab name locate  in the bottom left side of phpstrom GUI could be name "live edit " then go to "elements" tab.


Comment actions Permalink

Haven't got what you are asking about... starting a Live Edit session is actually a one-click operation:  open your HTML file in editor, right-click in it and choose Debug, and, when the page is  loaded in the browser, start editing.
See also, requires a possibility to work with LiveEdit without using JS Debug run  configurations - this would probably make the setup process easier

Comment actions Permalink

I don't use the post for a question  but give information about  live edit .

1) some youtube video are for older version

2) remove popup in chrome disable liveedit !
I open the panel -> element ->text and put my mouse hover tag element but i can't view the box model in  chrome !!
It seem when i close the popup in chrome then  liveedit is close and edit text and view box model don't work !!!
I use 139 659 8.2 version ..Can you help me ?

3) when i use shift on tag element , the boundingbox must appear in the html page .
Does the bounding box information work when mouse cursor is hover a tag locate in the Structure panel ?
it seem highlight boundingbox work when mouse cursor is inside the main editor  and (debug ->element ->) text panel but not for (Debug ->Element -> ) structure  panel.

Comment actions Permalink

2. this is expected behavior - closing the popup disconnects the extension.See
To disable the popup,  open chrome://flags/#silent-debugger-extension-api and enable this flag

3. sorry, don't understand what you meant to say. Can you clarify?

Comment actions Permalink

I modify my question .


Comment actions Permalink

I see, thanks:) No, navigation doesn't work for Structure tab - clicking the node there just opens a new unnamed tab in editor and navigates there - see


Please sign in to leave a comment.