Repository navigation
Conversation
Vithanco
force-pushed
the
svg-transforms
branch
from
August 29, 2026 09:31
0d11644 to
e449c7c
Compare
Collaborator
|
@Vithanco thanks for addressing this, I think the "fix" is a good idea and the implementation - while definitely a bit wild (eg: could clash with manual transform-box / transform-origin parameters) - is probably good enough for most cases. the PR is currently carrying quite a bit of unrelated history, though. Could you rebase it onto the current main and reduce it to just the relevant transform changes? I also like the idea of Playwright-based in-browser testing, but I’d prefer to introduce that separately after a bit more thought and planning. For this PR, I’d be happy with a small SVG example in the Examples/Basic test app that exercises the different transform modifiers and can be checked manually in a browser. |
Vithanco
force-pushed
the
svg-transforms
branch
2 times, most recently
from
September 2, 2026 03:56
ea1c19b to
754a0a2
Compare
rotationEffect and scaleEffect were wrong on SVG: transform-origin resolves against the viewBox rather than the element and defaults to 0 0, so rotation pivoted on the canvas corner and scaling grew away from it. The anchor's percentage translate assumes an origin already at the centre, so anchored variants were further out still. SVGTransformBoxModifier sets transform-box: fill-box and transform-origin: 50% 50% on elements carrying a transform. offset is left alone - absolute pixels are origin-independent. SVGTransformsView in Examples/Basic draws each modifier over a dashed outline of where the shape started, so the anchor is visible rather than inferred. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Vithanco
force-pushed
the
svg-transforms
branch
from
September 2, 2026 04:40
754a0a2 to
64b020f
Compare
Vithanco
marked this pull request as draft
September 2, 2026 06:35
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
rotationEffect/scaleEffectare wrong in combination with SVG:transform-originresolves against the viewBox rather than the element, so rotation spins around a corner
and scaling grows away from it instead of in place. Anchored variants land off-canvas
entirely. Fixed by setting
transform-box: fill-boxandtransform-origin: 50% 50%.TestDOMonly records the CSS we emit, androtate(45deg)is valid in both namespaces —so Playwright tests check the rendered geometry on all major engines.
Opening early rather than waiting for #119, because this asks for more than a bugfix: a new
CI job and a second browser-automation dependency. Worth your reaction to that before it is
finished.
PerformanceBenchmarkskeeps puppeteer — it drives CDP tracing, which has nocross-engine equivalent.