Preview on local network

I saw this post earlier and was reminded of something that has annoyed me with Elements from day one. The Safari (or other browser) preview leaves a lot to be desired.

The server that Elements starts up for the preview is bound to localhost:port (ie. http://127.0.0.1:49890/) which enables you to preview your site on any browser running on your Mac, only. When I use tools such as 11ty/Astro or even just BBEdit with WorldWideWeb, they also expose the server to the local network (using the above links) via my local IP (ie. http://10.0.0.240:8080/ ) or Bonjour (ie. http://bryans-macbook-pro.local.:8080/ ) which then enables me to instantly test my projects on any device connected to my local network, including iPhone, iPads, etc. Better yet, whenever I make a change to a file (page, style, script, image, etc) on my laptop it’s immediately refreshed in all devices/browsers currently connected (no switching of apps, focus, etc required). It just works!

Currently, if I want to see a refresh of a page in Elements using a browser on my Mac (ie. Safari), I need to save the file and then switch app (and give focus) to whatever browser I’m using. However, if I want to test on mobile devices I need to publish the site locally, and then start World Wide Web (above, or similar), point it to the folder, start a server, connect my devices, test, etc. And if I want to see any subsequent changes I need to do the whole publishing process over again. A very tedious process that gets old quickly.

Please, can you expose the web server Elements uses to the local network either via local IP (preferred) or Bonjour, and have the browser refresh on file save in Elements, not on focus of the browser — which requires users to constantly switch apps to even preview small visual/content changes.

These relatively simple changes (expose the preview server on the local network, and switch to refresh on save instead of focus) would be a big QoL enhancement, especially for folks developing custom components or wanting to ensure their sites (especially those with animation and interactive components) work as expected on actual devices, and not just resized desktop browser windows.

2 Likes

Yes, agreed. I’ll add it to the list :saluting_face:

1 Like