924386 - Firefox (desktop and mobile) doesn't show posted images on mobile twitter profiles - empty profile-media-container

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect)

Description

[Paul [pwd]]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:27.0) Gecko/20100101 Firefox/27.0 (Beta/Release)
Build ID: 20130923060712

Steps to reproduce:

Fennec doesn't show the image row on mobile twitter profiles. Opera manages just fine.

Comment 1

[Paul [pwd]]

This has been a long standing issue, so it may be an evangelism issue as opposed to a bug.

Confirmed on RTM and Nightly.

Comment 2

[Aaron Train [:aaronmt]]

I see the same thing on desktop, visit https://mobile.twitter.com/trutherbot on desktop and you'll see it's missing.

Their profile media-container seems to be an empty div

<div class="profile-content">
    <div class="module profile-media-container" style="display: block;"></div>
    <div class="profile-tweets-container"></div>

</div>

Inspecting, I'd say this is an issue with the media_timeline API 

https://mobile.twitter.com/api/media_timeline


One would have to examine and compare the JSON objects returned and the difference between Firefox and Chrome in that regard.

Comment 3

[Lawrence Mandel [:lmandel] (use needinfo)]

Strangely, this works as expected on Firefox OS. Looks like a Fennec specific issue.

Comment 4

[Mike Taylor [:miketaylr]]

Oddly enough, I get different mobile.twitter.com experiences in Chrome, Safari, Opera (blink) and Opera (presto): http://i.imgur.com/qlNmCix.png 

