From 49362e80a3a3cd6a47e0be733cc34899958274a3 Mon Sep 17 00:00:00 2001
From: Davide Tantillo <iamdjj@gmail.com>
Date: Fri, 16 May 2025 15:44:44 +0200
Subject: [PATCH] [ts][webcomponents] Fixed no-auto-parent-transform with
 parent having a transform.

---
 spine-ts/spine-webcomponents/example/tutorial.html         | 2 --
 .../spine-webcomponents/src/SpineWebComponentOverlay.ts    | 7 +++++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/spine-ts/spine-webcomponents/example/tutorial.html b/spine-ts/spine-webcomponents/example/tutorial.html
index 56d69bd2e..b8ae49c2b 100644
--- a/spine-ts/spine-webcomponents/example/tutorial.html
+++ b/spine-ts/spine-webcomponents/example/tutorial.html
@@ -2692,8 +2692,6 @@ tank.beforeUpdateWorldTransforms = (delta, skeleton, state) => {
             <div class="split-left" style="overflow-y: auto; width: 100px; height: 200px; transform: translateZ(0);">
                 <spine-overlay
                     overlay-id="scroll"
-                    scrollable
-                    no-auto-parent-transform
                     overflow-top=".2"
                     overflow-bottom=".2"
                     overflow-left=".2"
diff --git a/spine-ts/spine-webcomponents/src/SpineWebComponentOverlay.ts b/spine-ts/spine-webcomponents/src/SpineWebComponentOverlay.ts
index ca89ba90f..56fe8d5a1 100644
--- a/spine-ts/spine-webcomponents/src/SpineWebComponentOverlay.ts
+++ b/spine-ts/spine-webcomponents/src/SpineWebComponentOverlay.ts
@@ -173,6 +173,7 @@ export class SpineWebComponentOverlay extends HTMLElement implements OverlayAttr
 	   * Connected to `appendedToBody` attribute.
 	 */
 	private appendedToBody = true;
+	private hasParentTransform = true;
 
 	readonly time = new TimeKeeper();
 
@@ -271,7 +272,9 @@ export class SpineWebComponentOverlay extends HTMLElement implements OverlayAttr
 		// if they differs call the resizeCallback. I already tested it, and it works. ResizeObserver should be more efficient.
 		if (this.appendedToBody) {
 			// if the element is appendedToBody, the user does not disable translate tweak, and the parent did not have already a transform, add the tweak
-			if (this.appendedToBody && !this.noAutoParentTransform && getComputedStyle(this.parentElement!).transform === "none") {
+			if (this.hasCssTweakOff()) {
+				this.hasParentTransform = false;
+			} else {
 				this.parentElement!.style.transform = `translateZ(0)`;
 			}
 			this.resizeObserver = new ResizeObserver(this.resizedCallback);
@@ -975,7 +978,7 @@ export class SpineWebComponentOverlay extends HTMLElement implements OverlayAttr
 
 			// Ideally this should be the only appendedToBody case (no-auto-parent-transform not enabled or at least an ancestor has transform)
 			// I'd like to get rid of the else case
-			if (!this.noAutoParentTransform) {
+			if (this.hasParentTransform) {
 				scrollPositionX += this.parentElement!.scrollLeft;
 				scrollPositionY += this.parentElement!.scrollTop;
 			} else {