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. Blackbox all scripts for a host

    You should be able to blackbox all of the scripts for a host by clicking on its header in the list of scripts. Doing this should also collapse that group to make it easier to find what you're looking for.

    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…)
      0 comments  ·  Flag idea as inappropriate…  ·  Admin →
    • Commented-out lines in the javascript code causes error messages in Console. I can send you code and video : cyprent@gmail.com

      Commented-out lines in the javascript code causes error messages in Console. I can send you code and video : cyprent@gmail.com

      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 →
      • I want to be able to perform a simple find-in-page operation (not find with CSS selectors)

        Apple-F or Ctrl-F should perform a simple text search in the document inspector HTML - instead it now performs a CSS selector search (which is a great feature, but I want/need a simple text search in page function)

        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…)
          0 comments  ·  Flag idea as inappropriate…  ·  Admin →
        • Complete Selector Path like in Firebug

          It would be very helpful to let users copy the complete CSS path for an element...not only the explicit selector! Maybe you can add a second option for that in the context menu!???

          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 →
          • A shortcut for the eydropper!!!!!

            Would be really, really, really helpfull to have a keyboardshortcut for the new eyedropper!!!

            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 →
            • Visualize the box model of multiple elements simultaneously

              Currently hovering a selector in the Rules panel will shade all matching elements. But it does not show the box model (margin/padding).

              Sometimes you want to see the full box model of 2 very different elements at the same time to get an idea of how their margins/padding are interacting with each other.

              For example. A div with a black background contains 10 elements floated left, all of the same height. One of those 10 has a bottom margin larger than the rest. Seeing the full box model for all 10 items would allow you to see the problem much…

              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…)
                0 comments  ·  Flag idea as inappropriate…  ·  Admin →
              • Format form data in post request

                When I use POST requests with XHR / FormData, the request appears in the Network panel, with the tabs headers, response and so on.
                But unlike the response data, the request data is not formatted (e.g. Code folding).

                Instead I'm seeing a raw text which includes all the data, but bloats very fast when uploading some binary stuff.

                It would be nice when:

                1. the sections are folded like in response
                2. load for machines (like -----------------------------4351378321639114234371756302
                Content-Disposition: form-data; name="description") parsed into a more human-readable form
                3. binaries are hidden or, even better, displayed as images (when they are)

                2 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…)
                  0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                • Option to Disable Variable Optimisations

                  Often one is writing code in a way that's most efficient at expressing the logic flow or for others to follow when performance is not an issue.
                  Sometimes the coding is conceptually hard of itself and in this context the last thing you want when debugging a script that's not working is a list of 'optimised away' variables with no value.
                  If there isn't one already, can I strongly suggest there be an option to disable optimisations to the level that you can always see the value of a variable. As optimisation technology improves this will become more of an…

                  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 →
                  • Browse to function declaration when clicking its name in console

                    I'd like to be able to find the function declaration in the source (in the "Debugger" tab), when clicking on its name in the Console.

                    Right now, when one writes a function name (say "foo") in the console and presses enter, a "function foo()" string appears (provided it is actually declared somewhere, and is in scope). The name "foo" is clickable and opens the function object properties in the properties pane on the right. I'd like this behavior to change, or get enhanced. Clicking on foo, could bring you to the "Debugger" tab, and place the cursor on the "function…

                    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 →
                    • A few dashboard on new tab page

                      on PC with small screen I can't fit all tiles which I want. So it would be great if on one dashboard I place top visited sites, on second - hobbies, on third - news, etc...

                      2 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…)
                        0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                      • Add debug support for .scss files generated by compass

                        It would be nice if the css inspector supported .scss files generated by compass so it is easier to debug them. Eg, showed the file/folder and line number from the comment.

                        You could port FireCompass for Firebug to the developer tools https://addons.mozilla.org/en-us/firefox/addon/firecompass-for-firebug/

                        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…)
                          0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                        • Front end testing

                          A tool providing testing.
                          I don't know how this can be deep in testing behaviors (e.g. karma or selenium way of) but just an automated scriptifyable tool can be usefull, like the Photoshop script handler but for clicks in pages, fills in forms…

                          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 →
                          • Wi-Fi debugging on Windows 10

                            Wi-Fi debugging for Firefox OS works on Windows 8.x, but Firefox Developer Edition on my Windows 10 Tech Preview machine can't see any online Wi-Fi devices in WebIDE.

                            It'd be nice if WiFi debugging In WebIDE could be added to Firefox builds running on a Win10 machine.

                            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…)
                              1 comment  ·  Flag idea as inappropriate…  ·  Admin →
                            • Expand truncated (ellipsis-ized) Header values to full length tooltip

                              In the dev. tools if a header value is too large, the value is truncated / ellipsis-ized. Which is great, would there be a way to hover over it to see full blown value ?

                              Check the screenshot
                              http://postimg.org/image/wkk57169v/

                              I'm using the latest FirefoxDev. Edition 40.0a2

                              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 →
                              • Various

                                I posted a list of suggestions somewhere ( http://forums.mozillazine.org/viewtopic.php?f=8&t=2937437&p=14173097#p14173097 ) but I think here might be a better place? namely ---

                                When debugging a running script, you get all the variables listed on the right hand pane.
                                However, I am never interested in knowing all the variables. If I want to know one more widely, I can type the variable to get its value or put it in the watch. Perhaps it's useful/ok if there are only a few variables on it, but I'm never going to scroll down a long alphabetical list when there are many.
                                What I AM…

                                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 →
                                • Make the close button of the find toolbar easier to see

                                  The close button appears on the far right of the find (ctrl + F) toolbar and is nearly invisible with the 'Developer Edition' theme of Firefox. Please make it more visible, like the close button of the tabs of each page.

                                  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 →
                                  • Improve the Request Payload visualization

                                    Currently, the 'post' requests are shown as a single string (Request Payload), while the 'get' requests have a nice Key:Value view. It would be nice to have the same view for 'post' requests as well.

                                    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…)
                                      0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                    • Use Function names to represent Closure Scopes

                                      Steps to reproduce the problem:

                                      1. Write some JavaScript Code with closures created by named functions (either function declarations or named function expressions)
                                      2. set a breakpoint or a "debugger;" expression in an inner function
                                      3. Execute it with Web Inspector activated

                                      What is the expected behavior?

                                      The "Scope" panel of the JavaScript debugger represent all the accessible scopes at the current state of the execution.
                                      When I want to watch the variables from a specific closure scope, I expect to be able to immediately expand the right closure based on the name of the function it is related to.

                                      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…)
                                        0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                      • Add further support for clip-path

                                        It would be great to build in more support for clip-path beyond the url() property.

                                        2 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…)
                                          0 comments  ·  Flag idea as inappropriate…  ·  Admin →
                                        • Allow the event inspector to decode event listeners added using js libraries

                                          Currently, the event inspector (the ev logo next to an element with an event handler attached) is useless when the event has been added using a library such as jquery or prototype. It would be nice if you could either traverse the stack to manually find the function that added it, or if Firefox automatically traversed it and found the user-generated code that added the event listener (though this would be more complicated and less widely usable).

                                          2 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 →
                                          ← Previous 1 3 4 5 19 20
                                          • Don't see your idea?

                                          Firefox Developer Tools ideas

                                          Feedback and Knowledge Base