I have a JavaScript issue where something doesn't work in Chrome but works in Firefox. Since this is part of a big Web Portal, I cannot easily isolate stuff.
I know that Chrome has a Javascript timeline, but does Firefox have something like that as well? Firebug only seems to set arbitrary breakpoints or "Break on Next", but no way to just see what JavaScript is executed.
Open firebug and click the arrow on the "net" tab. click enable. Lastly, reload the page.
Related
I am working on a google chrome extension. I am using Liquid slider to help me with the popup, when I am in brackets and do live preview, I get exactly the result I want.
https://gyazo.com/d2b5e7215ff8dfab59d677fd94637a25
But when I go into google chrome to test my extension this happens.
https://gyazo.com/48ea596645f0b16305915fb144d2aad8
It is not in the tab format anymore.
I could not find any support on this, if anyone has any idea why this does not work. Is it just because I can't use Liquid Slider in my chrome extension? I have no idea. Please tell me if you need more information.
Edit: If it is not possible to fix the error and bring back the tabs, we can also just use arrows, and figure out how to delete the tabs.
Chrome extensions have stricter security & sandboxing than regular web pages - for example, Content Security Policy is enabled by default. That may explain the difference.
To get more specifics about what's going wrong, you can debug your extension by right-clicking the icon and selecting Inspect Popup. This will open the familiar Chrome Dev Tools where you can check the console for errors, etc. Does that give you more specifics to go on?
How can I see javascript error when loading chrome extensions? I've tried using developer tools but I don't see any errors there. Also if I use console.log, I don't see any output in the console.
Anyone have any ideas?
http://code.google.com/chrome/extensions/tut_debugging.html
Go to the Extensions page (chrome://extensions), and make sure Developer mode is still enabled. The Extensions page doesn't need to be open for the following to work. The browser remembers the setting, even when the page isn't shown.
Right-click the extension's icon and choose the Inspect popup menu item. The popup appears, and a Developer Tools window like the following should display the code for popup.html.
The above answer doesn't work anymore. Sadly the Inspect Popup menu item has been removed from Chrome.
But this answer works:
Debug popup.html of a Chrome Extension?
(More precisely: the second comment of the first answer on the above page helps).
When I open a site, I want to see all rendering process step by step as I press a kind of "Next Step" button.
At first page will be empty then every time I click Next browser will render next item and stop (DOM or whatever) and tell me which javascript line is executed, which css is applied and so on.
Is there a way to see all these?
Tools like Firebug and Chrome Developer Tools allow you to debug JavaScript functions step by step. However, sounds like you'd like to walk through page rendering, which isn't related to JavaScript.
I don't know any tool which actually pauses rendering and lets you walk through it, but if what you're after is profiling you should check out Chrome's Timline tab, which features detailed views and data about whatever happens on-page, including rendering.
You can use Firebug(Chrome and Firefox), Chrome Dev Tools (Chrome), Dragonfly (Opera) or IE Developer Toolbar for IE.
Use the excellent Firebug to debug through your javascript.
Or use Chrome developer tools, it's nice too
You can use the Online JavaScript Tutor for visualizing your code.
Got this page which has some javascript on it (very heavy) and I am trying to see what happens when I click a certain element. However looking at the code there is no onclick function - the javascript is several JS files so take far to long to browse.
Is there a way with Firefox (firebug), Chrome or even IE to view whats / log what is happening when I click on an element in the browser?
In firefox (and this is also available in chrome and IE in another form) install addon firebug (if not installed). Go to Tools->Birebug->Open Firebug. Click on Left Icon and ask for tracing.
You can then trace your program.
Another way is to cause a breakpoint when you start, and you manually follow the execution of the script.
Chrome Developer Tools shows all attached event handlers for an element. See the section on Event Listeners towards the end.
#wizzard, try this: firebug - profiling button
ff only, but there is a lite version for chrome for example
I have a longpoll running but when I open a new tab in Firefox, or minimize the browser the longpoll seems to time out!? However if I leave the tab selected, or make a new dedicated window with Firefox open it won't time out.
Does anyone have any thought or insight on this weird behavior? When minimzied/alternate tab does Firefox stop running JavaScript in those tabs?
By the way I'm using Firefox 3.6.
No, it does not stop running JavaScript. And It does not block you from modifying the DOM. I have an app that runss a poll on server (I have both synchronous and async transmission) and then updates the dom based on results. And if I am looking at the tab or nor, and even if the firefox 3.6 is minimized - it just works. I have just tested it (again), before posting this answer.
Even the javascript test tools like selenium (in javascript) that are manipulating the DOM are working without focus.
So please check your code, it probably does require focus on some tab or on some element (like syockit suggested). I belive that you have the firebug, and you can easily analyze and debug your javascript (if it is not obfuscated).