Jump to content

Instagram videos not working in Firefox 52 ESR?

Dave-H
 Share

Recommended Posts

Mathwiz

Mathwiz

Posted
Posted

@mixit might be able to fix it; the thing is, it's now clear that Instagram will eventually change something else and break it again. Instagram users need something more permanent.

Besides Serpent 52 and New Moon 28 (and probably Chrome), Mozilla's recently-finalized SeaMonkey 2.49.5 is known to work with Instagram on XP, so evidently, Mozilla eventually figured it out; but as you may have read on the @roytam1 browser thread, SeaMonkey requires either Adobe Primetime or some minor "surgery" to play .mp4 videos on XP. (Roytam has already performed the needed surgery on Serpent and New Moon.)

Link to comment
Share on other sites

siria

siria

Posted
Posted

Luckily even on oldest systems instagram videos are still watchable outside the browser, by opening directly the URL provided in meta tag "og:video". It seems the recent change is that inside the scripts is now a different URL as this meta URL. Until recently I used a complicated macro to show this second URL as a link to click (in K-Meleon 1.6), but now this URL produces an error "Bad URL timestamp". Suppose in my case that's javascript related (can't use anyway, too outdated). Your younger engines may not have that js-prob, just wanted to mention that there exist 2 URLs and the first one still works. It can easily be extracted by a little script, just not sure how to add it to the page then.

Link to comment
Share on other sites
Dave-H

Dave-H

Posted
  • Author
Posted

I've tried using custom user agent strings on Instagram, which I've not done before, and all that seems to happen then is that the page won't load at all, just showing a blank white page with a camera icon in the middle of it!
:(

Link to comment
Share on other sites
mixit

mixit

Posted
Posted 
instagram.com##div._97aPb > div:style(display: block !important)

seems to work for me on ESR 52 right now (in conjunction with having 56.0 in the UA).

(I'm not crazy about using the non-specific child thing in there, but that other div has no class of its own, and _97aPb doesn't seem to be used elsewhere, so hopefully this won't break anything else.)

2
Link to comment
Share on other sites
Dave-H

Dave-H

Posted
  • Author
Posted

Thanks @mixit!
I now have this in userContent.css 

@-moz-document domain(instagram.com) {
   div._97aPb [role="dialog"] { display: block !important; }
}

How strange to have a trailing space in the div name!
I had tried that div name before and it didn't work, but maybe it needs a different user agent string now as well, which it didn't before.
I've tried several, and none of them make it work again.
Could you tell me what user agent string you're actually using?
Thanks, Dave.
:)

1
Link to comment
Share on other sites
mixit

mixit

Posted
Posted (edited)
4 hours ago, Dave-H said:

I now have this in userContent.css 


@-moz-document domain(instagram.com) {
   div._97aPb [role="dialog"] { display: block !important; }
}
@-moz-document domain(instagram.com) {
   div._97aPb > div { display: block !important; }
}

is what it should be in userContent.css. I don't use userContent.css myself and I guess I figured people would just plug the (entire) changed part into userContent.css based on the previous example. Not that \i blame you, I've made plenty of similar mistakes copying code from one kind of syntax to another. :) (Edit: And even in my last 2 posts here, I've somehow managed to write !'d instead of I'd and \i instead of I:buehehe: That's actually kind of mysterious, though I guess an irregular sleep schedule can do that to you...)

The full UA I'm using on Instagram is Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:56.0) Gecko/20100101 Firefox/56.0 but only the 56.0 part I gave above should matter.

Edited by mixit
3
Link to comment
Share on other sites
Dave-H

Dave-H

Posted
  • Author
Posted

Thank you so much @mixit, it's now working fine again.
:thumbup  :worship:  :thumbup
I will keep your user agent string on Instagram just for hopefully some future proofing in case they start completely rejecting older Firefox versions, although it was almost certainly just my sloppy attempt to modify the userCustom.css code that was the problem, nothing to do with the user agent!
Cheers, Dave.
:)

Link to comment
Share on other sites
Aram

Aram

Posted
Posted (edited)
On 9/15/2019 at 6:22 PM, mixit said: 

@-moz-document domain(instagram.com) {
   div._97aPb > div { display: block !important; }
}

