DevTools Tips

Create a web server to test local files

Categories: Supported by:

Use Firefox's Local Mode to test local files without having to set up a web server.

Certain web APIs require to use a web server to work properly. For example, navigator.clipboard requires a secure context (HTTPS or localhost). Many web projects have a local dev server built-in which, once started, lets you access your site locally via http://localhost:8080 or similar. However, sometimes you just want to test a simple HTML file without having to set up a full project or starting a local web server.

In Firefox, you can use Local Mode to map a domain of your choice to local files:

  1. Open DevTools.

  2. Click Customize Developer Tools and Get Help (...) > Settings in the top right corner of DevTools. Or, press F1.

  3. Under the Local Mode section, click Add new local mapping.

    The file picker opens.

  4. Select the folder which you want to serve locally.

    A new mapping entry appears in the list.

  5. In the Custom domain text field, either use the default firefox.localhost value, or enter another custom domain of your choice.

Now, whenever you have DevTools open and visit https://firefox.localhost (or your own custom domain), Firefox serves the file from the folder you selected.

Part of the Firefox DevTools Settings panel, showing the Local Mode settings: the custom domain field, with the value firefox.localhost, and the local folder setting, pointing to a dev folder on the device. The button Add a new local mapping is highlighted. There are also two other buttons: Disable and Remove local mapping.