Skip to content

Add experimental support for Tailwind CSS v4 #420

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Oct 17, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
2 changes: 2 additions & 0 deletions .github/workflows/upstream.yml
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
5 changes: 5 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
## next / unreleased

* Add experimental support for Tailwind CSS v4. (#420) @flavorjones


## v3.0.0

### Notable changes
Expand Down
15 changes: 12 additions & 3 deletions lib/tailwindcss/commands.rb
Original file line number Diff line number Diff line change
Expand Up @@ -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")
Expand Down
9 changes: 8 additions & 1 deletion test/integration/user_journey_test.sh
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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"
28 changes: 27 additions & 1 deletion test/lib/tailwindcss/commands_test.rb
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down