Discourse not loading on legacy browsers

Falco · March 23, 2022, 7:50pm

Just installed the deprecated fennec Firefox 68.9 on my phone, and it appears to be working now:

Any ideas what I’m missing while trying to reproduce the bug?

Ian_W · March 23, 2022, 11:19pm

Well, I’m not sure what to say. I just took a factory reset Android phone, (running 7.0 'cos it’s an old phone), downloaded Firefox Android 68.11 APK, installed and navigated to meta(.)discourse(.)org ** and get the prior screenshot.

Then it gets weird. Goto meta(.)discourse(.)org/t/ ** and I get:

"Oops! That page doesn’t exist or is private.

But then I get a list of “Popular” and “Recent” topics and can see this very topic.
Clicking on the topic, I new see the topic title, plus “bug”, “pri-high” but no content.

**: 2-link limited post
(also can’t seem to upload screenshots via UI, so had to upload by reply, one at a time)

Ian_W · March 23, 2022, 11:54pm

Ian_W · March 23, 2022, 11:54pm

Wake · March 24, 2022, 12:24pm

Watching just in case someone comes up with a solution for using discourse on an iPhone 6 before I end up buying a new phone.

tutibins · March 24, 2022, 8:34pm

I’m having the same issue, as explained below:

Falco · March 24, 2022, 10:41pm

For iOS < 13 or deprecated Firefox Fennec on Android, we should be showing the HTML view.

However, we are failing to do that because there is no HTML view due to

github.com

tgxworld/discourse/blob/master/app/helpers/application_helper.rb#L224

      
        
            
            
def mobile_view?
              MobileDetection.resolve_mobile_view!(request.user_agent,params,session)
            end
            
            
def crawler_layout?
              controller.try(:use_crawler_layout?)
            end
            
            
def include_crawler_content?
              crawler_layout? || !mobile_view?
            end
            
            
def mobile_device?
              MobileDetection.mobile_device?(request.user_agent)
            end
            
            
def customization_disabled?
              session[:disable_customization]
            end

which is in our code base since forever.

Including the crawler content so we can fallback to HTML view is expensive, so maybe we want to add old Safari to

github.com

discourse/discourse/blob/main/config/site_settings.yml#L1629

      
        
              default: "trident|webkit|gecko|chrome|safari|msie|opera|goanna|discourse"
              type: list
              list_type: compact
            crawler_user_agents:
              hidden: true
              default: "rss|bot|spider|crawler|facebook|archive|wayback|ping|monitor|lighthouse"
              type: list
              list_type: compact
            browser_update_user_agents:
              hidden: true
              default: "MSIE 6|MSIE 7|MSIE 8|MSIE 9|Xbox|PlayStation"
              type: list
              list_type: compact
            crawler_check_bypass_agents:
              hidden: true
              default: "cubot"
            cors_origins:
              default: ""
              type: list
              list_type: simple
            keep_old_ip_address_count:

so it’s done only when necessary?

The other alternative being telling Babel to transpile replaceAll / finding a good enough polyfill.

cc @sam @david @gerhard

sam · March 25, 2022, 12:34am

Other alternatives I can think of:

Eliminate browser_update_user_agents altogether, use an IE6 compliant XHR request to get the content for rendering on these browsers on mobile. (disable javascript is already bust on mobile anyway)
Polyfill replaceAll
Include crawler content unconditionally (on mobile as well)
Same as (1) but leave the setting as a micro optimisation, fallback to XHR.

I am swaying somewhere between (1) and (3), (4)

Falco · March 25, 2022, 12:41am

3 is something I’m afraid we will have to do eventuality, as the number of mobile devices abandoned by their manufacturers will only increase over time. It will increase some server load filling the template, and enlarge our HTML size on mobile but IMO we should do it.

So I’d say we do 3 and investigate if doing 1 and 2 is feasible.

sam · March 25, 2022, 12:44am

We could flip stuff on its head, only enable the mobile optimisation on specific browsers, will let us still have this optimisation on 95% of the mobile traffic that hits us and still be very safe?

Falco · March 25, 2022, 8:15pm

What about this @david

if (!String.prototype.replaceAll) {
	String.prototype.replaceAll = function(str, newStr){

		// If a regex pattern
		if (Object.prototype.toString.call(str).toLowerCase() === '[object regexp]') {
			return this.replace(str, newStr);
		}

		// If a string
		return this.split(str).join(newStr);

	};
}

I changed the string branch of the solution you shared, so it fixes converting Strings to Regex without escaping.

david · March 25, 2022, 8:31pm

I don’t think that will work when a function is passed as the second argument:

"my string with my example".replaceAll("my", (match) => `test${match}`)

(docs on the function can be found here)

PdxRick · March 28, 2022, 2:46pm

I am using an iPad Air with iOS version 12.5.5. The latest version of Chrome browser available for this tablet won’t load Sketchup forum. I get the same banner message mentioned in several of the previous posts. Is there any way to fix this issue other than upgrading to a new iPad?

david · March 28, 2022, 3:45pm

Sounds good to me

I think this should do it:

Falco · March 28, 2022, 6:24pm

Hmmm, while this fixes using Discourse on MacOS Mojave, it appears that iOS 12.5.5 also fail our globalThis check.

Do we want to polyfill that too?

Ian_W · March 28, 2022, 6:56pm

Yea! The site (both Discourse and Community.Jenkins.io) seem to be working OK again on the legacy browsers; I can see contents and can post (on Jenkins and here).

Most appreciated all the effort it took to resolve this; seemed much more involved than I expected.

Now, if I can only convince StackOverflow to revert their breaking changes (for a 2nd time) and restore functionality for legacy browsers. They did it once but their new attitude seems to be blame the user.

tutibins · March 28, 2022, 10:26pm

Yes, this forum is working again on iOS 12.2, though https://support.last.fm/ still isn’t (maybe they need to update something?)
Again thank you for your time fixing it

sam · March 28, 2022, 10:33pm

Keep in mind, our biggest focus is on not breaking old browsers. A blank page is simply not acceptable, not even on ancient browsers. A readonly view is acceptable.

The tricky thing that happened here is that we have some browsers that are in a twilight state, not exactly supported and not exactly not supported, sadly they got a white page treatment.

We are thinking of better approaches going forward to avoid regularly hitting these issues as our minimal browser version number creeps up.

Maddieman · March 29, 2022, 9:34am

Just to clarify, some of our users on https://support.last.fm/ are still reporting problems: Mobile view of this forum is broken - #6 by tutibins - Get Help - Last.fm Support Community

Has this fix been deployed to hosted sites yet?

If so, that would suggest a theme/component we’re using or our custom css is breaking it, but I don’t want to fiddle with that stuff if the fix hasn’t deployed yet.

Thanks again for looking into this.

david · March 29, 2022, 10:01am

Hi Jon - this change hasn’t been deployed out to all our hosted sites yet. But I’ll get that process started now - it should hit your site in the next hour or so.