Merge pull request #420 from rails/flavorjones-support-tailwind-4

Add experimental support for Tailwind CSS v4

Author: flavorjones

.github/workflows/ci.yml

@@ -37,7 +37,10 @@ jobs:
       fail-fast: false
       matrix:
         plat: ["ubuntu", "windows", "macos"]
+        tailwind: ["--version=~>3.4.14", "--version=~>4.0.0.alpha.27"]
+    env:
     runs-on: ${{matrix.plat}}-latest
+      TAILWINDCSSOPTS: ${{ matrix.tailwind }}
     steps:
       - uses: actions/checkout@v4
       - uses: ruby/setup-ruby@v1

.github/workflows/upstream.yml

@@ -42,8 +42,10 @@ jobs:
       matrix:
         plat: ["ubuntu"]
         ref: ["7-2-stable", "v8.0.0.beta1", "main"]
+        tailwind: ["--version=~>3.4.14", "--version=~>4.0.0.alpha.27"]
     env:
       RAILSOPTS: --git=https://github.com/rails/rails --ref=${{ matrix.ref }}
+      TAILWINDCSSOPTS: ${{ matrix.tailwind }}
     steps:
       - uses: actions/checkout@v4
       - uses: ruby/setup-ruby@v1

CHANGELOG.md

@@ -1,3 +1,8 @@
+## next / unreleased
+
+* Add experimental support for Tailwind CSS v4. (#420) @flavorjones
+
+
 ## v3.0.0
 
 ### Notable changes

lib/tailwindcss/commands.rb

@@ -3,14 +3,23 @@
 module Tailwindcss
   module Commands
     class << self
+      def tailwindcss_version
+        Tailwindcss::Ruby::VERSION
+      end
+
       def compile_command(debug: false, **kwargs)
         command = [
           Tailwindcss::Ruby.executable(**kwargs),
-          "-i", Rails.root.join("app/assets/stylesheets/application.tailwind.css").to_s,
-          "-o", Rails.root.join("app/assets/builds/tailwind.css").to_s,
-          "-c", Rails.root.join("config/tailwind.config.js").to_s,
+          "-o", Rails.root.join("app/assets/builds/tailwind.css").to_s
         ]
 
+        unless tailwindcss_version >= "4.0"
+          command += [
+            "-i", Rails.root.join("app/assets/stylesheets/application.tailwind.css").to_s,
+            "-c", Rails.root.join("config/tailwind.config.js").to_s,
+          ]
+        end
+
         command << "--minify" unless (debug || rails_css_compressor?)
 
         postcss_path = Rails.root.join("config/postcss.config.js")

test/integration/user_journey_test.sh

@@ -26,7 +26,8 @@ bundle remove rails --skip-install
 bundle add rails --skip-install ${RAILSOPTS:-}
 
 # use the tailwindcss-rails under test
-bundle add tailwindcss-rails --path="../.."
+bundle add tailwindcss-rails --skip-install --path="../.."
+bundle add tailwindcss-ruby --skip-install ${TAILWINDCSSOPTS:-}
 bundle install
 bundle show --paths
 bundle binstubs --all
@@ -55,3 +56,9 @@ fi
 # TEST: presence of the generated file
 bin/rails generate scaffold post title:string body:text published:boolean
 grep -q "Show this post" app/views/posts/index.html.erb
+
+# TEST: contents of the css file
+bin/rails tailwindcss:build[verbose]
+grep -q "py-2" app/assets/builds/tailwind.css
+
+echo "OK"

test/lib/tailwindcss/commands_test.rb

@@ -9,7 +9,33 @@ def setup
     @executable = Tailwindcss::Ruby.executable
   end
 
-  test ".compile_command" do
+  test ".compile_command with tailwindcss v3" do
+    Rails.stub(:root, File) do # Rails.root won't work in this test suite
+      Tailwindcss::Commands.stub(:tailwindcss_version, "3.4.13") do
+        actual = Tailwindcss::Commands.compile_command
+        assert_kind_of(Array, actual)
+        assert_equal(executable, actual.first)
+        assert_includes(actual, "-i")
+        assert_includes(actual, "-c")
+        assert_includes(actual, "-o")
+      end
+    end
+  end
+
+  test ".compile_command with tailwindcss v4" do
+    Rails.stub(:root, File) do # Rails.root won't work in this test suite
+      Tailwindcss::Commands.stub(:tailwindcss_version, "4.0.0") do
+        actual = Tailwindcss::Commands.compile_command
+        assert_kind_of(Array, actual)
+        assert_equal(executable, actual.first)
+        refute_includes(actual, "-i")
+        refute_includes(actual, "-c")
+        assert_includes(actual, "-o")
+      end
+    end
+  end
+
+  test ".compile_command debug flag" do
     Rails.stub(:root, File) do # Rails.root won't work in this test suite
       actual = Tailwindcss::Commands.compile_command
       assert_kind_of(Array, actual)