is what it should be in userContent.css. I don't use userContent.css myself and I guess I figured people would just plug the (entire) changed part into userContent.css based on the previous example. Not that \i blame you, I've made plenty of similar mistakes copying code from one kind of syntax to another. :) (Edit: And even in my last 2 posts here, I've somehow managed to write !'d instead of I'd and \i instead of I:buehehe: That's actually kind of mysterious, though I guess an irregular sleep schedule can do that to you...)

The full UA I'm using on Instagram is Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:56.0) Gecko/20100101 Firefox/56.0 but only the 56.0 part I gave above should matter.

This user.Content.css works great (thanks!! :thumbup) - but there's one exception. It doesn't work for the Instagram video galleries. I mean the videos splitted into few parts and uploaded in one gallery post - there's still just a black box (at least in my case). For all single posted videos this fix works perfectly. Is there any chance to make it work for video galleries?

PS - I tried to use different UA strings - no effect for video galleries.

Edited by Aram
Link to comment
Share on other sites
Dave-H

Dave-H

Posted
  • Author
Posted (edited)

Yes, I've noticed that as well.
Not so much of an issue as there aren't that many of them, but it would be good to get them working if it's possible.
:)

Edited by Dave-H
Typo
Link to comment
Share on other sites
mixit

mixit

Posted
Posted (edited)

@Aram & @Dave-H 

@-moz-document domain(instagram.com) {
   div._97aPb > div { display: block !important; }
   div.bsGjF > div { display: block !important; }
   div.bsGjF > div > div { display: block !important; }
}

seems to work with both single videos and carousels, or 

instagram.com##div._97aPb > div:style(display: block !important)
instagram.com##div.bsGjF > div:style(display: block !important)
instagram.com##div.bsGjF > div > div:style(display: block !important)

added to uBlock's cosmetic filters.

(And not to be a grouch, but when you want help with special cases, do provide an example or two, so others don't have to spend extra time trying to figure out and track down what exactly they're supposed to help out with. Not everyone is a heavy enough Instagram user to have these cases handy, for example I don't think I've ever seen a video carousel on the channels I visit more or less regularly. :P)

Edited by mixit
5
Link to comment
Share on other sites
  • 1 month later...
Mathwiz

Mathwiz

Posted
Posted

Nothing new in this post; it's just a summary of what's been discovered so far about this issue.

To play Instagram videos in your FF (or FF-derived) browser, you need three things:

  1. Most obviously, you need to be able to play MP4 videos. This won't be a problem with @roytam1's UXP forks (NM and Serpent) since he includes his MP4 video DLLs in the build. For FF 45 though 52 or SeaMonkey 2.49.5, you can install the Adobe Primetime CDM according to the instructions pinned atop this forum; either method works. (Those instructions were recently modified slightly to work with SeaMonkey.)
  2. You need to set your user agent to spoof FF 56 to instagram.com. You can either set the general.useragent.override preference in about:config to Mozilla/5.0 (Windows NT 6.1; WOW64; rv:56.0) Gecko/20100101 Firefox/56.0 or use an Instagram-specific user agent. FF versions before 56 work too, down to a point, but basically nothing on Instagram works at all if you spoof any version newer than 56.
  3. If you're not using NM, Serpent 52, or SeaMonkey, you need the following code in file userContent.css in the "chrome" subfolder of your profile:
      Quote

    @-moz-document domain(instagram.com) {
       div._97aPb > div { display: block !important; }
       div.bsGjF > div { display: block !important; }
       div.bsGjF > div > div { display: block !important; }
    }

    Note that this code is changed somewhat from @mixit's original fix; Instagram changed some of their random class names, requiring an update. Instagram will probably change them again someday, and we'll have to get @mixit to update his fix yet again.

3
Link to comment
Share on other sites
  • 2 months later...
Aram

Aram

Posted
Posted

Hello again. It looks like recently Instagram has changed something again. In the video and picture windows (and in some other elements on page) there appeared scroll bars that weren't seen before. That's not a problem - but at the same time some videos has stopped to work again. Most of videos still works (80-90% is okay) - but in some cases there are just a blank windows again. Those “blank videos” are still visible through the page info > Media > Video link, but they are invisible in the post on the Instagram page. And another thing - since those scroll bars appeared Instagram generally works a bit slower - some things load slower (e.g. the window with the list of followers etc.). I’m the only one with that problem? Any chance for some solution - especially for those blank video windows?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...