New Features & Enhancements:
- Tech Stack Detection: Added a new panel to automatically detect and display the website's underlying tech stack (including WordPress themes/plugins, production React instances, security details, and accessibility frameworks). The tool can be accessed from the View mode menu.
- Enhanced Inspect & Edit Tools:
- Added support for interacting with nested elements directly instead of always selecting their top-level containers.
- Added CSS pseudo-class support to the element selection and styling logic.
- Added a new color-value edit mode with a visual swatch and opacity input.
- Added border-radius visualization to the property inspector.
- Significant performance optimizations with deferred asset and color loading to make inspection smoother.
- Activity Tab Upgrades:
- Added a target button to activity tab entries so you can immediately inspect the modified element.
- Added quick-action utilities for easily reverting DOM CSS, text, and image modifications directly from the activity log.
- Improved Workspace & Navigation:
- The "Save changes" button now properly persists its active state when you navigate between pages or use the browser's forward/back buttons.
- The project dropdown list is now sorted to display viewer-role projects at the bottom.
- Enhanced tab matching logic to require exact query parameter matches for accurate project detection.
- Simulation & View Mode Improvements:
- Improved color blindness simulation so it properly persists across page reloads.
- Ensured X-Ray mode and blindness simulation states are mutually exclusive and no longer interfere with body-level filters.
- Measurement & Grid Tool Polish:
- Refined grid layout calculations and remainder distribution for better pixel precision.
- Measurement tool interactions now properly ignore scrollbar clicks and render correctly above all other elements.
Fixes & Optimizations:
- Improved extension security by replacing unsafe innerHTML usage with secure DOM processing.
- Resolved a potential browser security warning related to DOM fragment creation by completely migrating to a native DOMParser strategy.
- Implemented robust URL normalization and state management for the text editing functionality.

New Features:

• Measurements Tool — Interactive spacing and distance measurement across panes with smart snapping, shift-click selection, undo/redo, rem unit support, label collision avoidance, endpoint handles, and a dedicated Measurements Panel with visibility toggles and per-URL scoping.

• Image Overlay Panel — Redesigned panel for overlaying reference images with per-pane overlays, persistent file library, position/scale/rotation/flip controls, mix-blend-mode and invert filter support, cross-pane linking, fit presets, drag-to-scrub inputs, and hover previews.

• Project Sharing — Invite teammates by email with role-based permissions, accept/decline invite flow, members tab in project settings, and remote workspace sync.

• Profile Modal — Email and password change with inline validation, error messages, and full dark theme support.

Bug Fixes:

• Fixed extension fetch retries and init message responses
• Fixed measurement unit handling in split view
• Prevented duplicate initialization and optimized tab reinjection
• Fixed overlay blocker scope in split-view
• Prevented deleted remote projects from appearing in local sync
• Fixed panel rerender on fitMode changes during overlay edits
• Eliminated innerHTML/outerHTML assignments flagged by Firefox AMO validator
• Fixed profile modal dark theme styling
• Fixed profile modal visibility for all account types

Performance:
• Optimized measurement rendering with memoization and caching
• Structural tree-path anchoring for element identity preservation

Bug Fix: Fixed an issue where creating a screenshot while the image overlay panel or activity tab was open could result in duplicated screenshot tiles appearing in the UI.
Bug Fix: Addressed a race condition that caused multiple screenshot event listeners to be registered if the extension was quickly re-initialized or toggled off/on, preventing duplicated backend capture tasks.
Maintenance: Removed excessive debugging logs that were cluttering the developer console during initialization and split-view creation.

