Stylesheet not being applied in Chome browser

[Raffaele Magliocco]

Just trying to deploy a simple test app. Testing locally it works in
IE, FF, and Chrome. But when deployed, my stylesheet is only being
applied in IE and FF. Anyone seen something like this. I've looked on
the forums but didn't find any help. No errors in the log either.

[Ikai Lan (Google)]

Try shift-refresh.

If not, use Chrome's Developer Tools to see if the stylesheet is being loaded correctly. I suspect a cache issue. Click "Resources" to see if you are correctly downloading the stylesheet:

http://code.google.com/chrome/devtools/docs/timeline.html

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

--
You received this message because you are subscribed to the Google Groups "Google App Engine" group.
To post to this group, send email to google-a...@googlegroups.com.
To unsubscribe from this group, send email to google-appengi...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-appengine?hl=en.

[Pieter Coucke]

I saw something similar in Chrome (didn't test other browsers). The response for the css was empty (in developer tools) but not when going directly to the URL. I cleared Chrome cache, ctrl-f5, ...

I ended up doing the deployment twice every time (the css was empty on the first deploy and correct on the second). Every time again.

The issue was gone after I increased the version number of my app.

--
Pieter Coucke

Onthoo BVBA - zamtam.com

[Pieter Coucke]

I just had it again. It appears that the content-type is "null" which can explain why I can browse to the css URL and see the css but it isn't loaded in Chrome.

Cache-Control: public, max-age=2678400
Content-Length: 13039
Content-Type: null
Date: Wed, 04 Jan 2012 10:06:15 GMT
ETag: "KU-NKQ"
Expires: Sat, 04 Feb 2012 10:06:15 GMT
Server: Google Frontend

After increasing the version number the content-type is now "Content-Type:text/css" and the css loads again.

[djidjadji]

I always use the following method when uploading new application code.

I have two versions of the code: "dev" and "main"

"main" is the default version.

I upload the new code to the "dev" version and test if the update is
working by using the url

http://dev.appname.appspot.com

Then temporarily make "dev" the default version.

Upload the code to "main" and make "main" the default.

This method never failed for static content (css,js). I need to force
reload shift-ctrl-R the page to ignore the browser cache content.

If you apply a cache buster to your css link your users will see the
updated css immediate.

<link type="text/css" rel="stylesheet" href="/css/style.css?ver=20120104">

You need to change the string anytime you upload a new version. If you
use source version control you can use the version number of the css
file.

[Pieter Coucke]

I add an md5 hash of the app version to the css link, so the css is always fresh for a new version. You can not rely on your users to hit ctrl+refresh...

--
You received this message because you are subscribed to the Google Groups "Google App Engine" group.
To post to this group, send email to google-a...@googlegroups.com.
To unsubscribe from this group, send email to google-appengi...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-appengine?hl=en.

[Ikai Lan (Google)]

There's also a chance this is a real Chrome issue. When talking to Google services, Chrome uses SPDY, not HTTP:

http://en.wikipedia.org/wiki/SPDY

I don't know if this applies to static assets deployed via the App Engine SDK. If it happens again, you can start debugging here in Chrome:

chrome://net-internals/#events&q=type:SPDY_SESSION%20is:active

I suspect it might be a cache issue, but I don't want to rule out something weird going on with Chrome/SPDY/GAE.

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

[Kaan Soral]

Does the problem persist for hours?

[Daniel]

I had these problems too. After deployment, the stylesheet was not
applied in Chromium and on the iPhone 4. I could also see the "Content-
Type: null" behaviour in Chromium as mentioned before.
Deploying to a different version and making the new version default
worked for me.

I noticed the misbehaviour after upgrading the AppEngine SDK.

On Jan 4, 10:25 pm, Kaan Soral <kaanso...@gmail.com> wrote:
> Does the problem persist for hours?

yes

[Pieter Coucke]

I have the problem in IE too. Also the content-type=null response and it is gone after a new deployment of exactly the same code and app version.

--
You received this message because you are subscribed to the Google Groups "Google App Engine" group.

To post to this group, send email to google-a...@googlegroups.com.
To unsubscribe from this group, send email to google-appengi...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-appengine?hl=en.

[Jon Stevens]

Ikai, this is a real bug, not some browser cache issue. Your CDN is returning Content-type: null headers, which is wrong.

After posting a question to the google-appengine-java list and not getting any response, I filed a bug 3 days ago that nobody has responded to. There are 15 stars on it.

http://code.google.com/p/googleappengine/issues/detail?id=6655

Please look into it.

[Ikai Lan (Google)]

It's sounding that way. Any chance you guys have noticed any details about when this tends to happen? 

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

--

You received this message because you are subscribed to the Google Groups "Google App Engine" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-appengine/-/pHRtc8Qw1swJ.

[Jon Stevens]

No idea. We did a push of an app, css didn't look right. It seems limited to css files for some reason. Maybe that'll be a clue for your engineers.

jon

[Ikai Lan (Google)]

Okay. That's good information. We haven't been able to reproduce this yet, but maybe we can find more information with some digging.

I also wonder if it's also possible it's not limited to CSS files, it's just that a null content-type doesn't impact browser rendering of any other static asset.

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

[Amy Unruh]

For those of you observing this problem, do you see it with Java apps?  In particular, if anyone is seeing this with a python app, can you indicate that on this thread or the related issue http://code.google.com/p/googleappengine/issues/detail?id=6655 ?

 -Amy

[Brandon Wirtz]

It effects other assets. But yes Mime Type bothers Chrome more.  Especially on CSS.

 

I believe it is an issue with Google “Front end” not GAE (just looking at the ‘black box’)

 

We have seen this on Python, and Java, with both static and non-static assets.  However unlike the behavior described in the bug, we were able to solve the issue by specifying headers with expiration.  However we found that we had to get all of our semi-colons and spacing correct or “Front End” would ignore them.  The first time a URL was served it would not have a specified Mime type, and after it would use the Detected mime type regardless of the mime type we told it. (if we had any header specified with a semicolor, space, or anything else not to it’s liking)

sorry working remotely I don’t have a link to where it is still broken in old code that we test from time to time, and I don’t have the forum post I made that talks about getting the headers “right”

[Ikai Lan (Google)]

Can anyone confirm if they are seeing this for Python? We suspect this is Java only and that this is happening during application upload.

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

[Amy Unruh]

For those affected, it looks like a workaround is to add the following to your web.xml:

<mime-mapping>

 <extension>css</extension>

 <mime-type>text/css</mime-type>

</mime-mapping>

[Brandon Wirtz]

To Ikai’s question about if this is happening in Python. I thought I had seen it in Python, but upon inspection that was a Java Version of our app that we hadn’t migrated to Python. So disregard my earlier mention that it happens on Python as well.

[James Broberg]

A small caveat to the workaround posted on the issue:

I happened to add a new css file to my application, and it is
returning "Content-type: null" for the newly added css file, despite
the explicit mime mapping in web.xml.

However, my existing css files still have the correct mimetype.

[Iván Rodríguez]

THIS IS EMBARRASING GOOGLE.

2012/1/10 James Broberg <jbro...@gmail.com>

[Rik Scarborough]

Not sure if this applies to this problem, but I've noticed that <style type="text/css" media="all">@import "default.css";</style> no longer works in Chrome or later versions of IE. I had to use <link rel="stylesheet" href="default.css" type="text/css" media="all" />

~Rik

[Ikai Lan (Google)]

We think we know what's happening. This is something that is happening at app upload time. Can you try passing this parameter when using appcfg.sh?

appcfg.sh --no_batch update [YOUR_WAR_DIRECTORY]

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

[Amy Unruh]

On Wed, Jan 11, 2012 at 6:58 AM, Ikai Lan (Google) <ika...@google.com> wrote:

We think we know what's happening. This is something that is happening at app upload time. Can you try passing this parameter when using appcfg.sh?

appcfg.sh --no_batch update [YOUR_WAR_DIRECTORY]

To add to Ikai's workaround above: change your app's version name as well when you do the new --no_batch update.

[Ikai Lan (Google)]

We have an SDK update that resolves this issue on upload (I've also posted in a separate thread about this):

http://code.google.com/p/googleappengine/downloads/detail?name=appengine-java-sdk-1.6.1.1.zip

--

Ikai Lan 
Developer Programs Engineer, Google App Engine

plus.ikailan.com | twitter.com/ikai

[Jon Stevens]

Sweet! Please fast track an Eclipse Plugin update too.

jon