Skip to content

Conversation

@RobinMalfait
Copy link
Member

@RobinMalfait RobinMalfait commented Mar 21, 2025

This PR fixes an issue where a class shorthand in Pug followed by a ( is not properly extracted.

<template lang="pug">
.text-sky-600.bg-neutral-900(title="A tooltip") This div has an HTML attribute.
</template>

The text-sky-600 is extracted, but the bg-neutral-900 is not.

Fixes: #17313

Test plan

  1. Added test to cover this case
  2. Existing tests pass (after a few small adjustments due to more extracted candidates, but definitely not less)
  3. Verified against the original issue (top is before, bottom is this PR)
image

We had this exact same bug in Slim (#17278). Since Pug, Slim and Haml are the only pre processors we have right now with this dot-separated class notation I also double checked the Haml pre-processor if this is an issue or not (and it's already covered there).

image

@RobinMalfait RobinMalfait requested a review from a team as a code owner March 21, 2025 08:49
Because `(` is replaced with a ` ` we extract a few more candidates.
@RobinMalfait RobinMalfait merged commit 5426baf into main Mar 21, 2025
6 checks passed
@RobinMalfait RobinMalfait deleted the fix/issue-17313 branch March 21, 2025 14:43
@philipp-spiess philipp-spiess mentioned this pull request Mar 24, 2025
philipp-spiess added a commit that referenced this pull request Mar 24, 2025
This change was added in #17320 which was not released yet, see commit
order on `main`:
https://github.com/tailwindlabs/tailwindcss/commits/main/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Some Tailwind classes are not extracted from Pug templates in Vue when elements have attributes

3 participants