Basecamp renders a desktop site for Firefox OS

RESOLVED FIXED

Status

RESOLVED FIXED
7 years ago
4 years ago

People

(Reporter: jsmith, Assigned: karlcow, Mentored)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [gecko] [topapps] [website-compatibility][sitewait][serversniff] [webkitcss], URL)

Attachments

(7 attachments)

(Reporter)

Description

7 years ago
Created attachment 603878 [details]
Webkit Basecamp Site

Steps:

1. Go to https://launchpad.37signals.com/basecamp/signin
2. Login with an account with a project pre-created in basecamp (if you need a test account, ping me on IRC for one)

Expected:

A mobile site that is app-like should render (see example screenshot attached).

Actual:

A desktop site renders instead for fennec native.
(Reporter)

Updated

7 years ago
Whiteboard: [gecko] [topapps] [website-compatibility]
Jason, have you tried to log to this Web site faking the UA for an Android or iOS browser?

Does the Web site work then in Firefox for Mobile (native)? 

(We need that information to reach them with as much information as possible)
(Reporter)

Comment 2

7 years ago
Created attachment 604125 [details]
Basecamp IPhone UA on Fennec Native
(Reporter)

Comment 3

7 years ago
Just tested on Fennec Native with UA faked to the IPhone. The site does not work on Fennec Native with the UA faked (see attached screenshot).
(Reporter)

Updated

7 years ago
Depends on: 739832
(Reporter)

Comment 4

7 years ago
Note: The mobile-based app for basecamp that runs on a webkit-based UA has webkit-specific prefixes with no correlating moz-prefixes. Examples prefixes seen are:

