Skip to content

Fix inconsistent Tailwind CSS generation

Stan Hu requested to merge sh-run-tailwind-css-twice into master

What does this MR do and why?

In gitlab-com/gl-infra/production#18107 (closed)#, we saw that the compile-production-assets CI job in GitLab Rails produced slightly different Tailwind CSS files from the files generated by Cloud Native GitLab gitlab-rails-ee image.

This appears to have caused by a subtle difference in how the two jobs ran. The compile-production-assets job attempts to load a cached version by calculating a hash from the source files via bundle exec rake gitlab:assets:hash_sum. However, the gitlab-rails-ee job doesn't do that.

The hash_sum Rake task has a subtle side effect of invoking the gitlab:assets:tailwind Rake task, which runs the tailwind_all_the_way.mjs script. This causes an inconsistent results, depending on how many times the gitlab:assets:tailwind was invoked because:

  1. tailwind_all_the_way.mjs depends on tailwind.config.js, which attempts to load config/helpers/tailwind/css_in_js.js if it is present.
  2. However, tailwind_all_the_way.mjs generates config/helpers/tailwind/css_in_js.js, so the tailwind.config.js could load different rules after config/helpers/tailwind/css_in_js.js is built.
  3. Ultimately the generated tailwind.css may be different depending on whether config/helpers/tailwind/css_in_js.js existed in the first place.

To ensure that tailwind.css is in the correct state, run the gitlab:assets:tailwind Rake task twice in a row during the gitlab:assets:compile Rake task. This ensures that the assets will always be consistent if the CI job doesn't run bundle exec rake gitlab:assets:hash_sum.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

How to set up and validate locally

In master, run:

  1. rm -rf config/helpers/tailwind
  2. bundle exec rake gitlab:assets:compile
  3. Then run bundle exec rake gitlab:assets:hash_sum. That is hash A.
  4. Repeat step 2 and verify the hash is different this time.

With this branch, the hash should be the same.

Edited by Stan Hu

Merge request reports