Firebug used to to display styles in the Computed panel like this, with computed styles grouped:
But for some reason it now displays computed styles like this:
The only grouping available is "Other" which appears to contain every CSS style. How do I make CSS styles group together?
I am using Firefox 46 with Firebug 2.0.16. The change began seemingly out of nowhere, I did not adjust any settings.
I have tried toggling every option in the dropdown menu. The value of the computedStylesDisplay setting is grouped (default value). I tried switching to alphabetical and then back to grouped but it changed nothing.
This is obviously a bug in Firebug in combination with Firefox 46.0. In Firefox 45.0.x it was still working fine.
I've filed a bug for that in Firebug's issue tracker and already fixed it. I have also created a build with that fix. Now it's up to the Firebug team to make a proper new release.
Note that the Firebug team is already working on Firebug 3, which integrates into the Firefox DevTools. Those tools don't have the grouping yet, but it's already requested in bug 977128.
Update:
Firebug 2.0.17 got released, which includes the aforementioned fix.
Update:
Firebug is officially discontinued, i.e. its maintenance has stopped in favor of pushing the development of the Firefox DevTools.
I've run into the same issue. It doesn't exactly solve the problem but what I've found helps at least a little is to click Options -> Show Quick Info Box. Gives a list of current applied styles to the element you're hovered over in the HTML console but unfortunately doesn't provide the original CSS reference line.
Related
I suddenly realised that my Magento select boxes on the frontend can't be selected. When I click on the specific option it freezes like there's something preventing the default action of selecting the option and the options remain expanded. I have no ideas what to do. Tried to inspect it with Firebug and see if there are any errors but it shows none. very very nasty issue and can't find any answer googling about it - magento 1.9.1 is my version.
THe problem was only in Firefox and not in other browsers so hopefully it will be resolved in next version.
jquery-bootgrid is a great little tool, i have it working perfectly well functionally, but i have an issue with the styling of the control.
For some reason the search bar generated by the js library spans across the entirepage, forcing the control for selecting the number of results shown, down to a new line.
I've also noticed that the paging control isn't styled correctly and nor is the dropdown for removing columns.
I've got the latest css and js files, is anybody else having the same issue?
I have the latest bootstrap available, could this be an issue?
My bad, I didn't include the jquery.bootgrid.css in my bundling at the right spot.
Today, I open my website which use CKEditor.
I encounter a strange behavior. In any page that has CKEditor, jquery click event listener seems to not work.
This is odd. I have try to open the same website in chrome and firefox 32 with no problem.
I even try to visit CKEditor website to make sure that this problem is not caused by my script.
And I can ensure that the problem is occurred exactly as in my website. CKEditor has javascript based menu, if you click "Full featured" link, the element on the left-side should be changed with respective element. But it doesn't response as it should be. (Just for the record, this website also works fine in chrome and firefox 32)
I have also use firebug to find any helping-error-message, but I can't find any error message there.
I am sure this must be firefox's bug. Hopefully they will fix this in firefox 34.
However, does anybody experience the same problem? Is there any workaround for this?
UPDATE : Seems that this problem is caused by plugin (firePHP or fireQuery). Look at the comments for more information.
I have a fresh installation of Liferay on Tomcat and in IE7 it doesn't show the buttons for visual editing in the editor when I try to edit content.
It works on in Firefox or Chrome.
Does anyone have an idea why would that happen? I am not sure where to dig, I don't see javascript exceptions and it doesn't look like the buttons are even populated in IE. It is hard to debug IE problems since I don't have a tool like Firebug there.
I downloaded the 6.1 and still have the same problem, adding the URLs of what I see. Looks like IE only has the text box and in the DOM I don't see the same things that I see in FF.
http://i44.tinypic.com/35jf5td.jpg
http://i43.tinypic.com/11qqvt0.jpg
Update on this:
I checked with some people in our organization and they have the buttons on their browser.
I checked the version of the IE browser and it's the same down to the last digit. Properties are the same as well. The only difference is that I have some plugins installed that the other browser doesn't. I tried disabling all the plugins but it didn't help.
The suspect plugin is Google Chrome Frame (ChromeFrame BHO). Can someone please try to add this plugin and see if it messes things up? The disabling it doesn't help.
Liferay CE 6.0 contains few bugs within the WYSIWYG editor integration.
One issue with IE is LPS-16004 (solution included). This might be the same problem as you are experiencing.
I remember we had also problem with javascript race condition in editor initialization, which sometimes loads the editor incorrectly.
But I strongly suggest you to move to Liferay CE 6.1 as it is much more stable.
Ok, I finally figured it out, so if someone has the same problem, here is the reason - we have Google Chrome Frame plugin installed in our organization, but it only works on white-listed domain names. In this case the domain the site was on wasn't whitelisted, but the portal looked at the agent string and saw chromeframe there and assumed it can use it as chrome browser, which broke things.
Right now I will try to white-list the domain and see if it works. Another solution would be to try and find a place where we look for the agent string and fix it there, not sure where this place is.
Is it possible through a plugin or setting or something to allow Firefox to recognize the live DOM source code?
Basically, firebug or other similar tools can recognize elements on the page which Firefox does not.
I understand with these extensions I have the ability to see such changes made by javascript, but Firefox does not seem to fully recognize them.
I'll try to clarify.
If I load a page and view source (ctrl-U), I see what the server sent to Firefox, and what Firefox ostensibly recognizes as the source code of the page. If in that source code, there is javascript which alters the DOM, and then I hit (ctrl-U) again, the code is not updated.
I am using a testing tool (iMacros firefox plugin) to automate functionality, but it does not recognize the updated DOM because Firefox does not. Firebug and similar tools can recognize these "live" updates. Does that help?
http://www.chapter31.com/2006/12/04/viewing-ajax-generated-source-code/
You can try using the web-developer extension with a view-generated-source option.
I'm still not sure I understand your question, but I think what you're getting at is the Web Developer extension for FireFox, specifically its "View Generated Source" feature.
That will let you see the altered DOM.
Firebug gives u this ability:
for instance check the HTML tab when running a jquery ticker and see the dynamic changes live in the DOM
Usually, when I have weird issues with either the console or the DOM inspector with firebug, I find restarting the browser and validating your code is the way forward.
That said, I'm not really following your question, the document that firebug shows is the same one in the firefox window...?
It looks like the problem is not that you want firefox to show the current DOM when you hit CTRL+U, but that you want some automated testing tool to be able to test your web pages.
Perhaps you should use a testing tool that is suited to the job of testing rich web applications, Selenium, for example, can do this.