By jmasquith on

Question: Workaround for developing theme and content -- CSS is sometimes stale?

Greetings! I am an experienced coder. I am porting my content and functionality from a CMS I developed as well as Wordpress and PHPNuke to Drupal 6.19 on Yahoo! Web Hosting. I am very pleased with Drupal. I have noticed that when I modify style.css (custom theme based on Garland files, not a sub-theme) and inspect in Firefox/Firebug, my style.css is sometimes stale. I have all caching disabled, I clear the cache via Performance/Clear cache, and I am using a "hard refresh" (i.e. CTRL/F5). What is going on, and is there a workaround?

More info: My current theory is that the style.css file is being cached either by Apache or the server's file system. I am using an HTTP snoop to verify the CSS file is requested by Firefox, so not a browser issue.

When I had this problem in my CMS, I had a button similar to Performance/Clear Cache, and in addition to clearing my cache, my handler for this button would:

  1. rename style file (e.g. to foo.bar, now style.css does not exist on the server file system)
  2. request original filename via cURL (gets HTTP 404, this forces the Apache cache or whatever file system cache to be cleared)
  3. rename file to original filename
  4. request file via cURL
  5. verify file and report file time/size on U/I

This approach seems to address the issue in my CMS, because I don't seem to observe stale CSS files when I am working on my CMS. When I manually perform these steps in my configuration with Drupal, I do not have this issue. I won't accept "this is a Apache/Yahoo! problem" or "change the Apache config" (I can't) because I know the CMS can address the issue by automatically performing the manual workaround.

I am seriously considering putting this fix into my copy of Drupal and offering it to the community because the manual workaround is bothersome and error-prone. The workaround is bothersome because it requires extra workflow steps and requires a "baby-steps" sort of development cycle, and error-prone because sometimes I forget to do this. I really do not want to do this as I would prefer to contribute to the Drupal documentation, not the Drupal code. If my suggestion works as described, it would once and for all address the issue of stale CSS files (a Google search yields people continually have this issue). Comments on this theory or approach?

Cheers! Jim A

⋅ Categories: Drupal 6.x

Comments

SweeneyTodd’s picture

SweeneyTodd commented

Load the Administration Module. This will add the Administration menu items horizontal menu bar at the top of your browser window with dropdown menus. It also has a couple of additional items if you hover your mouse over the drupal icon; these include Clear All Caches and clearing caches individually.

When I have had style sheet issues this usually works as long as you do not have Optimize CSS turned on (Site Configuration > Performance) as this will compress all your css files into a sinlge one and store it in your 'files' folder. This is really a pain if you are doing development so you should turn it off.

Clearing the caches is also required when you add new functions into modules or themes using php.

I believe the Clear Caches functionality is also available through the Development module.

jmasquith’s picture

jmasquith commented

Nope, but thanks for your reply Todd. Please re-read my post.

I have all caching disabled. In your reply, you wrote "usually". I want a solution that works every time, not "usually". Also, I believe your description of the U/I depends on the theme you are using and other settings? For example, there is no "Drupal icon" on my U/I because this is not selected in my configuration. Are you suggesting turning on this icon provides additional functionality? Which cache are you suggesting should be individually cleared to address my issue?

SweeneyTodd’s picture

SweeneyTodd commented

I said that you have to download and enable the administration module. This will give you a menu with a drupal icon at the top left of the screen. That is how you access these functions.

The Administration menu is only visible to the administrator so it will not change the UI for your users.

jmasquith’s picture

jmasquith commented

I am sorry Todd if you think I am ranting, that is not my intent. I said thanks, and I really appreciate the fact you have taken the time to respond twice. I am simply asking for help.

In the version 6.19 I downloaded, the Administration module is included in the default installation I downloaded. I did not use an install provided by an ISP. If there is some additional 6.19 administration module available, can you please provide the URL to the download or to documentation for this download? I am new to Drupal so perhaps I just do not know where to look.

By default, a Drupal icon is included in the Garland theme, and perhaps others. Whether this icon is displayed depends on whether Administer/Site building/Themes module has the "Logo" checkbox checked. I do not have this checked, so I see no Drupal icon in the Administration module. When I enable this icon and hover over the icon, I do not see additional menu items. Do you think this is because my administration module is not the one to which your refer?

I understand that the Administration module uses a different theme than does the user theme, and that the Administration module is not not visible to users.

In your original reply, you state "Clear All Caches and clearing caches individually". I agree, these features are contained on the Administer/Site configuration/Performance form. As I stated in my original post, these were all disabled, and pressing the "clear cached data" does not affect this issue, I think because Apache or the file system is caching the data, not Drupal. Which cache do you think causes my issue? Can you post a screen shot of the Administration form you think has the control that affects my issue, because I still believe I have the correct Administration module, because I do not think there are two such modules.

Thanks again for your willingness to help!

SweeneyTodd’s picture

SweeneyTodd commented

The administration menu module (http://drupal.org/project/admin_menu) is a contributed module and not part of the Drupal core.

jmasquith’s picture

jmasquith commented

Thanks! I downloaded the admin_menu package and reviewed the docs, but I have not loaded it yet. When I review the docs, it seems like there is no "new functionality" here, these menus simply provide a better/faster/cleaner way of doing what I was already doing, which was disabling all caching and forcing a cache clear.

I think this is a mistake in the Drupal design. My use case is simply "modify the style.css file", and I am having to click buttons and menu items that should not be necessary. I can see with my snoop that both IE and Firefox request the style.css file, and I can see in Firebug the old file is being served. I can also see that if I manually delete/move/etc. the style.css file that then the correct file arrives. I understand why Drupal tries to cache the CSS file. However, my use case is so common that I believe there should be a better way of accomplishing Drupal's goals than forcing a theming user to do more than "put Drupal in CSS design mode" one time. For each style.css edit, there should be no steps required other than to upload the new file. A PHP script certainly can *) see that style.css has changed, and *) take the appropriate actions.

Even though I am working with style.css and trying to theme, this is not a theming issue, it is more fundamental. I will look for a new forum to post in.

Thanks again for the help, and please accept my appologies if any post of mine seems rude. I am not a rude person and I know you are just trying to help.

Cheers!
Jim A.

SweeneyTodd’s picture

SweeneyTodd commented

Maybe you can create a module that can check the timestamps of the css files to see if they change and rebuild the cached copy if they do?

Some themes (Zen) can be put into design mode and they will rebuild the theme registry on every page call, but I do not know whether that would address this issue.

jmasquith’s picture

jmasquith commented

What I did yesterday (it took most of the day) was modify the source to stat() style.css and write the results to a flat file. What I see is that the PHP gets the correct information, so sees a new file, but I end up with a stale CSS file (on occasion). I also see that if I delete/HTTP GET/upload new file, the client then gets the updated file. This implies to me that my issue is likely to be an Apache issue or maybe a bug in Drupal, but not a file system cache issue (which would have been bad news because no way to detect/defend). Since I am on a Yahoo! hosted server, I cannot modify or instrument Apache. Since many other users also use a hosted server, and since at least some other users occasionally get stale CSS files, I think Drupal should detect what I see, and do "whatever is required" to improve or at least document what is going on. For example, putting the current time and size for CSS files on the U/I would tell a themer that a problem exists. Short of that, the information could be included in the output markup as a comment.

I have seen the Zen theme, and perhaps I should change, but I already invested a lot of time in Garland, and I don't have the time or desire to start over unless I have to. If the feature you describe is in Zen, my guess is that my issue or a similar issue is why it is in Zen, and I believe this functionality should be moved to the Drupal core, or perhaps all of Zen should be (my preference).

I did not flush the CSS cache because I am a new user and I did not know to do this. When I return to this issue, I will definitely do as you suggest. My current problem is I own a software company, this issue has cost me perhaps 20 hours this week, and I am literally out of time at the moment. That is one good reason to move this to core, no one should expect a new user to have to dig so deep into the code or download non-core packages for such a simple use case (i.e. change a CSS file).

You know more about Drupal and Zen than I do, if you have time, please add your knowledge about Zen and this issue to my feature request, the correct answer may be as simple as move Zen to core or copy/paste a small amount of code to core or maybe even just modify the docs. I looked for an issue number but did not see one, the title of the feature request is "Drupal theming mode".

Thanks! Jim A.

jmasquith’s picture

jmasquith commented

I believe my issue is related to a bug in the Drupal core. I also believe your suggested workaround "check the timestamps of the CSS files to see if they change and rebuild the cached copy" would address my issue. When I have time, I will investigate signing up for this assignment. If someone sends me email or posts on my threads, that process may move faster.

More information: In looking at other posts on this website, I noticed a recommendation by another that one should enable CSS optimization to avoid some issue with IE. The very first time I did this, I observed that a new CSS file is constructed by Drupal and referenced by the markup (correct) and the produced file contained my old CSS source (incorrect). This could not occur if the incorrect caching occurs in the file system or in Apache. The constructed CSS file is produced by Drupal using a stale CSS cache.

Assuming your comments about Zen are correct (I believe you), this indicates the reason Zen provides an "always invalidate the cache feature" is that Zen was constructed to facilitate theming and this functionality is required if one is modifying the CSS source. This is an unfortunate discovery. It indicates the folks that developed Zen have some level of understanding of this issue, yet the Drupal core has not been corrected. I will post a bug report when I have time.

Your comments have been most useful. Thanks for your help. Jim A.