Flash of unstyled content (FOUC) on "application/xhtml+xml" page load
Reported by
craig.fr...@gmail.com,
Dec 20
|
||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/72.0.3626.28 Safari/537.36 Steps to reproduce the problem: Create a web page that has an external style sheet (loaded via a <link> tag), and has the Content-Type set to "application/xhtml+xml", e.g. https://www.krang.org.uk/misc/chrome/2018-12-20-fouc/ When you refresh the page with [cmd]+[shift]+[r], there will be a flash of un-styled content. This issue can also happen when following a link, but this tends to require a page with more content (HTML, CSS, or JS)... it's less likely to happen on your local machine (I assume the network delay is the main factor)... and it's more likely to happen if an extension loads some 'content_scripts'. What is the expected behavior? What went wrong? Stylesheets loaded via: <link rel="stylesheet" type="text/css" href="file.css" media="all" /> Should be loaded and used before first render. Did this work before? N/A Does this work in other browsers? Yes Chrome version: 72.0.3626.28 Channel: beta OS Version: OS X 10.14.2 Flash Version: This happens in Chrome Beta (72.0.3626.28) and Canary (73.0.3646.0). I'm fairly sure this is a new problem in Chrome 72... where it's been happening for a couple of weeks (only just got around to isolating the issue). I use XML mode during development to make sure I don't make any mistakes in my HTML (e.g. forgetting to quote an attribute).
,
Dec 21
Tried testing the issue on chrome reported version# 72.0.3626.28 using Mac 10.14.0 with steps mentioned below: 1) Launched chrome reported version and navigated to URL: https://www.krang.org.uk/misc/chrome/2018-12-20-fouc/ 2) Refreshed the page, didn't observed any flash content 3) Opened Devtools>Performance, clicked on record, reloaded the page and clicked on 'Stop'(find attached for reference) @Reporter: Please find the attached screencast for your reference and provide your feedback on it which help in further triaging the issue in better way. Note: Tentatively adding Blink>CSS component to it. Thanks!
,
Dec 21
This seems to be a timing issue... where the example needed to use [cmd]+[shift]+[r] rather than [cmd]+[r], so the page was loaded without using the cache. I've updated the example to add a 1 second delay to the CSS file (with a query string on it's URL, to intentionally break the cache). I've also added support for dropping the "application/xhtml+xml" content type: https://www.krang.org.uk/misc/chrome/2018-12-20-fouc/ https://www.krang.org.uk/misc/chrome/2018-12-20-fouc/?xml=false
,
Dec 21
Thank you for providing more feedback. Adding the requester to the cc list. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Dec 21
|
||||||||
►
Sign in to add a comment |
||||||||
Comment 1 by swarnasree.mukkala@chromium.org
, Dec 21