1891927 - Unable to play Crosswords puzzle on washingtonpost.com

Status: RESOLVED WORKSFORME

(Web Compatibility :: Site Reports, defect, P1)

Description

[railioaie]

Attachment: 17.04.2024_10.28.18_REC.mp4

Environment:
Operating System: Samsung A51 (Android 11) -1080 × 2400 pixels 20:9 aspect ratio (~405 ppi density)
Firefox version: Firefox Nightly 127.0a1 (2016015303-🦎127.0a1-20240415203932🦎)

Preconditions:
Clean profile
ETP set to Strict

Steps to reproduce:

1. Navigate to: https://www.washingtonpost.com/crossword-puzzles/daily/
2. Observe the page

Expected Behavior:
The game is loading correctly after accepting the cookie policy

Actual Behavior:
The game can't be played

Notes:

• ScreenRec attached
• Reproducible on the latest build of Firefox Nightly

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

Since nightly and release are affected, beta will likely be affected too.
For more information, please visit BugBot documentation.

Comment 2

[dan.swift.07]

Can reproduce with ETP off as well.
https://drive.google.com/file/d/1K_GNUMEzIn09eQxATGEZYTDVIs8xMlLT/view?usp=drivesdk

Comment 3

[Tim Huang[:timhuang]]

Per comment 2, this might not be related to anti-tracking features. Moving the bug to the webcompat for now. Feel free to move it back if this is caused by anti-tracking features.

Comment 4

[Daniel Holbert [:dholbert] (PTO until 2/24)]

I can reproduce. Comparing the site on my phone vs. on Desktop-with-responsive-design-mode (where this works properly), I can see that there's supposed to be a modal popup element in front of the grayed-out crossword, with some information and buttons to press to dismiss it.

That element has id="info-modal". On Desktop with Responsive Design mode, it has display:block in its inline style (style="..." attribute) when it's showing; but that's not there on Android for some reason, which is why it's missing. If I manually add that in DevTools (connected to my phone), then the modal popup appears, and I can interact with it and get to a functioning crossword as-expected.

So: the question is, why is the site adding display:block to the inline style in responsive-design-mode, but not on my actual phone?

Comment 5

[Jeff Muizelaar [:jrmuizel]]

I'm not sure why this was set to diagnosis-team: Outreach so I'm setting it to diagnosis-team: Layout

Comment 6

[dan.swift.07]

Looks like washingtoppost.com fixed this on their end.

Comment 7

[Daniel Holbert [:dholbert] (PTO until 2/24)]

(In reply to Jeff Muizelaar [:jrmuizel] from comment #5)

I'm not sure why this was set to diagnosis-team: Outreach so I'm setting it to diagnosis-team: Layout

I suspect that this was meant to capture the fact that this was identified as essentially a site bug in comment 4 (though indeed there was a bit more diagnosis we theoretically could have done to figure out what path the site was taking in their JS, to make them add or not-add the all-important style="display:block" attribute on the element in question).

(In reply to dan.swift.07 from comment #6)

Looks like washingtoppost.com fixed this on their end.

Typo in the domain there :) But yes, hooray -- I confirmed that this is fixed on the actual site.

On my phone (Pixel 8 running Firefox Nightly), I now see the modal that I described as being missing-on-Android, in comment 4. The markup has changed a bit (e.g. it doesn't have any element with id="info-modal" anymore), but the modal does now show up (and the crossword is playable when I dismiss it). It's now <div class="modal-content" tabindex="-1"> and has display: flex; explicitly granted by a .modal-content CSS rule (no need for any inadvertent platform-specific display value in the style attribute anymore).