fixes #445

docs/resources/changelog.md

@@ -20,6 +20,7 @@ Technical reasons aside, canceling these events seldom led to a good user experi
 - Fixed a bug where toggling `open` stopped working in `sl-alert`, `sl-dialog`, `sl-drawer`, `sl-dropdown`, and `sl-tooltip`
 - Fixed a bug in `sl-range` where setting a value outside the default `min` or `max` would clamp the value [#448](https://github.com/shoelace-style/shoelace/issues/448)
 - Fixed a bug in `sl-dropdown` where placement wouldn't adjust properly when shown [#447](https://github.com/shoelace-style/shoelace/issues/447)
+- Fixed a bug in the internal `shimKeyframesHeightAuto` utility that caused `sl-details` to measure heights incorrectly [#445](https://github.com/shoelace-style/shoelace/issues/445)
 - Fixed a number of imports that should have been type imports
 - Updated Lit to 2.0.0-rc.2
 - Updated esbuild to 0.12.4

src/internal/animate.ts

@@ -63,10 +63,9 @@ export function stopAnimations(el: HTMLElement) {
 // We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the
 // element's scrollHeight before the animation.
 export function shimKeyframesHeightAuto(keyframes: Keyframe[], calculatedHeight: number) {
-  return keyframes.map(keyframe => {
-    if (keyframe.height === 'auto') {
-      keyframe.height = `${calculatedHeight}px`;
-    }
-    return keyframe;
-  });
+  return keyframes.map(keyframe =>
+    Object.assign({}, keyframe, {
+      height: keyframe.height === 'auto' ? `${calculatedHeight}px` : keyframe.height
+    })
+  );
 }