Changelog
4.1 — 2026-10
Added
- Angular tab, for Angular 9+ (Ivy). In development builds it shows properties and signals (editable live, followed by change detection), inputs, outputs, host directives, listeners, injector providers and change-detection strategy, and sets
$ngin the console. In production builds it shows the component tree. - State tab, a Redux DevTools-compatible inspector. MobiDevTools implements the Redux DevTools extension protocol (
__REDUX_DEVTOOLS_EXTENSION__,…_COMPOSE__,connect()), so Redux, Redux Toolkit, Zustand, NgRx, Jotai, MobX-state-tree and others report their actions. It shows the action log, payload, state and diff, supports time travel, lets you dispatch an action by hand, and exports to JSON. It is only installed on sites where MobiDevTools was opened, and never over a real Redux DevTools extension. - Preact 10 support in the React tab: tree, props, class state, hooks (State, Memo, Ref, Context, Effect), live editing.
- Framework tabs appear only when the page uses that framework (new
detect()option of the plugin API).
Improved
- Resize handle rebuilt for slow phones. The touch target grows from 8 to 28 px. While the finger moves, the panel is only translated (compositor work): the layout is computed once at the start and once at the end, instead of about 60 times a second for both the panel and the page. Double-tap the handle to switch between half and almost full screen.
Tests
- New suites: resize handle (real touch drags), State (Redux + RTK + Zustand), Preact, Angular 18 (signals, zoneless). 188 checks in total.
4.0 — 2026-10
A major release. The panel's internals were rebuilt around three new foundations:
- page hooks (page-hooks.js) that read the page's console, errors and listeners directly
- network capture in the background (webRequest + filterResponseData)
- a closed shadow root for the whole UI
Every change below was verified in Firefox 158 with an automated test suite (143 checks) on real pages: plain, strict CSP, CSP without eval, React 18, Vue 3 and Vue 2.
Fixed — reported in reviews
| Review | Problem | Fix |
|---|---|---|
| ★★ "call to eval() blocked by CSP" (Oct 2026) | The REPL failed on every site whose CSP forbids eval. On sites that also forbid inline scripts it silently did nothing. |
New REPL engine. It picks the execution mode from the page's CSP: page context with eval, page context without eval, or an isolated context with full DOM/global access when the CSP blocks scripts added by extensions. Every expression now returns a result on every page. |
| ★★★★★ "there are many bugs… sometimes it crashes or doesn't appear" (Oct 2026) | Page console.* calls were never captured. 3.x patched the sandbox's own console, not the page's. Fatal page errors were only partly caught. |
page-hooks.js hooks the page's real console with exportFunction (works under any CSP). Captures console.*, uncaught errors, unhandled rejections, failed resources and CSP violations, from the first line of the page after a reload. One malformed message can no longer break the console. |
| ★★★ "Selecting any css or js file shows me blank space" | A contain: strict rule clipped the source viewer, and opening a snippet left the editor unscrollable. |
Virtualised source viewer: big and minified files open instantly. Containment bug and snippet style leak removed. |
| ★★★ "scrolling… treats the scroll action as tap" | File, snippet and workspace rows opened on touchend, which also fires after a scroll gesture. |
Rows react to taps only. A scroll gesture never activates anything. |
| ★★★ "The network tab is useless. It is empty…" / ★ "Addon is closed when refreshing the page to measure network data" | Only fetch/XHR made after opening appeared. Script, CSS, image and document requests never showed. Everything was lost on reload. | The background records every request of every tab in a ring buffer. The Network panel shows what the page loaded before it was opened, survives reloads ("Preserve log" option), and adds payload, response body, preview, timings, cURL/fetch export and advanced filters. |
| ★ "Doesnt really help when it gets closed on redirect/reload. The console is empty…" | The panel re-opens on reload and navigation. Console output is captured from the start, and Preserve log keeps the previous page's messages. | |
| ★★★★ "Could it be possible to edit the local storage?" | localStorage, sessionStorage and cookies are editable (add / edit / rename / delete) with JSON preview. IndexedDB records can be browsed. | |
| ★★★★★ "PLEASE incorporate a CSS-GRID viewer!!!!" | Elements ▸ Layout: grid/flex properties, list of all grid and flex containers of the page, and on-page overlays with numbered grid lines and gaps. | |
| ★★★★ "all the button icons of dev tools are broken" (on Facebook) | The page's CSS styled the panel. | The UI lives in a closed shadow root with all: initial. Page CSS can no longer reach it. |
| ★★★★ "theme… only effective under the current domain name" | Settings, snippets and the assistant state lived in each site's localStorage. |
Everything is in extension storage and shared by all sites. Old per-site keys are migrated once and removed from the pages. |
| ★★★★★ "would be the best if Download Folder exists" | Sources ▸ ⬇ .zip downloads the page's HTML, scripts, stylesheets, inline code and a DOM snapshot. |
Fixed — found during the 4.0 audit
- The panel's CSS variables (
--bg,--red,--mono…) were declared on the page's:rootand overwrote the site's own variables of the same name. They are now scoped to the shadow host. - REPL variables did not persist between commands (
var x = 1, thenx→ ReferenceError). Top-levelvar/let/const/classnow persist, as in Chrome. - HttpOnly cookies and authorization headers shown in Network were readable by page scripts, because the panel was in the page's DOM. They are not readable any more (closed shadow root).
- Clicks and key presses inside the panel reached the page's own handlers (closing the page's menus, triggering site shortcuts). Panel events now stay in the panel.
- The panel no longer modifies the page's
<body>. 3.x addedpadding-bottomand adata-*attribute that then appeared in Elements and Styles. The space for the panel now comes from an adopted stylesheet, invisible in the DOM. - The Performance tab started a new animation loop on every visit (memory/CPU leak).
- Application tables opened the preview of the last row by themselves.
- Context menus and the HTML editor were attached to the page DOM. They now live in the panel.
- The floating `` button covered the REPL's Run button on phones. It is hidden while the panel is open.
- The Debugger sidebar showed non-functional pause/step buttons, Scope and Call Stack. They were replaced by working tools (see Added).
Added
- Pharos tab: Lighthouse-style page audits in four categories (Performance, Accessibility, Best Practices, SEO), about 50 audits in total. Each category is scored 0–100, and metric scores use Lighthouse's published log-normal curves (mobile/desktop thresholds). Failing elements are listed and open in Elements. Also: "Reload & analyze", comparison with the previous run, HTML and JSON reports. MobiDevTools' own UI is excluded from LCP, CLS and INP.
- React tab: component tree for React 16–19, including production builds. Shows props, state, hooks (State, Reducer, Effect, Memo, Callback, Ref, Id…), context, keys, memo/forwardRef, "rendered by". Live state editing,
$r, pick on page, search. - Vue tab: Vue 2 and Vue 3. Shows props, setup state, data, computed, inject/provide, attrs, refs, Pinia stores, Vuex, router. Live editing,
$vm, pick on page, search. - Plugin API: extension plugins (
MDT_PLUGINS.register) and page plugins (window.MobiDevTools.registerPanel). Full guide inPLUGINS.md, examples inexamples/. - Object inspector: expandable values, getters on demand, DOM nodes that highlight and reveal, "Store as global variable", "Copy as JSON".
- Console: format specifiers
%s %d %i %f %o %O %c,console.table, groups,count,time/timeLog/timeEnd,assert,trace,dir. Clickablefile:linelinks and stack frames. Timestamps. Preserve log. Command-line API:$0 $_ $ $$ $x copy inspect keys values dir table monitorEvents unmonitorEvents getEventListeners clear. Autocomplete from real page objects (page-defined getters are never invoked while typing). Top-levelawait, multi-line input,{a:1}read as an object literal, Ctrl+L. - Elements: real matched rules with source file and
@media, specificity order, overridden and!importantdeclarations, inherited section, new rule button (+), Event Listeners foraddEventListenerwith registration location, Layout pane with grid/flex overlays. - Network: request bodies (form and raw), response bodies for fetch/XHR, JSON preview, image preview, timing breakdown, remote address, tracker classification, copy as cURL / fetch, HAR with timings and bodies, filters
status: method: domain: mime-type: larger-than: -exclude, Preserve log, summary bar. - Sources: virtualised viewer, minified-file banner, find in file, go to line, open at line from the console, original HTML (from cache) so error line numbers match,
.zipdownload. - Debugger sidebar (observe without pausing): live watch expressions, XHR/fetch logpoints, DOM change logpoints, event logpoints, global listeners, CSP violations, line bookmarks.
- Performance: INP (Interaction to Next Paint), resources summary, slowest requests.
- Global, persistent settings: panel height, last tab, console options, history, snippets, watches.
Performance
- Console messages reach the panel asynchronously, in batches. Measured on 5,000
console.*calls, the page-side overhead fell from 271 ms (first 4.0 build) to 97 ms. - The console keeps ≤ 1000 rows in the DOM (600 on phones). The source viewer renders only the visible lines. The network list updates incrementally.
- The plain-text form of each message and its stack location are computed lazily.
Permissions
- Added
storage: settings, history and snippets in extension storage instead of the sites' storage. - Added
webRequestBlocking: required by Firefox forfilterResponseData, used read-only for fetch/XHR response bodies in tabs where MobiDevTools is open. - Firefox shows no permission prompt for either of them, so updating from 3.x does not ask the user anything new.
3.7 and earlier
See the version history on addons.mozilla.org and SourceForge.