[view-transitions] Computed transform for captured elements with 3d t…

…ransforms is incorrect

https://bugs.webkit.org/show_bug.cgi?id=270428
<rdar://123984960>

Reviewed by Tim Nguyen.

This reverses the order that the matrices are concatenated when walking
ancestors. It also applies the inverse of the changes that will be applied
for transform-origin, since the computed transform already takes that into
account.

* LayoutTests/TestExpectations:
* Source/WebCore/dom/ViewTransition.cpp:
(WebCore::ViewTransition::captureOldState):
(WebCore::ViewTransition::copyElementBaseProperties):
(WebCore::ViewTransition::updatePseudoElementStyles):
* Source/WebCore/dom/ViewTransition.h:
* Source/WebCore/rendering/RenderLayerCompositor.cpp:
(WebCore::RenderLayerCompositor::collectViewTransitionNewContentLayers):

Canonical link: https://commits.webkit.org/275810@main

LayoutTests/TestExpectations

@@ -6877,8 +6877,6 @@ imported/w3c/web-platform-tests/navigation-api/updateCurrentEntry-method/locatio
 
 # -- View Transitions -- #
 # Reftest failures:
-imported/w3c/web-platform-tests/css/css-view-transitions/3d-transform-incoming.html [ ImageOnlyFailure ]
-imported/w3c/web-platform-tests/css/css-view-transitions/3d-transform-outgoing.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-view-transitions/capture-with-offscreen-child-translated.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-view-transitions/capture-with-visibility-mixed-descendants.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-view-transitions/content-with-child-with-transparent-background.html [ ImageOnlyFailure ]

Source/WebCore/dom/ViewTransition.cpp

@@ -356,7 +356,7 @@ ExceptionOr<void> ViewTransition::captureOldState()
         CheckedPtr renderBox = dynamicDowncast<RenderBox>(element->renderer());
         if (renderBox)
             capture.oldSize = renderBox->size();
-        capture.oldProperties = copyElementBaseProperties(element);
+        capture.oldProperties = copyElementBaseProperties(element, capture.oldSize);
         if (m_document->frame())
             capture.oldImage = snapshotNodeVisualOverflowClippedToViewport(*m_document->frame(), element.get(), capture.oldOverflowRect);
 
@@ -571,7 +571,7 @@ void ViewTransition::clearViewTransition()
         documentElement->invalidateStyleInternal();
 }
 
-Ref<MutableStyleProperties> ViewTransition::copyElementBaseProperties(Element& element)
+Ref<MutableStyleProperties> ViewTransition::copyElementBaseProperties(Element& element, const LayoutSize& size)
 {
     ComputedStyleExtractor styleExtractor(&element);
 
@@ -599,10 +599,14 @@ Ref<MutableStyleProperties> ViewTransition::copyElementBaseProperties(Element& e
             break;
         LayoutSize containerOffset = renderer->offsetFromContainer(*container, LayoutPoint());
         TransformationMatrix localTransform;
-        renderer->getTransformFromContainer(nullptr, containerOffset, localTransform);
-        transform.multiply(localTransform);
+        renderer->getTransformFromContainer(container, containerOffset, localTransform);
+        transform = localTransform * transform;
         renderer = container;
     }
+    // Apply the inverse of what will be added by the default value of 'transform-origin',
+    // since the computed transform has already included it.
+    transform.translate(size.width() / 2, size.height() / 2);
+    transform.translateRight(-size.width() / 2, -size.height() / 2);
 
     if (element.renderer()) {
         Ref<CSSValue> transformListValue = CSSTransformListValue::create(ComputedStyleExtractor::matrixTransformValue(transform, element.renderer()->style()));
@@ -620,9 +624,10 @@ void ViewTransition::updatePseudoElementStyles()
 
     for (auto& [name, capturedElement] : m_namedElements.map()) {
         RefPtr<MutableStyleProperties> properties;
-        if (capturedElement->newElement)
-            properties = copyElementBaseProperties(*capturedElement->newElement);
-        else
+        if (capturedElement->newElement) {
+            CheckedPtr renderBox = dynamicDowncast<RenderBox>(capturedElement->newElement->renderer());
+            properties = copyElementBaseProperties(*capturedElement->newElement, renderBox ? renderBox->size() : LayoutSize { });
+        } else
             properties = capturedElement->oldProperties;
 
         if (properties) {

Source/WebCore/dom/ViewTransition.h

@@ -148,7 +148,7 @@ class ViewTransition : public RefCounted<ViewTransition>, public CanMakeWeakPtr<
 private:
     ViewTransition(Document&, RefPtr<ViewTransitionUpdateCallback>&&);
 
-    Ref<MutableStyleProperties> copyElementBaseProperties(Element&);
+    Ref<MutableStyleProperties> copyElementBaseProperties(Element&, const LayoutSize&);
 
     void updatePseudoElementStyles();
     void setupDynamicStyleSheet(const AtomString&, const CapturedElement&);

Source/WebCore/rendering/RenderLayerCompositor.cpp

@@ -1402,7 +1402,7 @@ void RenderLayerCompositor::traverseUnchangedSubtree(RenderLayer* ancestorLayer,
 
 void RenderLayerCompositor::collectViewTransitionNewContentLayers(RenderLayer& layer, Vector<Ref<GraphicsLayer>>& childList)
 {
-    if (layer.renderer().style().pseudoElementType() != PseudoId::ViewTransitionNew)
+    if (layer.renderer().style().pseudoElementType() != PseudoId::ViewTransitionNew || !layer.hasVisibleContent())
         return;
 
     RefPtr activeViewTransition = layer.renderer().document().activeViewTransition();