diff --git a/CHANGELOG.md b/CHANGELOG.md index f73d1a950722..0ef5bb4f64b5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Don’t prefix classes within reused arbitrary variants ([#8992](https://github.com/tailwindlabs/tailwindcss/pull/8992)) - Fix usage of alpha values inside single-named colors that are functions ([#9008](https://github.com/tailwindlabs/tailwindcss/pull/9008)) +- Fix `@apply` of user utilities when negative and non-negative versions both exist ([#9027](https://github.com/tailwindlabs/tailwindcss/pull/9027)) ### Changed diff --git a/src/lib/expandApplyAtRules.js b/src/lib/expandApplyAtRules.js index f5e84a318147..7088337abbeb 100644 --- a/src/lib/expandApplyAtRules.js +++ b/src/lib/expandApplyAtRules.js @@ -499,6 +499,12 @@ function processApply(root, context, localCache) { }) } + // It could be that the node we were inserted was removed because the class didn't match + // If that was the *only* rule in the parent, then we have nothing add so we skip it + if (!root.nodes[0]) { + continue + } + // Insert it siblings.push([ // Ensure that when we are sorting, that we take the layer order into account diff --git a/tests/apply.test.js b/tests/apply.test.js index 6040aad22c38..b1a2ac461d2f 100644 --- a/tests/apply.test.js +++ b/tests/apply.test.js @@ -1548,3 +1548,39 @@ it('apply + user CSS + selector variants (like group) + important selector (2)', } `) }) + +it('can apply user utilities that start with a dash', async () => { + let config = { + content: [{ raw: html`
` }], + plugins: [], + } + + let input = css` + @tailwind utilities; + @layer utilities { + .foo-1 { + margin: 10px; + } + .-foo-1 { + margin: -15px; + } + .new-class { + @apply -foo-1; + } + } + ` + + let result = await run(input, config) + + expect(result.css).toMatchFormattedCss(css` + .foo-1 { + margin: 10px; + } + .-foo-1 { + margin: -15px; + } + .new-class { + margin: -15px; + } + `) +})