How to prevent Chrome from refreshing page when viewing source?

Question

When viewing page source in Google Chrome, the browser opens a new tab and basically pastes the URL in with the view-source: prefix. This is undesirable.

As a developer, I may include some diagnostic output that is only visible in the source after submitting a form. When Chrome Refreshes the page to view the source, it makes this information disappear.

Is there anyway to prevent this behavior?

Note: I'm familiar with the "Inspect Element" option. This is just not an adequate stand-in for viewing the raw page source of the exact page you're looking at.

---

A quick test script

<pre>
  <?= print_r($_POST, true) ?>
</pre>
<form action="" method="post">
  <input id="foo" name="foo" value="bar" />
  <input type="submit" />
</form>

After clicking the submit button, the page shows

Array
(
    [foo] => bar
)

If you view page source, you will see an empty $_POST output

<pre>
Array
(
)
</pre>
<form action="" method="post"> 
  <input id="foo" name="foo" value="bar" /> 
  <input type="submit" /> 
</form> 

---

Update

Apparently this bug has already been submitted. Sigh...

If anyone knows of a good work around, I'd greatly appreciate it.

Solution 1

From the bug report page, the workaround mentioned in comment 12 works: In the Developer Tools, enable Resource Tracking. (If it was off, enabling it will resubmit the request that generated the currently visible page, either POST or GET.) In the list of Resources, you can click on the main page to see the source code as it was returned by sever the for both POST and GET requests.

More information

I ran some tests using a simple php file that showed the request method used and a POSTed value, a proxy server log to see which requests Chrome was making, and the chrome://net-internals/view-cache/ prefix to see what Chrome was caching.

When you use the View Source command, Chrome shows the source of its cached version of the page, and it only caches pages requested via the GET method.

If you're looking at a page that you've previously requested using GET and POST, then only the GET version is cached. Using the View Source command won't re-request the page, but will show the cached GET version, not the currently visible POST version, if any.

If you're looking at a page that you've only requested using the POST method, then using the View Source command will cause Chrome to look in its cache, find nothing, request the page using GET, cache it, and show the source of that.

Solution 2

Good question - and somewhat disappointing to read all those "this is wrong" or "this won't work" comments. This behavior makes the "View page source" feature useless for development in many cases.

There's an extension called "Quick source viewer", which appears to actually show the source of the currently loaded page (I haven't tested it with POST requests though).

Comments

[macek]

TomWij, "this is against the current nature of browsing and debugging in a browser..." this is just plain inaccurate. Current versions of Firefox and Safari both behave as "expected". In fact, because I've used these features in other browsers, I've come to expect them in Chrome. Keeping a couple KB of plain text for the original source in memory should be no difficulty.

[Tamara Wijsman]

Google Chrome is known for its minimalism. ;-)

[Tamara Wijsman]

It's accurate, why keep comments or old code if your HTML code changes?

[Tamara Wijsman]

Nice discovery!

[Gerald]

I don't know why the previous downvote came, but mine was because you didn't make any attempt to answer the question asked.

[Tamara Wijsman]

@TRiG: At the cost of keeping things in memory, which on the first time also requires you to do a refresh; and yes, it does answer the question, because the options do not require page refreshes. I still prefer to run Fiddler or some other tool than to increase the already high memory usage. Since there was no previous downvote, I guess it was yours only... :)

[Gerald]

My downvote came just now. Your comment asking why the downvote? is from three years ago.

[Chris]

This is demonstrably false. In Chrome you can save the original source of the page (Save page as) without doing a second request. This is what should be displayed when I "View Source". The current implementation is highly undesirable. For example when viewing the result of a POST. View source currently does a GET to the same location, showing an entirely different page. View source should always show the state of the page at the current request, NOT a future request.

[Tamara Wijsman]

Yes, but that is obtained from the cache; not from memory.

[Chris]

No doubt, and that is where View Source should read from also. A new request is simply misleading and wrong.

[Jon z]

Old question but I just came across it. View Source is an old hammer and it is not the right tool for the job anymore. Why do you need to see this information in a new browser tab? The proper way to do this in the current era when we have robust resource tracking in dev tools is to find the request in the network history of the current tab and examine it there.

[Jon z]

Chrome has changed a lot since this answer but it's basically the same: open dev tools, ensure that network traffic is recorded and find the request that was logged in the Network tab. In the case of redirected requests you can check "Preserve log" or "preverse log upon navigation" to not erase the log with each new sync request.

[Tamara Wijsman]

Did you mean to reply to the question? I'm not suggesting view source; in fact, I'm agreeing with you in the very first sentence of my answer.

[Chris]

@Jonz Are you arguing to remove the View Source function altogether? I'd support this if the only alternative is the current broken implementation. But why can't we have both? Clicking through the network logs in the dev toolbar is a great option to have when you need that level of information, but if you just want to see the source for the current page it seems overkill.

[Jon z]

@Chris I'm saying that (when dev-tools are closed) the browser has no need to retain the document source. The implementation you're asking for would require for every tab to remember its source, just in case the user decides to view it. A world class browser will save memory every chance it gets, so of course Chrome will make a new request (which may or may not be cached according to the rules of HTTP) rather than storing extra data per tab that will most likely not be used. If you're debugging the site and want to trade performances/resources for tooling, then use the dev tools.

[Abhishek Madhani]

@Jonz after realising this folly I am already disliking Google Chrome. For e.g. I needed to check the page source of Thank you page of E-commerce website (page loaded after user makes a successfull payment, for checking the firing of GTM code). Now on load of the page, I simply unset the necessary session and again on reload if the session is not found, I redirect the user to home page. So if I try to use Google Chrome hack, I am never able to view the page source, because it can only resend the GET and POST request, but it can't reset the session. Hence I would suggest use "Inspect Element"

[Jon z]

@Chris it looks like you get your wish, I'm currently using Chrome Canary 37 and, according to Charles proxy, in this build a new network request is not sent to the server when you view the page source (with or without dev tools open in the original tab).

[Jon z]

@AbhishekMadhani I'm not sure that you meant to reply to me, but I'll repeat what I wrote in a comment below - it seems that, as of Chrome Canary 37, a new network request is not sent when you view the source.

[Dan]

It's worth noting that the current behavior is actually quite useful for viewing the source of quick-redirect pages. Simply prepend view-source: to the url manually. That said, there are a million other ways to do this (e.g. curl) and this doesn't outweigh the benefits of view source acting as proposed by the OP.