My Android tablet was not detected as a mobile device


#1

Hi, I noticed that on my 7" Android tablet, using the stock Android browser and also on mobile Firefox, the portrait version of topics with wide images aren’t scaling correctly, making it necessary to horizontally scroll. Here are a few examples:

Any suggestions? Thanks a lot.


(Jeff Atwood) #2

We only support the native browser, and per our FAQ, only Android 4.1 or greater where Google Chrome is the default, native browser. Can you repro in Chrome?


(Jeff Atwood) #3

Also I checked on my nexus 7 with latest updates and it seems fine in chrome…


#4

Thanks @codinghorror for looking into this.

It’s strange, I tried it on Chrome as well, but it definitely does not scale correctly:

Notice how the picture of the tablet in the review is chopped off. (Sorry about poor quality literal screenshot, real screenshots don’t work on my tablet and my good camera is broken atm.) By the way, it’s running Android 4.4.2.


(Jeff Atwood) #5

I do not think that device is getting mobile layout. Try switching to mobile layout via hamburger menu at upper right.


#6

–There’s a “Request desktop site” option in Chrome (and in Firefox) but it’s not checked.
Ah, the Discourse hamburger menu. I’ll be darned, there is an option, and that fixes it.

So now, the question is: Why doesn’t this device get detected as a mobile device?


(Jeff Atwood) #7

I think we only detect the Nexus 7, because there are such a wide range of Android tablet devices, it’s unclear what the User-Agent would be that can cover all those tablets reliably.


#8

Weird, I thought the user agent for mobile browsers was labeled as such. But for my tablet at whatsmyuseragent.com I’m just seeing “Mozilla/5.0 (Linux; Android 4.4.2; U25GT-C4WB Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.96 Safari/5.37.36”. Quite ambiguous.

I’m not a developer, but would it be possible to:

  1. Check for the presence of the word “Android” in the user agent and always offer the mobile version if present? It’s a pretty safe bet that most Android users are on a smaller screen.
  2. Check the browser window size and offer the mobile version by default below certain parameters. The above mentioned whatsmyuseragent.com was able to correctly detect my screen resolution and browser window size.

Come to think of it, Discourse does seem to be able to somehow detect what is not a mobile browser, because on my desktop Firefox browser the Discourse hamburger menu does not even give me the option of using the mobile version.


(Ben T) #9

It looks like the regex listed here should be applied here. Tablet chrome won’t include “Mobile” as a part of the user agent string; causing this check to fail.

(currently, this checks if the useragent contains “Mobile,” “webOS”, “Nexus 7” or does not contain “iPad”)

The ability to toggle mobile mode on and off seems to be determined here, but I’m not as sure on that one.

I’m not infront of something to test with for a little while, but I believe something like

/iphone|ipad|ipod|(Android.*Chrome\/[.0-9]* (!?Mobile))/

might cover these cases better.


(Matt Terry) #10

Wouldn’t you want a responsive desktop style to catch all these anyway?


(Ben T) #12

Seems sensible now; from past discussion it seemed easier to focus on two themes.
https://meta.discourse.org/t/responsive-mobile-optimization-vs-device-detection/9831/9?source_topic_id=26734


#13

Incidentally, it looks like Android KitKat 4.4 doesn’t come with Chrome by default anymore, according to:
http://blog.cloudfour.com/why-chrome-not-shipping-with-android-4-4-might-not-be-a-bad-thing/

My 4.4 tablet comes with a browser that renders the Discourse mobile version just as well as Chrome does once it’s enabled from the hamburger menu. Here’s the user agent:
Mozilla/5.0 (Linux; Android 4.4.2; U25GT-C4WB Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/30.0.0.0 Safari/537.36


(Matt Terry) #14

Yeah the current approach seems sensible in that respect. I’ve just spent the last week theming a discourse site and was kinda confused why the mobile theme was totally separate. I ended up pulling in a few parts of the mobile templates to make a narrow desktop breakpoint, but it’s not ideal.


(Jeff Atwood) #15