CSS changes not reflected (Asset Pipeline/Cache/HTML issue)
Issue: CSS changes I added to application.css
for form styling were not reflected in the browser despite server restarts and hard refreshes.
Troubleshooting Steps: I verified CSS file content. Checked browser Network tab (saw 200 OK (from memory cache)
, indicating stale cache). Ran rbenv exec rails assets:clobber
and restarted/refreshed; still no change. Verified stylesheet_link_tag
in layout. Verified asset pipeline gem (propshaft
). Checked for potential Procfile.dev
/manifest.js
issues (none found/needed for Propshaft dev). Re-inspected CSS/HTML.
Resolution: I found that the required HTML structure changes (adding classes like form-container
, form-group
, placeholders) in _form.html.erb
were missing/had been reverted. Re-applying the necessary HTML changes resolved the issue.
Learning: When CSS doesn't apply as expected, I learned to double-check *both* the CSS *and* the HTML structure it targets. Asset pipeline issues (caching) can occur, but often the root cause is simpler: the HTML/CSS edits weren't applied correctly or completely in the first place. rails assets:clobber
is a key tool for suspected CSS/JS caching issues in development. Propshaft in development typically serves assets directly without complex manifests.
Learned on: April 19, 2024
Edit