Ensure Element is available before polyfilling (#3493)

In some environments `Element` won't be available, which is needed for
the `Element.prototype.getAnimations` polyfill. If `Element` is not
available at all, it means that we are not in a browser so we don't need
the polyfill.

Fixes: #3490

Author: RobinMalfait

packages/@headlessui-react/CHANGELOG.md

@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-- Nothing yet!
+### Fixed
+
+- Ensure `Element` is available before polyfilling to prevent crashes in non-browser environments ([#3493](https://github.com/tailwindlabs/headlessui/pull/3493))
 
 ## [2.1.8] - 2024-09-12
 

packages/@headlessui-react/src/hooks/use-transition.ts

@@ -7,12 +7,13 @@ import { useIsoMorphicEffect } from './use-iso-morphic-effect'
 if (
   typeof process !== 'undefined' &&
   typeof globalThis !== 'undefined' &&
+  typeof Element !== 'undefined' &&
   // Strange string concatenation is on purpose to prevent `esbuild` from
   // replacing `process.env.NODE_ENV` with `production` in the build output,
   // eliminating this whole branch.
   process?.env?.['NODE' + '_' + 'ENV'] === 'test'
 ) {
-  if (typeof Element.prototype.getAnimations === 'undefined') {
+  if (typeof Element?.prototype?.getAnimations === 'undefined') {
     Element.prototype.getAnimations = function getAnimationsPolyfill() {
       console.warn(
         [