Firefox Developer Tools ideas

Welcome to the feedback channel for Firefox Developer Tools. This is a place for constructive feedback around the tools with ideas and feature suggestions. It is not a support forum or place to report bugs. For support, please go to the #devtools channel on Mozilla IRC or the firefox-developer-tools tag on Stack Overflow, and for reporting bugs, go to Bugzilla.

The documentation on how the Developer Tools work is available on MDN.

My idea is:

You've used all your votes and won't be able to post a new idea, but you can still search and comment on existing ideas.

There are two ways to get more votes:

  • When an admin closes an idea you've voted on, you'll get your votes back from that idea.
  • You can remove your votes from an open idea you support.
  • To see ideas you have already voted on, select the "My feedback" filter and select "My open ideas".
(thinking…)

Enter your idea and we'll search to see if someone has already suggested it.

If a similar idea already exists, you can support and comment on it.

If it doesn't exist, you can post your idea so others can support it.

Enter your idea and we'll search to see if someone has already suggested it.

  1. Support live editing with any external editor

    The architecutre of fb-flo is very nice: http://facebook.github.io/fb-flo/

    It sounds like it needs some deep JavaScript VM foo to do hot code reloading.

    Maybe a Fx Addon for Facebook Flo support?

    Maybe a from scratch way to support any external editor with any codebase?

    90 votes
    Vote
    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      I agree to the terms of service
      Signed in as (Sign out)
      You have left! (?) (thinking…)
      4 comments  ·  Flag idea as inappropriate…  ·  Admin →
    • Grey out non-applied fonts

      Consider this example CSS rule:

      body, td, th, input, select, option, optgroup, .text_input {
      font-family: "Open Sans","Helvetica Neue",Arial,Helvetica,sans-serif;
      }

      Only one of these fonts is going to be applied on the page, depending on what is available on the system.

      It would be nice if the devtools' Rules view would grey out all the fonts that are not actually applied, so as to let the user know which one got applied in the end.

      related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=994559

      132 votes
      Vote
      Sign in
      Check!
      (thinking…)
      Reset
      or sign in with
      • facebook
      • google
        Password icon
        I agree to the terms of service
        Signed in as (Sign out)
        You have left! (?) (thinking…)
        planned  ·  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
      • Inspect websocket connections

        It will very useful for who works with websockets inspect the traffic and connections.

        288 votes
        Vote
        Sign in
        Check!
        (thinking…)
        Reset
        or sign in with
        • facebook
        • google
          Password icon
          I agree to the terms of service
          Signed in as (Sign out)
          You have left! (?) (thinking…)
          6 comments  ·  Flag idea as inappropriate…  ·  Admin →
        • Make collapsing margins visible and show from which element they come from

          When inspecting HTML elements, CSS margins which collapsed should be highlighted with a new color. It also would be nice if it was possible to show some information about the elements involved and which the margin of which element is visible.

          68 votes
          Vote
          Sign in
          Check!
          (thinking…)
          Reset
          or sign in with
          • facebook
          • google
            Password icon
            I agree to the terms of service
            Signed in as (Sign out)
            You have left! (?) (thinking…)
            2 comments  ·  Flag idea as inappropriate…  ·  Admin →
          • Shadow DOM Support

            There should be a way to view Shadow Root elements in dev tools like there is in Chrome. This seems to work with user made Shadow DOM elements but not with preexisting html5 elements like the video tag.

            1 vote
            Vote
            Sign in
            Check!
            (thinking…)
            Reset
            or sign in with
            • facebook
            • google
              Password icon
              I agree to the terms of service
              Signed in as (Sign out)
              You have left! (?) (thinking…)
              0 comments  ·  Flag idea as inappropriate…  ·  Admin →

              Thanks for the feedback! Currently the shadow DOM spec and the related Firefox implementation are still being worked on. As the new standard is finalized we will be providing better support for things like the native Audio and Video tags.

            • firebug-like DOM panel

              Please include a DOM panel like the one in Firebug, but especially the ability to see and modify local and session storage.

              20 votes
              Vote
              Sign in
              Check!
              (thinking…)
              Reset
              or sign in with
              • facebook
              • google
                Password icon
                I agree to the terms of service
                Signed in as (Sign out)
                You have left! (?) (thinking…)
                2 comments  ·  Flag idea as inappropriate…  ·  Admin →
              • 107 votes
                Vote
                Sign in
                Check!
                (thinking…)
                Reset
                or sign in with
                • facebook
                • google
                  Password icon
                  I agree to the terms of service
                  Signed in as (Sign out)
                  You have left! (?) (thinking…)
                  planned  ·  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                • Modification of local storage / indexeddb

                  I would like the ability to edit or delete records from indexeddb through the storage tab. Currently, there is a way to view the data, but no way to remove or manipulate that data.

                  16 votes
                  Vote
                  Sign in
                  Check!
                  (thinking…)
                  Reset
                  or sign in with
                  • facebook
                  • google
                    Password icon
                    I agree to the terms of service
                    Signed in as (Sign out)
                    You have left! (?) (thinking…)
                    2 comments  ·  Flag idea as inappropriate…  ·  Admin →
                  • Highlight nodes on hover of breadcrumbs

                    For consistency reasons, everywhere in our devtools where we display DOM nodes, they should be displayed similarly and support the same kind of actions.

                    One such action is highlight in the page on hover. Highlighter on hover works in the markupview, console and variablesview. However it doesn't work in the breadcrumbs, but it should.

                    related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=993445

                    4 votes
                    Vote
                    Sign in
                    Check!
                    (thinking…)
                    Reset
                    or sign in with
                    • facebook
                    • google
                      Password icon
                      I agree to the terms of service
                      Signed in as (Sign out)
                      You have left! (?) (thinking…)
                      planned  ·  2 comments  ·  Flag idea as inappropriate…  ·  Admin →
                    • if the content of a node is only text, we should expand the ellipsis

                      Currently you need to expand the nodes to see text, we should be smarter here and show people at least an abbreviated version of the textContent for the node.

                      related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=892935

                      7 votes
                      Vote
                      Sign in
                      Check!
                      (thinking…)
                      Reset
                      or sign in with
                      • facebook
                      • google
                        Password icon
                        I agree to the terms of service
                        Signed in as (Sign out)
                        You have left! (?) (thinking…)
                        planned  ·  1 comment  ·  Flag idea as inappropriate…  ·  Admin →
                      • Get rid of sub-windows when clicking on a Network item in the Console tab.

                        Why does the network request & response data open in a sub-window? This is clunky when the contents of the window are important enough to be in the sidebar, like how logged objects are clickable.

                        19 votes
                        Vote
                        Sign in
                        Check!
                        (thinking…)
                        Reset
                        or sign in with
                        • facebook
                        • google
                          Password icon
                          I agree to the terms of service
                          Signed in as (Sign out)
                          You have left! (?) (thinking…)
                          3 comments  ·  Flag idea as inappropriate…  ·  Admin →
                        • Device Orientation emulation with the Firefox OS simulator in App Manager

                          Adding a feature to emulate the accelerometer in the Firefox OS simulator. It will never replace a real device, but will be helpful for testing purpose with:
                          - how much the device has been rotated around the z-axis.
                          - how much the device is tilted left-to-right.
                          - how much it's tilted front-to-back.

                          12 votes
                          Vote
                          Sign in
                          Check!
                          (thinking…)
                          Reset
                          or sign in with
                          • facebook
                          • google
                            Password icon
                            I agree to the terms of service
                            Signed in as (Sign out)
                            You have left! (?) (thinking…)
                            1 comment  ·  Flag idea as inappropriate…  ·  Admin →
                          • Persistent multiline command editor (like Firebug)

                            Firebug has the ability to switch between the Command Line (one-off commands) and the Command Editor, which is multiline, syntax-highlighted, and most importantly *persistent* (Cmd/Ctrl+Enter to run the code, then you can play around with it). This is mostly what's keeping me from switching from Firebug to Developer Tools.

                            (Also please make sure that it runs in the same context as the console; Chrome has a kind of similar feature called Snippets, but they don't run in the breakpoint context when debugging, making them much less useful).

                            52 votes
                            Vote
                            Sign in
                            Check!
                            (thinking…)
                            Reset
                            or sign in with
                            • facebook
                            • google
                              Password icon
                              I agree to the terms of service
                              Signed in as (Sign out)
                              You have left! (?) (thinking…)
                              4 comments  ·  Flag idea as inappropriate…  ·  Admin →
                            • Geolocation emulation with the Firefox OS simulator in App Manager

                              Can we add an option to fake the GPS, so developers can test their applications using geolocation.

                              It was previously in the simulator, but was removed, I think, when we went from the Firefox OS Simulator 4.x to App Manager. Can we add it back in the simulators used in App Manager? It was useful for developers using the geolocation in their application.

                              35 votes
                              Vote
                              Sign in
                              Check!
                              (thinking…)
                              Reset
                              or sign in with
                              • facebook
                              • google
                                Password icon
                                I agree to the terms of service
                                Signed in as (Sign out)
                                You have left! (?) (thinking…)
                                2 comments  ·  Flag idea as inappropriate…  ·  Admin →
                              • I would like to see all CSS rules, not just the ones being applied to Firefox

                                In Google Chrome, I can see all CSS rules, whether prefixed with -webkit, or -moz. In Firefox dev tools, I would like to see all CSS rules being applied to an element, not just the CSS rules that are being applied to Firefox.

                                1 vote
                                Vote
                                Sign in
                                Check!
                                (thinking…)
                                Reset
                                or sign in with
                                • facebook
                                • google
                                  Password icon
                                  I agree to the terms of service
                                  Signed in as (Sign out)
                                  You have left! (?) (thinking…)
                                  1 comment  ·  Flag idea as inappropriate…  ·  Admin →
                                • Allow clicking on a URL for an iframe, image, or link to open that link in a new tab or window

                                  It would be great to be able to interact with links from the markup view.

                                  We could automatically convert these URLs into links that open in a new tab on click, or we could allow a right click -> "Open in new tab" feature for these attributes. Also, a "Copy Link Location" action on right click like what happens in the main browser context menu would be great.

                                  related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=966468

                                  12 votes
                                  Vote
                                  Sign in
                                  Check!
                                  (thinking…)
                                  Reset
                                  or sign in with
                                  • facebook
                                  • google
                                    Password icon
                                    I agree to the terms of service
                                    Signed in as (Sign out)
                                    You have left! (?) (thinking…)
                                    planned  ·  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                  • Allow multiple selection of DOM nodes

                                    Having the possibility to get a selector matching the selected set of nodes would also be useful.

                                    1 vote
                                    Vote
                                    Sign in
                                    Check!
                                    (thinking…)
                                    Reset
                                    or sign in with
                                    • facebook
                                    • google
                                      Password icon
                                      I agree to the terms of service
                                      Signed in as (Sign out)
                                      You have left! (?) (thinking…)
                                      1 comment  ·  Flag idea as inappropriate…  ·  Admin →
                                    • Positioning information in Box Model view

                                      I've been finding myself wishing the box model view showed positioning information. Specifically, I'd like to see the following attributes:

                                      * display
                                      * position
                                      * top, right, bottom, left
                                      * z-index

                                      6 votes
                                      Vote
                                      Sign in
                                      Check!
                                      (thinking…)
                                      Reset
                                      or sign in with
                                      • facebook
                                      • google
                                        Password icon
                                        I agree to the terms of service
                                        Signed in as (Sign out)
                                        You have left! (?) (thinking…)
                                        3 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                      • add an option to show the browser rules in the "rules" sub panel

                                        Currently, we can toggle the browser rules in the "computed" sub panel, but not in the "rules" sub panel. This would be super useful to have them here as well.

                                        Note that Firebug has this option ("show the default rules").

                                        related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=940950

                                        3 votes
                                        Vote
                                        Sign in
                                        Check!
                                        (thinking…)
                                        Reset
                                        or sign in with
                                        • facebook
                                        • google
                                          Password icon
                                          I agree to the terms of service
                                          Signed in as (Sign out)
                                          You have left! (?) (thinking…)
                                          planned  ·  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                        • Property grouping

                                          Computed properties in the inspector's computed-view are sorted alphabetically. It could help grouping them by types instead.

                                          Firebug groups them by Text, Background, Box-Model, Layout, ...
                                          I'm not saying we should do exactly the same, but I think this grouping helps (+ the group headers have collapse/expand arrows and the state remains when new nodes are selected, which helps if you're only interested in one set of properties).

                                          related bug: https://bugzilla.mozilla.org/show_bug.cgi?id=977128

                                          3 votes
                                          Vote
                                          Sign in
                                          Check!
                                          (thinking…)
                                          Reset
                                          or sign in with
                                          • facebook
                                          • google
                                            Password icon
                                            I agree to the terms of service
                                            Signed in as (Sign out)
                                            You have left! (?) (thinking…)
                                            planned  ·  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                          ← Previous 1
                                          • Don't see your idea?

                                          Firefox Developer Tools ideas

                                          Feedback and Knowledge Base