[intermittent] AbemaTV HTML5 video would not start automatically

RESOLVED WORKSFORME

Status

Tech Evangelism
Desktop
RESOLVED WORKSFORME
2 years ago
a year ago

People

(Reporter: Alice0775 White, Unassigned)

Tracking

({jp-critical})

Trunk
x86
Windows 10
jp-critical

Firefox Tracking Flags

(firefox47 affected, firefox48 affected, firefox49 affected, firefox-esr45 affected, firefox50 affected)

Details

(Whiteboard: [needsdiagnosis], URL)

(Reporter)

Description

2 years ago
Steps to reproduce:
1. Disable Flash Plugin if installed
2. Open https://abema.tv
3. Click 1st thumbnail to start news

Actual Results:
The video would not start
An error is shown in the Web Console.
too much recursion        89fac91d-4af3-4228-993e-88c7d3b8c22e:78




* Reloading(F5) will start the video...
* OR directly open the URL( https://abema.tv/now-on-air/abema-news ), the video works properly


Expected Results:
The video should start without reloading(F5) the page.
(Reporter)

Updated

2 years ago
Keywords: jp-critical
Summary: AbemaTV HTML5 video would not start automatically since 47 → [intermittent] AbemaTV HTML5 video would not start automatically
Version: 47 Branch → 46 Branch
(Reporter)

Updated

2 years ago
status-firefox-esr45: unaffected → affected
Keywords: regression
Version: 46 Branch → Trunk
(Reporter)

Comment 1

2 years ago
pls ignore followings:
> * Reloading(F5) will start the video...
> * OR directly open the URL( https://abema.tv/now-on-air/abema-news ), the video works properly
Firefox: 50.0a1, Build ID: 20160626030213
User Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:50.0) Gecko/20100101 Firefox/50.0

I have tested this issue on the latest Firefox (47.0) release and latest Nightly (50.0a1) build, and I could reproduce it. The videos are accessible only in Japan so I have manually configured the Firefox connection settings using proxies from Japan in order to test this issue. 
I have played the first video from the page, but it didn't start, only after refreshing the page.
Sometimes the video is played without refreshing the page, but after a few seconds it stops and the "too much recursion" error is shown in web console.
Component: Untriaged → Audio/Video: Playback
Brian - I'm guessing that this is an issue with the site Javascript. Is there someone in Mozilla Japan who could contact the site?
Flags: needinfo?(bbirtles)
(In reply to Anthony Jones (:kentuckyfriedtakahe, :k17e) from comment #3)
> Brian - I'm guessing that this is an issue with the site Javascript. Is
> there someone in Mozilla Japan who could contact the site?

The page actually says that Firefox might not work.
(お使いのブラウザは推奨環境外のため、正しく動画が再生されない可能性があります。快適に視聴するために、最新版のGoogle Chromeまたは、Internet Explorer11をご利用ください。 -- The browser you're using is outside the system requirements so there's a change the video won't play correctly. For optimal viewing please use the latest Google Chrome or Internet Explorer 11)

I get a bunch of "SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data" errors as well. Not sure if they're related.

While I think dynamis could probably get in touch with them I don't think there's any point since they already seem to know their site is broken in Firefox. We should try to narrow down the cause and suggest a fix (assuming it's not a Gecko bug that their changes have uncovered).
Component: Audio/Video: Playback → Desktop
Flags: needinfo?(bbirtles) → needinfo?(kdubost)
Product: Core → Tech Evangelism
(In reply to Brian Birtles (:birtles) from comment #4)
> The page actually says that Firefox might not work.
> (お使いのブラウザは推奨環境外のため、正しく動画が再生されない可能性があります。快適に視聴するために、最新版のGoogle
> Chromeまたは、Internet Explorer11をご利用ください。 -- The browser you're using is
> outside the system requirements so there's a change the video won't play
s/change/chance/
When I access the site there is already a broken icon.
When I click abema news with MacOS X. The video doesn't start indeed.
fwiw the same thing is happening with Opera Blink on MacoSX
And the same thing is happening with Chrome User Agent on MacOSX

I'm not sure there is anything to do there. It seems broken everywhere. 
Is there a browser where this is working?
Flags: needinfo?(kdubost)
It works for me in Chrome (but not with DevTools panel open) and it sort of works in Firefox.
Switching to needsdiagnosis
This requires an analysis of where and how the issue is happening. 
And suggest a fix in the code before attempting any contacts.
Whiteboard: [needsdiagnosis]
"AbemaTV is only accessible within Japan". A bit hard to do diagnosis without a VPN, I suppose.
Let's see again.
* based in Japan, 
* using Firefox Nightly 53.0a1 (2017-01-03) (64-bit) 
* on macOs Sierra 10.12.2
* __No flash installed at all__
* clean profile
* Fresh new window

1. Enter https://abema.tv/
2. The homepage has the first thumbnail with the video already playing without sound.
3. In the console: "ready to use player"

which comes from https://abema.tv/main.js?v=v1.18.0

```js
window.theoplayer = {
onReady: function () {
console.info('ready to use player'),
d = !0,
p.forEach(function (e) {
return e()
}),
p = null
},
configuration: {
frameAccurateSeekEnabled: !0
}
};
```

Then if I click the active thumbnail.
The video is starting with sound (full width of the airport)
https://abema.tv/now-on-air/abema-news
with instruction for the keyboard on top of the video.

One click on the video and the instructions disappear. The video continues to play.

For CSS the console is pitting out a lot of errors related to a width issue.
Error in parsing value for ‘width’.  Declaration dropped.


AH! when on https://abema.tv/now-on-air/abema-news and hitting reload I get the message about Chrome.

> お使いのブラウザは推奨環境外のため、正しく動画が再生されない可能性があります。快適に視聴するために、最新版のGoogle Chromeをご利用ください。

which seems to be the exact opposite of what people had as an issue.

The message comes from in https://abema.tv/main.js?v=v1.18.0

                        case "promptChrome":
                            i = o.default.createElement("p", {
                                className: u.default.text
                            }, "お使いのブラウザは推奨環境外のため、正しく動画が再生されない可能性があります。快適に視聴するために、", o.default.createElement(a.Link, {
                                className: u.default.link,
                                to: "https://www.google.co.jp/chrome/browser/desktop/",
                                target: "_blank"
                            }, "最新版のGoogle Chrome"), "をご利用ください。");
                            break;
                        case "promptChromeOrIE":


and is triggered by 

        function i() {
            var e = (0, u.default)(),
                t = a.default.hasFlashPlayerVersion("1"),
                n = "Mac OS" === e.os.name,
                r = "Windows" === e.os.name,
                i = "Chrome" === e.browser.name,
                o = "IE" === e.browser.name,
                s = "Safari" === e.browser.name,
                l = s && /^10\.9/.test(e.os.version),
                c = !t && l,
                f = null;
            return !n || i || s ? !r || i || o ? r && o && !t ? f = "promptFlash" : c && (f = "promptFlash") : f = "promptChromeOrIE" : f = "promptChrome", f
        }
(Reporter)

Comment 11

2 years ago
Okay,
The site seemed to fix "too much recursion" error by themselves.

So, I think this bug should close.
(In reply to Alice0775 White from comment #11)
> Okay,
> The site seemed to fix "too much recursion" error by themselves.
> 
> So, I think this bug should close.

OK, thanks!
Status: NEW → RESOLVED
Last Resolved: a year ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.