Simulate Offline Mode for HTML5 Cache Testing - firefox

I have an HTML5 application that requires offline support. For running the application, I use a local Apache server. I am trying to figure out what the best way is to simulate offline mode.
Currently, in Firefox I disable my Air-Port to simulate offline mode, but this is a pain.
Any suggestions? I am open to using other browsers, if a method exists that doesn't require turning off my Internet.

For Firefox
☰ (hamburger menu)->More->Work Offline
Google Chrome doesn't appear to have this feature
Edit:
Also, another alternative is slightly more time-consuming to setup in the beginning but might be worth it. For Firefox/Chrome there should be proxy plugins, set up a fake/bad profile for each so that you proxy to something that doesn't exist... like 127.0.0.20:8080. After that you can switch the proxy setting on and off to emulate a full-stack test.

The other answers are out of date. The only place this appears in Firefox v92 is under
File > Work Offline
The File menu can be accessed in the top left of Firefox by pressing the ALT key.
Be warned that this does not prevent traffic from "localhost" loop-back itself, unless you additionally turn on
network.disable-localhost-when-offline
preference in about:config.
Bugzilla issue: Add option to disallow connections to localhost while in offline mode.

In Chrome you can open developer tools switch to the network tab and set throttling to offline

For Firefox, from the ☰ (hamburger menu), choose Web Developer > Work Offline.
For Chrome, open DevTools and select the Network panel. Throttling is set to Online (Disabled) by default. From the dropdown menu, you can choose presets Fast 3G and Slow 3G, but to simulate Offline Mode, you want to choose Offline.

Related

WebAuthn on Chrome on Windows: Skip Windows dialog in favor of Chrome dialog

In developing our passkey integration I'm encountering unusual behavior in Chrome on Windows.
On my PC, when I register a new physical key I see this Windows dialog.
When I enable the virtual authenticator environment in the Chrome Dev Tools I get this Chrome dialog instead.
However, someone testing the application for me on another PC, without using the virtual authenticator environment, gets the Windows dialog first. If they click Cancel in the Windows dialog, then they get the Chrome dialog.
Is there anything I can do to nudge the browser towards delivering a more consistent experience? I'd rather always show the Chrome dialog if possible.
For reference, this is the virtual authenticator environment in the Chrome Dev Tools:
The problem is that lots of enterprise users have to use a physical security key one or more times a day. So there's a strong desire not to put extra clicks in their way and thus to jump directly to the Windows system UI. But the Windows UI doesn't support using phones as authenticators, so sometimes the browser UI is needed as hitting escape is quite non-discoverable.
Quite how that balance is struck has varied over time and might change again in the future. You can see the current logic here if you want to craft requests that trigger the browser UI. But the intent is that sites should do the obvious thing and the UI should be fairly reasonable.

How do I deactivate the internet entirely with Firefox's developer tools?

I'm developing in Firefox and was asked today to test connectivity drops. How do I simulate this from the developer tools? All I can see in the network tab is speed throttling, ranging from GPRS to WiFi. How do I disable the internet entirely?
(I can't just turn the laptop's Wi-Fi off, I want the DB GUI up in a separate window.)
I noticed that accoring to this answer, Chrome has this feature, but I don't use Chrome.
This is not available in Firefox devtools. You can follow this bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1029203
In the meantime, you can use "Work Offline" in the File menu. On Windows, press Alt to show the menu bar: https://support.mozilla.org/en-US/kb/restore-menu-bar-firefox#firefox:win11:fx108

Bash script to set Chrome as default for projects only?

Anyone know a way to set up Google Chrome so we can open development servers on? Instead of setting it as the general default browser?
In other words, I don't want my development servers to open up on Safari (that's what I have at the moment) each time I run my local development server, but I don't know how not to do that unless I switch Chrome to be my default browser (which I don't want it to be my default). Is there a way I can write in my .bash_profile to do this (automate the process of only opening Chrome for development purposes)?

Firefox Dev tools: How to persist calls in network analysis

Since Firebug is outdated with a recent update of Firefox I'm trying to work with the Firefox dev tools. As far as I read these are supposed to replace Firebug.
However there is one option I used frequently in Firebug and haven't found yet in the Dev tools: The persist option in the network analysis.
Since I work on a project that uses AJAX Calls to send data and then redirect to another page, I need to persist the calls to analyze them after the redirect. Otherwise the time is far to short to have a look at the data that was send with this call. (This project is for work so this architecture is nothing I could change).
Is there a way to persist the network calls in the Firefox Dev tools?
(I use Firefox 56.0.1 by the way)
Open the Settings for the Developer Tools:
Then select "Enable persistent logs" under "Common Preferences."
Reference: https://developer.mozilla.org/en-US/docs/Tools/Settings
Starting from Firefox 57.0 the option got moved from the Settings to the Network panel:
On Firefox for Mac, in version 101.0.1, the "Persist Logs" option is now hidden behind the gear icon in the top right of dev tools box.

Is it possible to set proxy settings in a Safari Extension?

As Apple introduce extension support in Safari 5, I want to make an extension that manage proxy settings directly in the browser (like AutoProxy for Firefox or Proxy Switchy for Chrome).
I skimmed the source code of Proxy Switchy. It is mainly written in Javascript/HTML, but uses an external binary bundle to do proxy switching. Is this scheme doable in Safari extension? If not, is there other way to manage proxy settings in the extension?
I am having exactly same question although it is almost 2016 already and I am using Safari 9.0.2. It seems that Apple does not provide such an API for defining browser-specific proxy in extensions as Google does for Chrome. So I guess one would have to deal with system-wide proxy settings, that is to find solutions for setting up app-specific proxy.
(this the the link, not advertising) http://www.techrepublic.com/forum/questions/101-226884
https://apple.stackexchange.com/questions/18370/why-isnt-my-auto-proxy-setting-working-for-safari-5-1-in-lion
(answer from techrepublic and apple.stackexchange it's not advertising)
I think they say you can
Actually the easiest way is to use Apple's concept of 'Location'. In the Apple Menu, choose Location > Network Preferences ...
Most likely your current location is set as 'Automatic'. Choose "Edit Locations ..." in the selection menu, and add additional Proxy Locations. For each Location you can setup different proxy settings, which you can switch directly from the apple menu. Just make sure you edit the correct Network Interface on which you want to apply the proxy settings (if you are connected through LAN, but you set the proxy only on Wifi - it wouldn't work).
The Proxy Settings are under the [Advanced ...] button [proxies] tab. Enable and modify the proxies as you need.
Make sure that your Safari browser - or any browser you will be using - is set to use the "System Proxy Settings" ... and not it's own override. Safari always links back to the System Network Settings.
After considering this - would we still need a plugin doing essentially the same?
Yes it is possible to set proxy setting in safari. Please follow below steps.
1.) Open Safari if it is not already open.
2.) Choose Safari > Preferences, and then click Advanced.
3.) Click Change Settings.
The Network pane of System Preferences opens.
Use the information you got from your network administrator to change the proxy settings.
Click OK.

Resources