Develop Reference

open Chrome console when DOM ready and set viewport

I am wondering if there is any way I can open Chrome console when the webpage is firstly loaded and set the viewport to a specific device (iPhone X), through a JavaScript code.
I had to do a test where I should only work on iPhone X viewport so I thought was nice if they can already see the console opened with the interested viewport active so they are going to check straight away my work instead of clicking cmd+alt+j and then set toggle device toolbar
Thanks

I don't know this to be true, but I'm guessing that might not be possible because it would infringe on the sandboxing principles that Chrome tabs are based on. You are asking for system level control of the Chrome Browser UI, and there's a lot of effort put into not letting JS code do that because of malicious intent.
You could try using Electron to build an App that does this for you, however that may still have the sandbox boundary concern.
EDIT - You may also look into the Chrome extension architecture. It allows you to implement code outside of the sandbox boundaries. I'm not entirely hopeful that this would work, but it I do know that extensions allow you to control most of interface.

make webpage recognize my own device for debug purpose through javascript

I build my site with Joomla, by default the page is responsive. I want to turn off responsive design, but there is no turning off option on back-end, so I had to use:
$('meta[name=viewport]').attr('content','width=1200px');
to turn off responsive so that I didn't have to bother with mobile layout .... for a while. Now the site is live, and I am about to start to make the page responsive. I want to debug this on the live page but don't want other users to see some messed up page when I am still tweaking it. So I am thinking whether there is a way to make the page recognize my own devices only.
I understand that I can use login system, but that would be too complicated. The simplest way I can think of is to do this
if (location.search.indexOf('nores') < 0) {
j('meta[name=viewport]').attr('content','width=1200px');
}
and then open each page like this mystie.com?nores. But this is still a little troublesome, besides I can't freely navigate pages.
The other way I was able to find out is to add some custom string to userAgent, I think this can be done through chrome's developer tools, but what about mobile browser? Similar is using localStorage, on PC, I can just open the page, go to console and do localStorage.setItem('nores',true), but how can I do this for my phone?

google chrome keeps on loading my site

I'm making my personal website using a lot of jquery and the basic HTML5/CSS3. I just put some $(document).ready(), maybe that's where the issue comes from..
As I'm trying to see how browsers deal with it, I figured out that google chrome keeps on loading (something but what?) the page. I mean the wheel is spinning in the tab panel and at the bottom of the page, I have a bar saying "Waiting for localhost...". I don't have this issue with Internet Explorer for instance.
How can I find where the problem comes from? Is it just a bad interpretation of chrome? The bar at the bottom is actually quite annoying...

I've been through this:
Try to load the page in anonymous mode (⇧+⌘+N) - if there is no spinning
I would bet on an network activity caused by an extension - check the list (chrome://extensions/) and try to disable a few

Changing browser title not blinking browser in taskbar

There are a lot of tutorials on how to do this, and the crux of it seems to be changing the title constantly so the browser tab or taskbar will flash, however this doesn't seem to work for me.
I can see the tab changing its title, but it doesn't flash, so I am wondering if this is something which is no longer allowed by browsers?
I am using Windows 8.1, however have also tried Windows XP
I am using Firefox 25.0.1 and Chrome 31.0.1650.57 and neither of them react how I would expect.
As an example go to:
https://rawgithub.com/heyman/jquery-titlealert/master/example/index.html
(Make sure you click the shield icon in your url bar to allow the scripts to run on that page)
Then if you click the default example button and switch tabs, I would expect the tab hosting that page to blink or flash to indicate the tab has new content, however it doesn't do that for me, although I can see the text changing constantly.
Does anyone else have this issue and know how to solve it or why it occurs? I am looking to implement a feature in a chat system where it notifies you to new messages, however for some reason the code works fine and the title changes, but the taskbar or tab do not flash or anything and the users are really wanting this feature soon.
There seems to be no information on the internet related to this so im a bit confused and came here as a last resort.

In Firefox, tab flashes when title is changed ONLY if it is a pinned tab.

Removing Firefox Star Icon and Bookmark Icon

I am building an application which has requirements stating that all browser features must be disabled. (It's a test taking application and they are worried about security/cheating.)
I popup a new window so that I can make it fullscreen, disable the menu bar, tool bar etc. However Firefox still has two icons remaining that I can't figure out how to disable. The 'Page' icon and the 'Bookmark' star icon are still on even when I call window.open with location=no. Here is the window.open command:
window.open("filename", "test", "fullscreen=yes,status=no,toolbar=no,location=no,menu=no,directories=no,scrollbars=yes");
Is there anything I can do about this?

From the MDC documentation for window.open():
Mozilla and Firefox users can force new windows to always render the location bar by setting dom.disable_window_open_feature.location to true in about:config or in their user.js file
In Firefox 3, dom.disable_window_open_feature.location now defaults to true, forcing the presence of the Location Bar much like in IE7.
This was done to help thwart phishing exploits. You're better off (your users are better off) leaving it enabled, even if you have control over the machines on which the browser is running.
You should really be designing your application such that knowing or bookmarking the URL won't help would-be cheaters. For instance: don't accept an answer to a question when an answer has been previously submitted.

If you don't have control of the computer the user is taking the test on, there's nothing you can do (and opening a full screen window won't prevent cheating for savvy users, either).
If you do have control over the computer or can instruct the user to install an application, you'd be best suited by building an actual application with embedded WebKit or Gecko.