-webkit-transform: translate3d(0,0,0);
-webkit-font-smoothing: antialiased;
-webkit-transform: none !important;
-webkit-text-size-adjust: none;
-webkit-background-size: 140px 114px;
-webkit-transform: none !important;
-webkit-background-size: 684px 57px;
-webkit-transition: opacity 150ms ease-in 150ms;

    /* LESS.CSS can't parse @-wekit-keyframes so this has to go here */
    @-webkit-keyframes loading-highlight {
      from {background-position: -300px 0;}
      to {background-position: 300px 0;}
    }

    @-webkit-keyframes highlight {
      from {background-color: #ff3;}
      to {background-color: #fff;}
    }

-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
      -webkit-border-radius: 6px;
      -webkit-box-shadow: 1px 1px 1px #fff;

-webkit-gradient(linear, left top, left bottom, color-stop(0, #aaa), color-stop(0.4, #ccc))
(Reporter)

Comment 5

7 years ago
Another way at looking at the CSS-prefixes in comment 4:

Webkit-only Feature Only

* -webkit-font-smoothing

Moz & Webkit Supported

* -webkit-transform (equilvalent: -moz-transform)
* -webkit-text-size-adjust (equilvalent: -moz-text-size-adjust)
* -webkit-background-size (equilvalent: -background-size)
* -webkit-transition (equilvalent: -moz-transition)
* -webkit-keyframes (equilvalent: -moz-keyframes)
* -webkit-gradient (equilvalent: -moz-linear-gradient)
* -webkit-border-radius (equilvalent: -border-radius)
* -webkit-border-shadow (equilvalent: -box-shadow)
(Reporter)

Comment 6

7 years ago
> Webkit-only Feature Only
> 
> * -webkit-font-smoothing
> 
Update on this - gecko's equilvalent is non-standard (font-smooth)
(Reporter)

Updated

7 years ago
No longer depends on: 739832
(Reporter)

Updated

6 years ago
Component: Evangelism → Mobile
Product: Firefox for Android → Tech Evangelism
Version: Firefox 12 → unspecified
Created attachment 8337752 [details]
fx25.png

Screenshot in Firefox for Android 25.
Whiteboard: [gecko] [topapps] [website-compatibility] → [gecko] [topapps] [website-compatibility][contactready][serversniff]
Whiteboard: [gecko] [topapps] [website-compatibility][contactready][serversniff] → [gecko] [topapps] [website-compatibility][contactready][serversniff][mentor=astevenson]
(Assignee)

Updated

4 years ago
Whiteboard: [gecko] [topapps] [website-compatibility][contactready][serversniff][mentor=astevenson] → [gecko] [topapps] [website-compatibility][contactready][serversniff][mentor=astevenson] [webkitcss]
(Assignee)

Comment 9

4 years ago
commentform
Contacted their site support internally.
Assignee: nobody → kdubost
Status: NEW → ASSIGNED
Summary: Basecamp renders a desktop site for fennec, where as in stock browser, a mobile-optimized app is rendered → Basecamp renders a desktop site for Firefox OS and Firefox Android, where as in stock browser, a mobile-optimized app is rendered
Whiteboard: [gecko] [topapps] [website-compatibility][contactready][serversniff][mentor=astevenson] [webkitcss] → [gecko] [topapps] [website-compatibility][sitewait][serversniff][mentor=astevenson] [webkitcss]
(Assignee)

Comment 10

4 years ago
I got an answer saying that they do not support Firefox OS. Though they do not have to support anything. :)


So currently Firefox Android is receiving the phone-blah.css. The site is working without big issues.

On the other hand, the user agent sniffing on Firefox OS is still wrong. We just need them to send the same experience to Firefox OS (than the one Firefox Android) is receiving.

Sending a reply to them.
(Assignee)

Comment 11

4 years ago
Created attachment 8427757 [details]
firefox-android-basecamp.png

What basecamp looks like currently in Firefox Android.
(Assignee)

Comment 12

4 years ago
Status:

I think there is the usual problem of communications in between user support and developers, with misunderstandings in between. After a series of mail exchanges with user support, their final answer is:

> I'm sorry, but that is the reply that I got back from our programmers. We're not able to add this in right now, but will keep it in mind for a future update. 


The bug has evolved too. Right now it seems that Firefox on Android receives an acceptable version. My last screenshot. But Firefox OS receives the desktop site. Could someone confirm?
https://bugzilla.mozilla.org/attachment.cgi?id=8427757
(Assignee)

Updated

4 years ago
OS: Android → Gonk (Firefox OS)
Summary: Basecamp renders a desktop site for Firefox OS and Firefox Android, where as in stock browser, a mobile-optimized app is rendered → Basecamp renders a desktop site for Firefox OS
Created attachment 8430101 [details]
2014-05-28 15.28.59.png

Karl, yep. Get a nice mobile version in Firefox for Android that seems to be working well.

Updated

4 years ago
Mentor: astevenson
Whiteboard: [gecko] [topapps] [website-compatibility][sitewait][serversniff][mentor=astevenson] [webkitcss] → [gecko] [topapps] [website-compatibility][sitewait][serversniff] [webkitcss]
(Assignee)

Comment 14

4 years ago
contactform
Created attachment 8547229 [details]
basecamp-renderings.jpg

OK I tried again. Let's see if they have a better understanding.
New ticket open.

========
Hi,

This is a question for engineers in charge of the user agent detection at Basecamp. There's no front-end dev required, just server side filtering.


We (Mozilla) would like to receive a better User Agent detection than the current one on mobile. 

* Firefox for Android (smartphone) is receiving a perfectly working version of the mobile site.
  User-Agent: Mozilla/5.0 (Android; Mobile; rv:36.0) Gecko/36.0 Firefox/36.0

* Firefox OS (smartphone) is receiving the **desktop** version (instead of mobile). 
  User-Agent: Mozilla/5.0 (Mobile; rv:36.0) Gecko/36.0 Firefox/36.0

Both are using exactly the same rendering engine (same browsers) with the same capabilities. There should be no difference at all. The difference is probably due to an ill-defined User Agent detection, and easy to fix.

Could we receive the mobile version for Firefox OS?


Best Regards.
==========
(Assignee)

Comment 15

4 years ago
Received an answer ack.

===
Hi Karl! 

Thanks for taking the time to write in! Hope you are having a great Monday!

Our programmers are taking a look at this today. Either they or I will be in contact with you once more information is available. 

If you have any other questions, please reply to this email and I'll be happy to help!

Cheers!
*** ***
Basecamp Customer Support
===
(Assignee)

Comment 16

4 years ago
My second contact was a hit and match!
Firefox OS is receiving the mobile version. Trumpets!

===

Hi Karl! 

We've deployed the rest of the fixes today. 

Cheers!
- ****

===


http://twitter.com/MozWebCompat/status/555079617036304384

Tested.
Status: ASSIGNED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.