Search code examples
google-chromesafariwebkitdevelopment-environment

When safari or Chrome loads localhost, it shows a small load time indicator


I noticed recently that when using Chrome or Safari for developing, I see this little indicator in the upper-left of the screen that shows me the load time of the page. If I click on it will change positions I think, and disclose a larger panel showing more info about the page load.

I feel a little silly but I don't know what this is -- it isn't an extension AFAIK (I disabled all extension), it happens in BOTH Safari and Chrome, and it only happens when developing on 127.0.0.1 or localhost

SO.. my question is, can I 1) disable it, or 2) move it to another corner on the window?

It's a patently straightforward usecase: All I want to do is take a screenshot of the "Hello World" that is below the indicator, but it is covered up.

I don't remember seeing this until recently I am assuming it is something I just never noticed or something new in Webkit

enter image description here

enter image description here

UPDATE 2021-03-13

  1. Does it let you inspect it in developer tools, perhaps by using mouseover selection? Its attributes and CSS classes might give you something specific to search for.

Yes I can inspect it. it seems to be on my page. I wonder is this from Ruby on Rails? huh?

it looks like so:

enter image description here

  1. Does it happen in Firefox? If so, it's probably not a browser thing, but a server thing.

Yes! Another good call my friend. So, not webkit or browser you're right.

  1. What http server are you using? Could it be adding the thing automatically?

It must be something new in Ruby on Rails that I never noticed before. I will confirm and post here again.


Solution

  • What you're looking at is called https://github.com/MiniProfiler/rack-mini-profiler and can be enabled and disabled at will using Alt+P.

    You can verify this by clicking an entry and clicking more. At least on the version I am using, it will report that you are looking at rack-mini-profiler, like so:

    rack-mini-profiler more/help menu