Intellij LiveEdit vs Brackets Live Preview
Although Brackets is relatively new, it does seem to have the edge when it comes to Live Previewing. I find IntellIJ LiveEdit a bit of a hit or miss affair: some changes are picked up, others (especially images and css changes) are not showing until the browser is refreshed, and sometimes they're not picked up then.
Hope to see improvements in the future that will bring LiveEdit up to the same level as Brackets.
Aside from that, all good :-)
请先登录再写评论。
please can you elaborate on this issue? What IDE version do you use? Screencast that shows up the problem would be helpful
also, please make sure that 'Update' in Preferences/Build, Execution, Deployment/Debugger/Live Edit is set to 'Auto in (ms)' and 'Restart if hotswap fails' is enabled
Yes, my settings are right. I'll try to get the screencast by the weekend. I'm using Webstorm version 2016.3 #WS-163.3512.13
Hi there.
I've managed to put together a rough screencast.
Do have anywhere private I can post it to?
Thanks.
You can upload it to our FTP server (ftp://ftp.intellij.net/.uploads/ - anonymous login, .uploads directory has no permissions to list/download files, only for upload) and let me know the file name
Okay, I've copied over a file called livedit.mp4. Sorry about the watermark and the poor quality.
thanks... Unfortunately this video doesn't give me any clue on what's going on... Can you attach a sample project/page I can use to recreate the issue? As HTML is correctly hotswapped to me - page is updated immediately without browser refresh...
Okay, try wcp_on_jcs_obe2.zip
thanks! reproduced. the problem is that your page is changed dynamically - tags/classes are added/removed, etc. Like:
$('section > div > ol > li').wrapInner('<span>');as a result, the tags in source files don't match the DOM structure in browser. And LiveEdit searches element by selector/path... And it can't match `section > div > ol > li > span > p` with `section > div > ol > li > p` - as a result Live Edit doesn't work for <p>... When you click in <li> in
the list item is highlighted. But the you click on <p>/start editing text, nothing happens...
Related ticket: https://youtrack.jetbrains.com/issue/WEB-7734
That doesn't sound like something that can be fixed then :-(
Indeed, it's not a thing that can be fixed easily... Requires using a different approach to matching elements - like 'patching' the code as Bracket does (that, when its own built-in server is used, injects annotations in code to be able to map edits and cursor positions from the source file)... Or (easier solution) - reload the whole page when nothing can be found? Not sure...
Well reloading the page would be fine, as long as it didn't cause a lot of flickering and you don't have to scroll down to reach the part of the page you were looking at before the page reloaded.
If I select a tag, then the preview highlights the part of the page that is enclosed by the tag. Could you update that area in the preview when it's highlighted?
the content of inner tag can't be updated even if selecting outer tag does highlight the page area... If nothing is highlighted when you select the text, you can't expect live edit to work
I just about see what you mean. :-)
And one other small thing concerning table rendering with emmet coding.
https://youtrack.jetbrains.com/issue/WEB-23339
One final thought.
If Adobe Brackets is open source, perhaps something can be built around their live preview engine.
Oh wait.
Brackets is written in Javascript, isn't it.
yes, as far as I can see...