🖼️ New Feature: Per-Pane Image Overlay Tool & Alignment Editor
* Alignment & Adjustments: Added full support for per-pane image overlays with an alignment editor, including vertical/horizontal flipping, 90-degree rotations, and mix-blend-mode configuration (CSS mix-blend-mode support).
* Intelligent Positioning: Offset-preserving anchor logic was designed to maintain relative image positioning and scale during pane resizing or scaling. Toggling fit presets locks the anchor selection to valid axes.
* Mockup-Parent & Inset Synchronization: Integrated overlay clipping via mockup parent-syncing and dynamic inset management during pane layout changes.
* Overlay Storage & Library UI: Built a persistent library for stored overlay files using file picker inputs and blob storage. Supported direct image replacement, clearing all overlay files, and image hover previews on library tiles.
📚 Redesigned & Enhanced Tutorials Page
* Collapsible Sidebar & Navigation: Redesigned the tutorials page with an interactive sidebar, navigation indicators, and collapsible section components driven by external data sources.
* Dynamic Toolbar Tooltips & Hover Highlights: Hovering feature cards dynamically highlights their matching controls in the toolbar (using specificity-safe targets like .pixefy-tutorials-toolbar-target) and pops up dynamic, context-aware tooltips.
* High-Contrast Search Highlights: Match-highlighting engine (<mark>) added inside cards with clean regex-driven tokenization and localized styling.
🎨 Dark Mode Aesthetic Optimization & Alignment
* Toolbar Enhancements: Upgraded the dark mode toolbar background colors (#383736 and #474746) and stroke configurations for high visibility.
* Icon Overrides: Unified dark theme strokes (#383846) and fills across special buttons (Pixefy General Menu, Global Zoom, Security indicator, and Projects selector) to preserve contrast against high-intensity highlights.
🛠️ Bug Fixes & Architecture Stability
* Duplicate Initialization Prevention: Patched core extension initialization flow to guard against duplicate triggers, optimize tab reinjection, and guarantee backend precedence.
* Border Radius Bounds: Added adjustments for browser-overlay bars to dynamically adapt the image overlay border-radius.
* Single-Pane State Matchers: Event-driven active pane tracking synchronizes state across panes when switching to single-pane view.
* CORS Fallback: Integrated a no-cors HEAD fallback to URL resolution to handle strict CORS environments.

New Features & Improvements:
- Cloud-Synced Projects & Quick Links: Completely overhauled project management. Projects and Quick Links are now fully synced to the cloud and backed by our new Strapi v5 API. Your workspaces automatically sync view modes, filters, and active pane settings across sessions.
- Advanced Annotation Tools: Supercharged screenshot annotations with a new undo/redo history system, shift-key constraints for perfectly straight shapes, dynamic cursors, configurable text padding, and full background fill controls for all annotation types. We also added a new context menu for reordering, duplicating, and copy-pasting annotations!
- Workspace Guides & UI Enhancements: Added fully customizable line layout guides with orientation, anchor, and thickness controls (scaled perfectly for your device's pixel ratio). We also introduced a configurable secondary toolbar that persists your layout choices.
- Smarter URL Matching & Workspaces: Quick links now intelligently match your current URL to activate automatically. We also added duplicate validation and inline error messaging to keep your projects organized. Screenshots are now strictly scoped to their respective projects.
- Activity Tab Upgrades: Managing isolated elements is now much easier. The Activity tab features improved controls, mode badges, and clear action icons. Clicking an isolated element will automatically scroll your view and highlight it inside the canvas.
- Extended CSS Paths: Added a toggle to export full CSS selector paths or fall back to class-only selectors depending on your needs.

Bug Fixes & Polish:
- Cross-Browser Sync (Firefox): Fixed a critical CORS preflight issue where projects saved or modified while using Firefox could fail to sync to the cloud properly.
- Persistent Menus & Settings: Menus for theme, widget, and ruler settings now persist their selections without constantly closing on click. X-Ray mode and color blindness simulation states are now properly remembered between sessions.
- UI Polish: Redesigned the project selector UI, refined badges and placeholder pills, unified hover styles, and resolved minor visual bugs (such as removing unwanted triangles from tooltips in Dark Mode).
- Under the Hood: Implemented a new port-based background service worker keep-alive mechanism with BFCache support, significantly improving extension reliability and iframe reloading speeds.

Pixefy v1.2.3

New Features:
- Breakpoint Diff Tool: Compare CSS properties side-by-side across all panes for any inspected element. Collapsible property groups (Layout, Typography, Spacing, Colors, Border), live-refresh on CSS changes, and count badge showing differences.
- Redesigned Zoom: New draggable zoom slider, custom zoom input, and decoupled display/content zoom for more accurate responsive testing.
- Pane Limits: Free-tier users now see a clear Pro upgrade prompt when exceeding the pane limit.
- Toast Notifications: Subtle confirmation when adding panes.
- Sequential Pane Loading: Panes load one at a time to reduce resource contention.
- Theme Toggle: Switch light/dark theme directly from the View menu.
- Improved Annotations: Better text wrapping and positioning for screenshot annotations.

Bug Fixes:
- Inspect/Edit tools no longer get stuck after iframe reloads or split-view toggles.
- Enabling a mockup after resizing a pane now correctly resets dimensions.
- Mockup containers resync properly after exiting split-view.
- Fixed iframe height calculations with display zoom and browser overlays.
- Pane menu no longer appears in screenshots.
- Fixed zoom handling for hidden panes.
- Fixed single-pane centering and scroll behavior.
- Prevented double-click issues while drawing annotations.
- Filtered sandbox and ResizeObserver warnings from the error panel.
- More accurate load time metrics using responseStart.

Performance:
- Throttled scrollbar detection during resize to prevent layout thrashing.
- Breakpoint diff rendering deferred until panel is expanded.

Version 1.2.2 — Bug Fixes

🔄 Iframe Navigation Compatibility
• Fixed: sites with frame-busting code (e.g. lrt.lt) would redirect
preview iframes to an error page when navigating between pages
• Root cause: Firefox strips document.referrer when navigating iframes
from the content script context, causing sites that check referrer
for iframe permission to trigger their frame-busting redirect
• Added referrerpolicy="unsafe-url" to preview iframes so
document.referrer inside loaded pages correctly reflects the parent
URL, bypassing referrer-based frame-busting checks

🛠️ Navigation Sync Stability
• Fixed: clicking a link in one pane could revert all panes back to the
previous page due to stale load events from synced iframes
• Stale iframe load events (where the old page fires a load event after
a new navigation has already been accepted) are now correctly rejected
• Improved iframe navigation method to use src attribute (which respects
referrerpolicy) instead of location.replace() from the content script
context, ensuring consistent referrer behavior across browsers

Version 1.2.1 — Bug Fixes

🔧 Firefox Session Persistence
• Extension now automatically re-initializes after page reload when host
permissions are granted (via about:addons or at install time from AMO)
• Synchronous tab state cleanup prevents the "two-click" re-activation
bug where the icon state would desync after a reload
• Added retry mechanism for content script initialization to handle race
conditions between script injection and message listener registration

🛡️ Firefox CSP Compatibility
• Fixed: scripts inside Pixefy's preview iframes were blocked by
Content-Security-Policy headers on Firefox
• Firefox's declarativeNetRequest applies main_frame CSP rules to
sub_frame requests too — the script-src 'none' rule is now skipped
on Firefox entirely
• Added per-tab session rules that strip CSP headers from sub_frame
(iframe) responses on Firefox, independent of the security toggle
• The security toggle (header bypass) no longer interferes with iframe
script loading on Firefox
• Stale CSP session rules are cleaned up on extension startup

🔑 Host Permissions
• On first activation, the extension requests host permissions via
browser.permissions.request() to enable seamless auto-reinject
• Falls back gracefully to one-click manual re-activation if permissions
are not granted

Version 1.2.0 — What's New

🔧 Console Error & Warning Monitor (Pro)
• Real-time console error and warning tracking per pane with categorized badges
• Collapsible error/warning entries with stack traces, source identification, and timestamps
• Copy-to-clipboard for individual error entries
• Network error tracking and fingerprint-based deduplication
• Filterable panel with All / Errors / Warnings tabs

📐 Resize Ruler
• New resize ruler utility that visualizes device breakpoints during layout adjustments
• Zoom-aware tick rendering for accurate measurements at any zoom level
• Upcoming interval preview shows the next breakpoint within 100px

📊 Performance Metrics
• DOMContentLoaded load time badges on pane headers with color-coded indicators
• Cumulative Layout Shift (CLS) monitoring and badge UI
• Toggleable via Show/Hide menu with persistent storage

🎛️ Show / Hide Submenu
• New submenu under the general menu for toggling UI elements (toolbar, ruler, performance metrics)
• Keyboard shortcut (Cmd/Ctrl + ) continues to toggle toolbar visibility

🖼️ Screenshots
• Improved full-page screenshot stitching with overlay-aware alignment
• Better precision with exact source dimensions and rounded coordinates

🔄 Navigation & Sync
• Improved iframe navigation handling with location watcher and cross-origin robustness
• Prevented circular selection and scroll sync events during programmatic updates
• Better scroll sync stability — replaceState URL updates no longer trigger iframe reloads

🛡️ Stability & Compatibility
• Hardened iframe style protection against third-party CSS injections (e.g., BlurWeb, ad blockers)
• Forced Pixefy element visibility to override external CSS overrides
• Nuclear document reset using document.open() to fully prevent SPA side-effects
• Removed document.write() usage (Firefox AMO compliance)
• Null-safety improvements across zoom menus, scroll sync, and pane operations
• Timestamped storage conflict resolution to prevent stale sync overrides
• Memory leak prevention with comprehensive cleanup for error monitoring and layout observers

🎨 UI Improvements
• Adaptive split-view header with collapsing elements at narrow widths
• Updated "Sign in" button label to "Account"
• Standardized menu item layouts with reordered check icons and shortcut hints
• Grid settings panel state checkmark in menu

🔄 Update System
• Added update check and restart mechanism to the What's New popup

Bug Fixes
Custom pane resizing stability — Responsive panes now correctly remain responsive after drag-resize. Previously, resizing a responsive pane could incorrectly convert it to a custom non-responsive pane.

Custom pane reset — Resetting a custom pane (clicking the resolution label) now correctly restores both width and height to the pane's original preset dimensions. Previously, height was not reset properly.

Override indicator accuracy — The pane resolution label now accurately displays the override style (colored indicator) when dimensions differ from the preset, and correctly removes it when dimensions match. This includes correct behavior when editing a custom pane's dimensions via the update modal.

Menu checkmark accuracy — The mode button menu now correctly shows a checkmark next to the active custom pane preset, even after resizing the pane. Previously, the checkmark would disappear after any resize.

Custom pane editing — Editing a custom pane preset (e.g., adding height to convert from responsive to non-responsive) now immediately updates the resolution display without stale override styling.

Fixed custom pane resolution label not showing blue override color during drag-to-resize
Fixed resolution label losing color after clicking reset on a custom pane
Fixed reset changing a pane's responsive/non-responsive mode — reset now only resets dimensions
Fixed enabling/disabling mockups or browser overlays converting custom panes to responsive
Improved responsive custom pane display — only width shows colored styling, height stays plain

Bug Fixes

Fixed pane jump on drag handle release — panes no longer snap to incorrect size after resizing
Fixed responsive pane resolution display showing colored override styling after drag resize
Responsive panes now correctly display width x height without device-resolution coloring after manual resize

Bug Fixes

Fixed panes snapping to incorrect size after releasing drag handles

Release Notes (User-Facing)
🔧 Stability & Bug Fixes
Fixed pane zoom consistency — Zooming in and out (globally or per-pane) no longer causes panes to grow or shrink incorrectly. Dimensions are now preserved accurately across zoom changes.
Fixed mockup alignment — Device mockups now correctly align the screen area, iframe, and browser overlays to match the frame. Previously, panes with slightly different resolutions than the mockup could show misaligned content.
Fixed rotation behavior — Rotating a pane now correctly swaps the current dimensions instead of resetting to the device's native resolution. Custom-resized panes retain their size after rotation.
Fixed device menu resizing — Selecting a device from the mode menu now reliably updates the pane dimensions and properly clears the "overridden" state indicator.
Fixed resolution label accuracy — The resolution display in the pane header now shows correct dimensions at all zoom levels, eliminating inflated values that appeared on zoomed mockup panes.
Fixed reset resolution — Resetting a pane to its native resolution now correctly removes the override indicator and displays the proper device name.
Reduced blank iframe occurrences — Enabling mockups no longer causes iframes to intermittently turn blank due to aggressive reload behavior.