How can I inspect the contents of an add-on panel in Firefox's Inspector? - firefox-addon

I am authoring an add-on for Firefox that generates a panel when the user clicks the button in the add-on bar.
In Chrome, my popup renders the way that I want it to, but I can right-click on the popup and select "Inspect element" from the context menu to debug the rendering.
In Firefox, the panel is rendering strangely, but right-clicking on it doesn't give me a context menu. Selecting Debug from the add-on tab allows me to see the content scripts and set breakpoints, but no Inspector there either.

The "inspect element" in chrome is probably visible while you are in developer mode right?
I'm not sure about the firefox inspector yet, but it is possible using:
https://addons.mozilla.org/en-us/firefox/addon/dom-inspector-6622/
and then an addon for this inspector called:
https://addons.mozilla.org/en-US/firefox/addon/element-inspector/
This addon really enables catching context menus and other temporally displayed elements. Shift + Right click and it will popup in inspector.
This DOM INspector is how we used to do it before firefox devtools came up. I'm sure there is a way, I just havent explored it too much yet.

Related

Microsoft Edge always open new tab instead of new window

Since last week, when I right click on Edge taskbar tab to open new tab or new window, it opens a new tab always, instead of opening a different window
This is how it looks.
I checked out all options, but didn't find any such customization. I tried to un-install and re-install the Edge browser, it worked for a while, but once the system restarted, it started same behavior again!
Any idea, how could I change that to open new window when clicking on 'Microsoft Edge' instead of opening a new tab in an existing window?
From your description, I assume that there might be some malicious software hijacking your Edge browser. It locks the homepage of Edge and tampers the shortcut of "Microsoft Edge".
The right behavior of clicking on "Microsoft Edge" should be opening a new window. But I can reproduce your issue with the steps below:
Right click Edge icon on taskbar.
Right click Microsoft Edge then click Properties.
In the Microsoft Edge Properties window, add a webpage url after Target value.
Click Apply, OK to save the changes.
Click Microsoft Edge in taskbar Edge right click menu, it will open the webpage url as a new tab in an existing window.
You can refer to my steps above to check your Edge Target value in Microsoft Edge Properties. Please make sure there's only the path of Edge exe in the Target value. The right value of Target should be like this (your path might be different with mine, below is just an example of mine):
"C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe"
If there's anything else, it's very likely that a malicious software tampers it. Then you should check your computer thoroughly to remove any malicious software and virus.

enable right-click context menu for firefox webextension popup

When I open my firefox web extension popup, and try to right click it, nothing happens. How do I enable right-clicking in a firefox web extension popup, so that the context menu appears? I want users to be able to right-click an image and copy it

Why Won't Firefox Add-on Browser-Action Pop-Up Close?

I'm working on a Browser extension/add-on. We have it working in Chrome, so I'm trying to get it working in Firefox.
I've only gotten my extension to load in Firefox Developer Edition 49.0a2 (2016-07-25) (I'm not sure why it doesn't work normally, but have asked elsewhere).
My add-on uses a browser_action to add a button to the toolbar and open a pop-up, which opens fine, but once it's open, it seems impossible to close without quitting Firefox entirely.
In fact, it's so pernicious, the pop-up then appears over other applications!
Is this just a current bug in Firefox, or is there a way for me to fix this?
You might have accidentally clicked the "only close the popup on ESC" button in the firefox debugger, which keeps a popup open until you press Escape. Source: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging#Debugging_popups
IF your browser extension popups (and right-click context menus, bookmark menu etc.) persist and refuse to go away unless you press Esc AND you have the ’Browser Toolbox’ window open—then you have probably left the ‘Disable Popup Auto-Hide’ option enabled. (This setting is only in effect when the Browser Toolbox window is open.)
To disable this setting, go to the Browser Toolbox window (the window title is ‘Developer Tools – Debugging’), then, in the upper right-hand corner, press open the three-dots menu, and uncheck ‘Disable Popup Auto-Hide’. (If checked you get sticky popups/context menus. If unchecked the popup/context menu will close if you click outside it).
Browser Toolbox
NOTE: If your browser menu does not have a ‘More tools > Browser Toolbox’ option, then the Browser Toolbox is disabled, and cannot be causing the sticky popup behavior.
The Browser Toolbox window can be opened through the browser main menu (the little hamburger icon, rightmost in the URL bar of the browser) ‘More tools > Browser Toolbox’ (or Ctrl-Shift-Alt-I).
The Browser Toolbox is disabled by default, so, for the above paragraph to work must first be enabled. To do this click on main menu icon, then ‘More Tools > Web Developer Tools’ (Ctrl-Shift-I), then, in the Developer Tools frame (or window) click the three dots menu icon (top right) and select ‘Settings’.
In the settings, scroll down to the bottom right (under the ‘Advanced settings’) and check the last two options:
[✔️] Enable browser chrome and add-on debugging toolboxes
[✔️] Enable remote debugging
Your browser menu should now contain the ‘More tools > Browser Toolbox’ option. (From the MDN Web Docs ‘Enabling the Browser Toolbox’.)
This answer (just like #Lakinator’s answer) is based off of information found on Mozilla's official site.

Missing dev tools context menus in Edge insider build

I just updated to the Windows Insider Preview Build #14328 and can't find the Inspect Element or View Source context menu options in Microsoft Edge to open the F12 Developer Tools. Where have they gone?
The Inspect Element and View Source context menus are now hidden by default in Edge. To bring them back open the F12 developer tools either from the … (more) menu or by using the F12 key. Once you open the tools for the first time the context menu items will be added back.
You can also add the context menus back by navigating Edge to about:flags and checking the Show Inspect Element and View Source context menus.

Disable button focus border

I have a Jquery Mobile page with buttons
When set the focus to a button with Tab, there is a blue border... (Only with IE when browsing in a WPF WebBrowser control)
I would like to disable this border in the css, because when I click in the page, it automatically focus my first button...
It seems simple but I can't manage to do it...
For some reasons, I can't inspect the page to know the css property to disable.
What is the equivalent of "-moz-focus-inner" for Internet Explorer ?

Resources