{
  "@context": "https://schema.org",
  "@id": "https://aggr.aymericbeaumet.com/items/lobste-rs/2026-10-21-firefox-local-mode/#webpage",
  "@type": [
    "WebPage",
    "ArchiveComponent"
  ],
  "articleBody": "## What is the “Local Mode”\n\nThis feature allows you to register multiple mappings in order to load local files through custom https:// URLs. This prevents having to spawn a HTTP server to test a web page. This makes it easy to test all Web APIs, including the ones being restricted to [Secure Contexts](https://developer.mozilla.org/en-US/docs/Web/Security/Defenses/Secure_Contexts) (i.e. using https). This also helps having many distinct origins (domain) for each experiment / project and have dedicated storage/cookies for each.\n\nThese mappings are only accessible from Firefox (this can’t be used by any other program, or malicious software on your computer/local network).\n\nThese mappings are only functional when DevTools are opened.\n\n## How to use the “Local Mode”\n\nThis feature shipped in Firefox 153.\n\nYou can register mappings from DevTools’ Options panel:\n\n![The Local Mode settings in DevTools options panel](https://firefox-source-docs.mozilla.org/_images/options-panel.png)\n\nFrom there you can register as many mappings as you need.\n\nEach mapping defines:\n\n- the origin (domain)\n\n  The custom origin to expose via https URL.\n\n- the local folder\n\n  The local folder where to load files from.\n\nOn the screenshot, it loads `https://firefox.localhost` from `/home/alex/app`.\n\n## Loading file URL notification\n\nWhen loading any file:// URL with DevTools opened, you should see the following notification at the top of DevTools:\n\n![The notification shown when loading file:// URL](https://firefox-source-docs.mozilla.org/_images/file-notification.png)\n\nThe first action `Add To Settings` will bring you to the Options panel and register a new mapping for the loaded file URL.\n\nThe second action `Try it` will register a transient mapping to load the current file or folder from a https URL. The mapping will disappear as soon as you close DevTools or Firefox.\n\n## Manage mappings via preferences\n\nMappings can also be managed in about:config via preferences, so that you can easily import and transfer them between profiles, or via automation.\n\nEach mapping is defined by three preferences:\n\n- `devtools.local-mode.mappings.${index}.origin`: string for the mapping’s origin. (e.g. “firefox.localhost”)\n\n- `devtools.local-mode.mappings.${index}.path`: string for the absolute path to local folder (e.g. “/home/hello-world”)\n\n- `devtools.local-mode.mappings.${index}.disabled`: optional boolean to disable this mapping and where `${index}` is an incremental integer counter to uniquely identify each mapping.\n\nHere is an example of mappings you can control from about:config:\n\n![List of Local Mapping preferences displayed in about:config](https://firefox-source-docs.mozilla.org/_images/mappings-in-about-config.png)\n",
  "authors": [
    "firefox-source-docs.mozilla.org via lim"
  ],
  "captured_at": "2026-10-22T01:26:25.644952883+00:00",
  "category": "news",
  "content_html": "<h2>What is the “Local Mode”</h2>\n<p>This feature allows you to register multiple mappings in order to load local files through custom https:// URLs. This prevents having to spawn a HTTP server to test a web page. This makes it easy to test all Web APIs, including the ones being restricted to <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://developer.mozilla.org/en-US/docs/Web/Security/Defenses/Secure_Contexts\">Secure Contexts</a> (i.e. using https). This also helps having many distinct origins (domain) for each experiment / project and have dedicated storage/cookies for each.</p>\n<p>These mappings are only accessible from Firefox (this can’t be used by any other program, or malicious software on your computer/local network).</p>\n<p>These mappings are only functional when DevTools are opened.</p>\n<h2>How to use the “Local Mode”</h2>\n<p>This feature shipped in Firefox 153.</p>\n<p>You can register mappings from DevTools’ Options panel:</p>\n<p><picture class=\"article-picture article-picture-fallback\" style=\"--image-ratio:16 / 9\"><img src=\"https://firefox-source-docs.mozilla.org/_images/options-panel.png\" alt=\"The Local Mode settings in DevTools options panel\" loading=\"eager\" decoding=\"async\" fetchpriority=\"high\" referrerpolicy=\"no-referrer\" class=\"progressive-image\"></picture></p>\n<p>From there you can register as many mappings as you need.</p>\n<p>Each mapping defines:</p>\n<ul>\n<li>\n<p>the origin (domain)</p>\n<p>The custom origin to expose via https URL.</p>\n</li>\n<li>\n<p>the local folder</p>\n<p>The local folder where to load files from.</p>\n</li>\n</ul>\n<p>On the screenshot, it loads <code>https://firefox.localhost</code> from <code>/home/alex/app</code>.</p>\n<h2>Loading file URL notification</h2>\n<p>When loading any file:// URL with DevTools opened, you should see the following notification at the top of DevTools:</p>\n<p><picture class=\"article-picture article-picture-fallback\" style=\"--image-ratio:16 / 9\"><img src=\"https://firefox-source-docs.mozilla.org/_images/file-notification.png\" alt=\"The notification shown when loading file:// URL\" loading=\"lazy\" decoding=\"async\" fetchpriority=\"low\" referrerpolicy=\"no-referrer\" class=\"progressive-image\"></picture></p>\n<p>The first action <code>Add To Settings</code> will bring you to the Options panel and register a new mapping for the loaded file URL.</p>\n<p>The second action <code>Try it</code> will register a transient mapping to load the current file or folder from a https URL. The mapping will disappear as soon as you close DevTools or Firefox.</p>\n<h2>Manage mappings via preferences</h2>\n<p>Mappings can also be managed in about:config via preferences, so that you can easily import and transfer them between profiles, or via automation.</p>\n<p>Each mapping is defined by three preferences:</p>\n<ul>\n<li>\n<p><code>devtools.local-mode.mappings.${index}.origin</code>: string for the mapping’s origin. (e.g. “firefox.localhost”)</p>\n</li>\n<li>\n<p><code>devtools.local-mode.mappings.${index}.path</code>: string for the absolute path to local folder (e.g. “/home/hello-world”)</p>\n</li>\n<li>\n<p><code>devtools.local-mode.mappings.${index}.disabled</code>: optional boolean to disable this mapping and where <code>${index}</code> is an incremental integer counter to uniquely identify each mapping.</p>\n</li>\n</ul>\n<p>Here is an example of mappings you can control from about:config:</p>\n<p><picture class=\"article-picture article-picture-fallback\" style=\"--image-ratio:16 / 9\"><img src=\"https://firefox-source-docs.mozilla.org/_images/mappings-in-about-config.png\" alt=\"List of Local Mapping preferences displayed in about:config\" loading=\"lazy\" decoding=\"async\" fetchpriority=\"low\" referrerpolicy=\"no-referrer\" class=\"progressive-image\"></picture></p>\n",
  "content_markdown": "## What is the “Local Mode”\n\nThis feature allows you to register multiple mappings in order to load local files through custom https:// URLs. This prevents having to spawn a HTTP server to test a web page. This makes it easy to test all Web APIs, including the ones being restricted to [Secure Contexts](https://developer.mozilla.org/en-US/docs/Web/Security/Defenses/Secure_Contexts) (i.e. using https). This also helps having many distinct origins (domain) for each experiment / project and have dedicated storage/cookies for each.\n\nThese mappings are only accessible from Firefox (this can’t be used by any other program, or malicious software on your computer/local network).\n\nThese mappings are only functional when DevTools are opened.\n\n## How to use the “Local Mode”\n\nThis feature shipped in Firefox 153.\n\nYou can register mappings from DevTools’ Options panel:\n\n![The Local Mode settings in DevTools options panel](https://firefox-source-docs.mozilla.org/_images/options-panel.png)\n\nFrom there you can register as many mappings as you need.\n\nEach mapping defines:\n\n- the origin (domain)\n\n  The custom origin to expose via https URL.\n\n- the local folder\n\n  The local folder where to load files from.\n\nOn the screenshot, it loads `https://firefox.localhost` from `/home/alex/app`.\n\n## Loading file URL notification\n\nWhen loading any file:// URL with DevTools opened, you should see the following notification at the top of DevTools:\n\n![The notification shown when loading file:// URL](https://firefox-source-docs.mozilla.org/_images/file-notification.png)\n\nThe first action `Add To Settings` will bring you to the Options panel and register a new mapping for the loaded file URL.\n\nThe second action `Try it` will register a transient mapping to load the current file or folder from a https URL. The mapping will disappear as soon as you close DevTools or Firefox.\n\n## Manage mappings via preferences\n\nMappings can also be managed in about:config via preferences, so that you can easily import and transfer them between profiles, or via automation.\n\nEach mapping is defined by three preferences:\n\n- `devtools.local-mode.mappings.${index}.origin`: string for the mapping’s origin. (e.g. “firefox.localhost”)\n\n- `devtools.local-mode.mappings.${index}.path`: string for the absolute path to local folder (e.g. “/home/hello-world”)\n\n- `devtools.local-mode.mappings.${index}.disabled`: optional boolean to disable this mapping and where `${index}` is an incremental integer counter to uniquely identify each mapping.\n\nHere is an example of mappings you can control from about:config:\n\n![List of Local Mapping preferences displayed in about:config](https://firefox-source-docs.mozilla.org/_images/mappings-in-about-config.png)\n",
  "dateCreated": "2026-10-22T01:26:25.644952883+00:00",
  "date_created": "2026-10-21T15:47:59+00:00",
  "date_modified": "2026-10-21T15:47:59+00:00",
  "date_published": "2026-10-21T15:47:59+00:00",
  "description": "Comments",
  "external_url": "https://firefox-source-docs.mozilla.org/devtools-user/local_mode/index.html",
  "git": {
    "commit": "ebb0941c5c06a2ab2377342d607535262a3e969e",
    "path": "items/lobste-rs/2026/10/2026-10-21-firefox-local-mode.md",
    "permalink": "https://github.com/aymericbeaumet/aggr-instance/blob/ebb0941c5c06a2ab2377342d607535262a3e969e/items/lobste-rs/2026/10/2026-10-21-firefox-local-mode.md"
  },
  "id": "urn:aggr:item:d5ac062c664535697b3877c7ee4b82c555b7809b",
  "isBasedOn": {
    "@id": "https://firefox-source-docs.mozilla.org/devtools-user/local_mode/index.html"
  },
  "mainEntity": {
    "@id": "https://firefox-source-docs.mozilla.org/devtools-user/local_mode/index.html",
    "@type": "CreativeWork",
    "archivedAt": {
      "@id": "https://aggr.aymericbeaumet.com/items/lobste-rs/2026-10-21-firefox-local-mode/#webpage"
    },
    "author": [
      {
        "@type": "Person",
        "name": "firefox-source-docs.mozilla.org via lim"
      }
    ],
    "dateModified": "2026-10-21T15:47:59+00:00",
    "datePublished": "2026-10-21T15:47:59+00:00",
    "headline": "Firefox Local Mode",
    "image": {
      "@type": "ImageObject",
      "caption": "Logo",
      "height": 90,
      "url": "https://firefox-source-docs.mozilla.org/_static/firefox-wordmark.svg",
      "width": 160
    },
    "timeRequired": "PT2M",
    "url": "https://firefox-source-docs.mozilla.org/devtools-user/local_mode/index.html",
    "wordCount": 348
  },
  "name": "Archived snapshot: Firefox Local Mode",
  "preview": {
    "alt": "Logo",
    "color": null,
    "height": 90,
    "placeholder": {
      "data_url": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=",
      "hash": ""
    },
    "url": "https://firefox-source-docs.mozilla.org/_static/firefox-wordmark.svg",
    "width": 160
  },
  "reading_minutes": 2,
  "replicated_at": null,
  "source": "lobste-rs",
  "source_name": "Lobsters: Top Stories of the Past Week",
  "summary": "Comments",
  "tags": [
    "browsers"
  ],
  "temporalCoverage": "2026-10-22T01:26:25.644952883+00:00",
  "title": "Firefox Local Mode",
  "url": "https://aggr.aymericbeaumet.com/items/lobste-rs/2026-10-21-firefox-local-mode/",
  "word_count": 348
}