Skip to content
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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: Cannot read properties of undefined (reading 'parent') on negative translate #6981

Closed
cabello opened this issue Jan 9, 2022 · 2 comments 路 Fixed by #7295
Closed

Comments

@cabello
Copy link

cabello commented Jan 9, 2022

Hello 馃憢

Loving TailwindCSS so far, thank you for sharing it with the world. 馃挏

What version of Tailwind CSS are you using?

3.0.12

What build tool (or framework if it abstracts the build tool) are you using?

"autoprefixer": "^10.4.0",
"postcss": "^8.4.5",
"react-scripts": "^4.0.3", (webpack v4)

What version of Node.js are you using?

nodejs 16.13.0

What browser are you using?

Not Applicable

What operating system are you using?

macOS

Reproduction URL

https://play.tailwindcss.com/o4VWC6LUyA

Describe your issue

I am using Tailwind with prefix: 'tw-' as shown in the reproduction URL.

  • If I use hover:tw--translate-y-1 it goes up as expected.
  • If I use no prefix in my config -translate-y-1 goes up as expected.
  • If I use hover:-tw-translate-y-1 it crashes with the following stack trace.
Rebuilding...
TypeError: Cannot read properties of undefined (reading 'parent')
    at Root.normalize (/Users/.../node_modules/tailwindcss/peers/index.js:3863:19)
    at Root.normalize (/Users/.../node_modules/tailwindcss/peers/index.js:4163:27)
    at Root.insertAfter (/Users/.../node_modules/tailwindcss/peers/index.js:3785:26)
    at Rule.after (/Users/.../node_modules/tailwindcss/peers/index.js:908:21)
    at processApply (/Users/.../node_modules/tailwindcss/lib/lib/expandApplyAtRules.js:258:20)
    at /Users/.../node_modules/tailwindcss/lib/lib/expandApplyAtRules.js:275:9
    at /Users/.../node_modules/tailwindcss/lib/processTailwindFeatures.js:45:50
    at Object.Once (/Users/.../node_modules/tailwindcss/lib/cli.js:619:27)
    at LazyResult.runOnRoot (/Users/.../node_modules/tailwindcss/peers/index.js:5108:27)
    at LazyResult.runAsync (/Users/.../node_modules/tailwindcss/peers/index.js:5150:30)

When I hover over on the last broken variant it shows what the CSS rule would look like.

Screen Shot 2022-01-08 at 10 15 06 PM

This could be a bug or I might be using wrong with the prefix, negative transforms should be <prefix><minus> instead of <minus><prefix>.

The autocomplete does show this as a valid possibility:

Screen Shot 2022-01-08 at 10 11 30 PM

Positive values work as expected.

Cheers, 馃檱
Danilo

@furby-tm
Copy link

@cabello I just wanted to thank you so much for finding the culprit of this bug, I have tons of style sheets with @applys and I truly would have never found out what to remove without you clarifying this super cryptic error message, thank you!! And yes, I can also confirm this bug exists on the latest version of tailwind.

@jnns
Copy link

jnns commented Feb 7, 2022

Just ran into this bug and while reading the ticket I saw it being closed already. Thank you so much @thecrypticace 馃檹

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 a pull request may close this issue.

3 participants