Sometimes you need to check in Javascript if you're running on an Apple device (or some other specific hardware platform). You'd like to check that logic works via your dev machine, rather than needing the actual devices. Here's how to alter the hardware platform Firefox reports itself running on.

The Javascript code for the checking if you're on an Apple device is fairly simple and seems to be widely agreed upon:

/* returns true if the browser looks like it's an Apple iDevice. */
function isAppleGadget() {
    return (
        (navigator.platform.indexOf("iPhone") != -1) ||
        (navigator.platform.indexOf("iPod") != -1) ||
        (navigator.platform.indexOf("iPad") != -1)
    );
}

After which we can call isAppleGadget() elsewhere in our Javascript to do whatever specific stuff we need.

To check that conditional code is working, we should check the pages on an iPad to ensure that the right constructs are used for the right browsers. Sadly my budget doesn't stretch to lots of shiny devices. So, rather than having an actual iPad, I'll frig it and tell a browser on my dev box to pretend to be an iPad when visiting the relevant pages. I happened to be using Firefox at the time but Chrome, IE, etc may have similar config options.

In Firefox it's possible to create custom override strings for pretty much all of the internal browser config. The magic override we need to work with the Javascript above is general.platform.override, we can set this to the required pretend platform:

1. open Firefox
2. type about:config as the address, agree to the dire warnings
3. right click -> new string
4. property name = general.platform.override
5. property value = iPad

TADA! you are now an iPad

When you now browse to your platform specific page you should see the iPad specific code being used rather than your standard code.

After you're done pretending to be an iPad, go back to the about:config tab, right click the property override and hit reset.

Final Note

The underlying Apple related problem I was trying to solve with all this fiddling is that there used to be a problem with the way the iPad handled in-browser viewing of downloaded PDFs. Basically it screwed up the back button.

The fix was to detect that we're on an iOS device, add a target='_blank' onto every link to a PDF and every <form> which causes a PDF to be generated. This causes the iPad browser to open PDFs in a new window, which won't have any page to go "back" to. The user then has to close the PDF window, which leaves the underlying browser window still working correctly.

Previous Post Next Post