1531233 - Comments on nood.tv can't be scrolled

Status: RESOLVED DUPLICATE of bug 1042151

(Firefox for Android Graveyard :: General, defect, P3)

Description

[csheany]

User Agent: Mozilla/5.0 (Android 7.1.1; Tablet; rv:67.0) Gecko/67.0 Firefox/67.0

Steps to reproduce:

1. Open nood.tv
2. Request desktop site
3. Click on a link

Actual results:

Comments can't be scrolled

Expected results:

Comments can be scrolled

Comment 1

[Laurentiu Apahidean]

Hello,

I have managed to reproduce the issue on the latest versions of Nightly (67.0a1), Beta (66.0b11) and Release (65.0.1) using the devices OnePlus A3000 (Android 6.0.1) and Nexus 9 (Android 7.1.1).
After following the steps found in the Description the comment section cannot be scrolled.

Based on the Description and my comment I will set this issue as new.

Comment 2

[Liz Henry (:lizzard) (relman/hg->git project)]

Is this a firefox problem or a problem with the site? Laurentiu can you look for a regression range?

Comment 3

[csheany]

I believe it is a problem with Firefox as it is not reproduced in Focus with WebView.

Comment 4

[Laurentiu Apahidean]

(In reply to Liz Henry (:lizzard) (use needinfo) from comment #2)

Is this a firefox problem or a problem with the site? Laurentiu can you look for a regression range?

Hello,

I performed a regression test on the device Huawei MediaPad M3 Lite 10 (Android 7.0) as far back as 2016 but the issue occurred on all builds, on builds older than 2016 an error message is displayed and the site cannot be accessed.

Comment 5

[Botond Ballo [:botond]]

(In reply to csheany from comment #0)

Steps to reproduce:

1. Open nood.tv

When I do this, all I see is "Use Chrome to access Nood from your Android device".

2. Request desktop site
3. Click on a link

Same message again after this step.

Comment 6

[csheany]

The STR are in a perfect world :)

Try refrshing the page

See also Bug 1531232

Comment 7

[csheany]

Would you mind taking another look when you have a chance?

Comment 8

[Botond Ballo [:botond]]

I was able to get past the "Use Chrome" message, but there wasn't an actual livestream on the site to test the issue.

The next time you see this issue, could you go to Page -> View Page Source, select the entire page source, and post it here as an attachment?

Comment 9

[csheany]

Will do.

May I ask why you think the message persisted after successfully requesting the desktop site?

Comment 10

[Botond Ballo [:botond]]

Do you mean the "Use Chrome" message? I have no idea.

Also, please let's try to keep discussions in bugs on topic. This bug is about "comments can't be scrolled". We have the mentioned bug 1531232 on file about the site wanting you to use Chrome.

Comment 11

[csheany]

Attachment: Nood.tv - Page Source

Comment 12

[Botond Ballo [:botond]]

Attachment: Testcase (zip file)

Thanks.

I wasn't able to turn your attachment into a testcase that reproduces the problem, but I was able to catch the problem myself, and in a desktop build, which allowed me to use "File -> Save Page As -> Web Page, complete" to get a complete testcase (HTML + CSS files etc.)

I've confirmed that in the attached testcase, the comments are scrollable in Chrome and not in Firefox. (If testing on desktop, you need to resize the browser window to tablet-like dimensions, or use Responsive Design Mode.)

Posting for later analysis.

Comment 13

[csheany]

Does the actual desktop site look different?

Comment 14

[Botond Ballo [:botond]]

(In reply to csheany from comment #13)

Does the actual desktop site look different?

It looks the same as long as the browser window is sized to have dimensions similar to a tablet. The site uses media queries to adapt its layout to the screen size.

Comment 15

[Botond Ballo [:botond]]

Attachment: Reduced testcase

Here is a reduced testcase.

In Chrome, the .scroll-container element can be scrolled; in Firefox, it cannot.

Comment 16

[Botond Ballo [:botond]]

The problem seems to be that in Chrome, .content-box is limited to the viewport height, which limits .scroll-container to the viewport height as well, which allows .content to scroll. In Firefox, .content-box and .scroll-container are sized to fit .content, so .scroll-container has zero scroll range.

I'm not sure which is the correct behaviour. Daniel, could you weigh in? The testcase uses display: flex.

Comment 17

[csheany]

I was starting to wonder if the desktop site wasn't properly requested because of responsive web design.

Is that a browser issue?

Should I file a seperate bug?

Comment 18

[Daniel Holbert [:dholbert]]

Looking at botond's .tgz partially-reduced testcase: the comment area becomes scrollable if you remove flex-direction: column-reverse; (or change column-reverse to column), for the element with id="messages_chat_7179".

Here's the CSS rule in question:

.content-box .content-box-chat-messages {
    flex: 1;
    flex-direction: column-reverse;
    background-color: #f6f9fa;
}

Basically, the site is creating overflow in the "negative" direction, which we don't currently allow to be scrolled, though the spec changed at some point to say that we should. We have an open bug on this -- let me see if I can find it...

Comment 19

[Daniel Holbert [:dholbert]]

Yeah, this is a version of bug 1042151. Marking as a duplicate.

Comment 20

[Daniel Holbert [:dholbert]]

(In reply to Botond Ballo [:botond] from comment #15)

Created attachment 9052938 [details]
Reduced testcase

Here is a reduced testcase.

In Chrome, the .scroll-container element can be scrolled; in Firefox, it cannot.

Note: this testcase was probably showing a different behavior-difference, though it's not a behavior-difference that I can reproduce. This testcase doesn't use column-reverse, so I don't think it was exercising the core problem here (covered by bug 1042151).

In this reduced testcase, I don't see .scroll-container being scrollable in either Firefox or Chrome (Dev edition 74) -- it's 2000px tall (as tall as its content) in both, and not scrollable since it sizes to its content. If you're seeing a behavior difference between Firefox and Chrome there, you may be hitting a Chrome bug that hasn't yet been fixed in release, like https://bugs.chromium.org/p/chromium/issues/detail?id=933931 .

However, I do see a Firefox-vs-Chrome74 difference in your earlier .tgz testcase, and that difference is due to bug 1042151.

Comment 21

[Botond Ballo [:botond]]

(In reply to Daniel Holbert [:dholbert] from comment #20)

In this reduced testcase, I don't see .scroll-container being scrollable in either Firefox or Chrome (Dev edition 74) -- it's 2000px tall (as tall as its content) in both, and not scrollable since it sizes to its content. If you're seeing a behavior difference between Firefox and Chrome there, you may be hitting a Chrome bug that hasn't yet been fixed in release, like https://bugs.chromium.org/p/chromium/issues/detail?id=933931 .

Huh, you're right. I was testing with Chromium 72, and with a nightly it indeed doesn't scroll.

Comment 22

[Botond Ballo [:botond]]

(In reply to csheany from comment #17)

I was starting to wonder if the desktop site wasn't properly requested because of responsive web design.

Is that a browser issue?

Should I file a seperate bug?

Not all sites will serve different HTML to mobile vs. desktop clients. Some will serve the same HTML, and use media queries as mentioned to adapt the layout based on the screen size.