Changing the UA string in nightly to iOS 6 or Safari desktop gets us the same version as the others (which doesn't show the media section AFAICT), so perhaps we should figure out why we aren't getting that version.

Comment 5

[Lawrence Mandel [:lmandel] (use needinfo)]

On Android I get the same Twitter site in Firefox, Chrome and Android Stock.

Comment 6

[Hallvord R. M. Steen [:hallvors]]

Presumably (not guaranteed..) relevant JS:

getMediaStripContainer:function(){var d=this.getProfileContent();return d&&a.get(".profile-media-container",d)},showMediaStrip:function(){if(!a.ENV.displayInlineMediaInterstitial()){var d=
this.getUserId();d&&a.getWidget("MediaStrip",{context:this,ready:function(b){f.getMedia({uid:d},{context:this,success:function(c){var c=c&&c.tweets,e;if(c&&(c.length&&this.isViewingUser(c[0].user))&&(c={items:c,url:"/"+encodeURIComponent(d)+"/media/grid"},e=this.getMediaStripContainer()))b.willRenderEmpty(c)?a.removeElement(e):(e.innerHTML="",a.setStyle(e,"display","block"),this.mediaStrip=new b({stream:c,view:this,container:e,isRTL:a.ENV.IS_RTL}))}})}})}},


displayInlineMediaInterstitial:function(){return this.isZeroRated()&&this.CARRIER.display_flags.inline_media_interstitial&&!this.isPromptDismissed(h.ACCEPT_MEDIA)},

I know displayInlineMediaInterstitial() runs, presumably from the code above. To be continued..

Comment 7

[Hallvord R. M. Steen [:hallvors]]

Hey Twitter! "Emulating" element.parentElement here:

g.Browser.Gecko&&(d.HTMLElement.prototype.__defineGetter__("parentElement",
function(){
			return this.parentNode
		})

is a) not necessary when there's built-in support and b) buggy. The parentNode and parentElement properties are subtly different. For example, if b is a DIV inside a DocumentFragment node and your getXY() method tries to do

for(f=b.parentElement;f&&f!==c;){
	if("none"!==a.getStyle(f,"transform")){ 
		d=a.getCurrentTransform(f);

the broken parentElement getter means you end up trying to read styles from a DocumentFragment, and that doesn't make much sense to any web rendering engine.

Comment 8

[Hallvord R. M. Steen [:hallvors]]

(With that fixed, the element appears - but for some odd reason below the list of tweets, not above?!?)

Comment 9

[Paul [pwd]]

Any news on this?

Comment 10

[Karl Dubost💡 :karlcow]

Paul,

The bug is still [contactready], which means: nobody has contacted them yet. If you beat one of us to it, that would be cool. 

When the site has been contacted, we switched it to [sitewait].

Comment 11

[Adam Stevenson [:adamopenweb]]

Looks OK on my devices. Can anyone confirm the issue still exists?

Comment 12

[Paul [pwd]]

You can't do a WFM when Firefox for Android isn't even being served the page that features thumbnails and Opera continues to be.

Comment 13

[Paul [pwd]]

Can someone set this back to NEW please?

Comment 14

[Hallvord R. M. Steen [:hallvors]]

If I load mobile.twitter.com/trutherbot in Fx on Android, I have to scroll down one screen to see the MediaStrip, but it is there. Paul, what exactly do you see when you're missing this feature, and what URL do you load Twitter from?

Minor note: I would prefer keeping bugs specific and to the point - so if we identified one specific problem in this bug, it was fixed, and this bug got closed, I'd rather follow up with a new bug to cover that Firefox is sent to a different site due to sniffing, or that the MediaStrip isn't where other browsers render it, or whatever other problems we have..

Comment 15

[Paul [pwd]]

(In reply to Hallvord R. M. Steen from comment #14)
> If I load mobile.twitter.com/trutherbot in Fx on Android, I have to scroll
> down one screen to see the MediaStrip, but it is there. Paul, what exactly
> do you see when you're missing this feature, and what URL do you load
> Twitter from?
I'm not seeing the media strip with the latest nightly. I've removed ABP and I'm still not seeing it.

> Minor note: I would prefer keeping bugs specific and to the point - so if we
> identified one specific problem in this bug, it was fixed, and this bug got
> closed, I'd rather follow up with a new bug to cover that Firefox is sent to
> a different site due to sniffing, or that the MediaStrip isn't where other
> browsers render it, or whatever other problems we have..
With all due respect, I filed the bug for the media strip not showing. It's still not showing, there's no scope creep here.

Comment 16

[Paul [pwd]]

Just to add more info, I'm seeing no media strip in a normal session, a private tab nor a guest session.

HTC One (M7) running CyanogenMod 11 Nightly (Android 4.4.2)

Comment 18

[Aaron Train [:aaronmt]]

Do we know why this works in Firefox 27 for Android, and not in 28+?

Comment 19

[Hallvord R. M. Steen [:hallvors]]

I see this problem too, in Fx 28. 

This code (in inline JavaScript, from onRequestSuccess handler that processes the response to /api/media_timeline XHR requests) doesn't expect arrays to have an "entries" method:

 e.entries ? (j = "entries", i = e.entries) : e.modules ? (j =
                        "modules", i = e.modules) : a.isArray(e) ? (i = e, e = {
                        tweets: i
                    }) : i = e.tweets;

(It looks for e.entries as a way to distinguish input like {"entries":[{},{}]} from input like [{},{}] I guess). 

So implementing an Array.prototype.entries method has broken Twitter's MediaStrip.

Comment 20

[Hallvord R. M. Steen [:hallvors]]

This can be fixed quite easily if Twitter replaces 

e.entries ? (j = "entries", i = e.entries) 

with 

e.hasOwnProperty('entries') ? (j = "entries", i = e.entries) 

..assuming of course that won't break the use cases for this code. Unlikely to break anything, since this code runs on newly parsed JSON without any fancy prototypal inheritance and such.

Comment 21

[Hallvord R. M. Steen [:hallvors]]

(and bug 894658 is where this new method comes from)

Comment 22

[Karl Dubost💡 :karlcow]

Contacted twitter.

Comment 23

[Jan Manthay]

Works since today with android beta

Comment 24

[Karl Dubost💡 :karlcow]

Cool. I will switched that to Fix. It is working also in Firefox Aurora Desktop (32).
Thanks everyone.