How to expand all child nodes in the Chrome Dev Tools Elements Panel

@zackster @ChromeDevTools Alt+<right arrow>, or Alt+<click expand> to expand recursively.

— Sam Li (@samdotli) February 29, 2016

Here is the chromium bug to expose this super useful feature via the UI

Firefox iOS: SecurityError: DOM Exception 18 with openDatabase()

Firefox has been relased for iOS as another Safari/Webkit wrapper, but it's currently unusable with Web SQL due to I think privacy settings.

Bugzilla Bug: SecurityError: DOM Exception 18: An attempt was made to break through the security policy of the user agent.

Here is a very simple test case

Of course you might say, why not just use indexedDB? Well due to it being broken in the initial release in IE6, I mean Safari and Apple's terrible old school, we only update our browser with the operating system approach, that's not practical without doing version sniffing and writing Web SQL to IndexedDb migration logic. fun fun!

Glyphicons showing up as Emoji in Safari

With the latest version of Safari 9 (iOS 9.1), I encountered a problem with Glyphicons (with bootstrap 3.3.5) showing up as Emoji.

It only happens intermittently when offline using an appcache.

Meanwhile, I also had Font Awesome Icons on the same page which were working fine.

I found a few Stack Overflow posts
How to prevent Unicode characters from rendering as emoji in HTML from JavaScript?
How to prevent Bootstrap's glyphicon rendering to emoji (Opera, FF)?

and a closed bootstrap bug
Bootstrap v3.1.1: Wrong glyphicons on iPad 

But none of them had any solution which worked, but then doing some further research, I then discovered that Bootstrap v4 is dropping Glyphicons

So, the solution I'm using is to get ready for Bootstrap v4 and just dump Glyphicons entirely

UPDATE: Turns out it was a PBKAC, I didn't have a .woff entry in the appache manifest, as glorious IE6 (Safari) doesn't support woff2 yet

Some notes about developing offline web apps with Chrome

I have been doing a fair bit of work developing offline support in web apps lately, I thought I'd share a few problems I've learnt along the way.

• Chrome's emulate offline mode doesn't trigger online/offline events
• If you have Virtual box installed, Chrome won't detect if you are offline
• Chrome's network throttling doesn't affect uploads
• The workflow for toggling offline mode in Chrome is painful, Firefox is much better and there is a nice extension Work Offline which gives you a toggle offline toolbar icon 

The above links are all (nearly all) bug reports, please star the issues if you care about them, please don't spam the bug reports with useless "I'd like to see this fixed" messages.

Hopefully this info might save you a bit of time

Safari - Web SQL - 14 unable to open database file [SOLVED]

Just a quick post, if you ever encounter "14 unable to open database file" in Safari, it's probably due to Safari apparently not properly Garbage Collecting db handles from openDatabase calls.

The solution is simply to re-use your database connections via a connection pool, as is common practice in many other application servers.

Apparently this got a bit better with Safari 8, Safari 7 was much worse.

I solved this myself after reading this issue https://github.com/pouchdb/pouchdb/issues/1068

Debugging web apps on iOS from Windows using Firefox's WebIDE

The WebIDE in Firefox Developer edition (Shift-F8) supports Remote Debugging of browsers on  iOS and Android devices all via a single interface.

Once you have connected, just select the tab you want to debug from the Open App drop down menu.

You might need to reboot after installing Firefox Developer Edition for the iOS link to work

Internally it uses Valance

Super useful, especially if you don't have a Mac handy

Is Pura Milk GMO Free?

Dear Zac,

Lion is committed to providing products of the highest possible standards in terms of quality and food safety.

Lion products are not Genetically Modified (GM) or derived from Genetically Modified ingredients, and we ensure complete compliance with National, State and Territory Food Stan

Lion will not accept milk which contains GM material.

Lion has an extensive QA program for its farm supply base, to ensure its milk supply is of the highest standards in terms of quality and food safety.

Scientific evidence establishes that GM material present in stock feed is not transferred to milk, because of the nature of the digestive system of the cow.  Even so, in recognition of some consumer concern, Lion recommends that farmer suppliers avoid GM feed for their cows.

Routine testing on finished product is carried out to verify that products are confirmed as GM free.

Lion is committed to complying with the Australian and New Zealand Foods Standards Code, and other applicable legislation in relation to products manufactured or sold outside of Australia or New Zealand. 

To that end, all products are labelled in accordance with the requirements of the Australian and New Zealand Food Standards Code.

I thought this might be useful information for those who are concerned about GMO foods.


Personally, having read this article below, I now regret previously financially supporting Greenpeace

The war against genetically modified organisms is full of fearmongering, errors, and fraud. Labeling them will not make you safer.

iinet port forwarding http, https not working? SOLUTION

If you are an iiNet customer trying to port forward a home web server, remember to first log into toolbox and turn off the port forwarding first.

It may take up to 15 minutes to take affect.

Hopefully this might save you some frustration trying to solve this problem

If you need to check if your port is open, http://canyouseeme.org/ is handy, as is GRC's ShieldsUP

Port Blocking

This facility allows you to enable or disable port blocking on your ADSL / Dialup / Naked DSL account.

The following can be toggled:

• Port 25 (smtp) inbound and outbound
• Port 80 (http) inbound
• Port 135 DCOM SCM inbound
• Port 139 (netbeui/ipx) inbound
• Port 443 (https) inbound
• Port 445 Microsoft Windows File sharing / NETBIOS inbound

These ports are commonly used for security exploits and denial of service attacks. If, however, you would like to disable port blocking on the above ports, you can do so by clicking the toggle button above. Note: Please be aware that it may take up to 15 minutes for your port blocking settings to take effect

BROKEN: Web apps launched from the iOS home screen always reload

Sadly mobile Safari has a sordid history of being broken in each new release, but mobile web apps have been broken for a very long time (since circa 2010).

It appears that if you save a web page using a manifest to the homepage, it doesn't really work. Each time you click the icon from the homepage or switch back to the application, the damn webpage is reloaded, which is fine for a simple webpage, but we are talking about Web Apps.

It would appear that at blame is iOS and it's faux multitasking.

There is a lot of stuff over on Stackover flow about this, i.e. Stop reloading of web app launched from iPhone Home Screen . Alas, no solutions but advice to persist your application state in localstorage (or you could risk indexeddb which is another sad Safari story) but that doesn't solve the underlying problem.

Meanwhile, Chrome on Android just works a treat, Web Apps don't reload when you switch or launch them.

My main frustration with Web Apps via Chrome on Android is that the Fullscreen API doesn't allow you to expose the browser chrome and thus settings from full screen mode.

This means it's even more complicated for users wanting to re-enable navigator.geolocation support after ignoring or denying the first and only prompt. Try walking your parents thru that over the phone...

Please prove me wrong or tell me the next iOS release addresses this issue?

How to get real line numbers in Chrome when using a wrapped console.log function

If you use a wrapped console.log function in your javascript, it's rather annoying that the console log entries always refer to the wrapping function rather than the relevant line in your source code.

Fortunately, Chrome has a workaround Tips and Tricks: Ignoring library code while debugging in Chrome (remember to open and close dev tools as described in the article)

There are a number of good reasons to wrap your console log calls, firstly handling old browsers which don't always have a console and secondly, keeping a buffer of console logs which can be included when capturing and reporting client side errors

While on the subject of client side errors, Tracekit is a useful library which provides stack traces for javascript errors