When applying updates to new components nested inside old components, the positioning of the elements inside the new component is broken
I will describe my experience, should be easier to explain :
I have an "old" Adobe XD file, created before the major components update. I have "old" components inside this file.
I have created a new Adobe XD project to use as a component sheet.
I've created new components in the new Adobe XD file. I copied one of them and pasted it inside an old component of the old file.
Back in the new file I've made changes in one of the new components and saved.
Back in the new file, I've updated the imported component and it broke the positioning of the elements inside.
Ro
shared this idea
AdminNina Ramos (Adobe XD)
(Program Manager, Quality, Adobe)
responded
Thanks for the update Ro. Sincerely appreciate you sharing detailed observations.
It sounds like you’ve found a way to make this work for you. Can you confirm? Or do you find your still blocked?
Cheers!
Nina
9 comments
-
Oren
commented
This with Autosave is a disaster
-
Ro
commented
– Add this to my four previous comments –
Position is broken because the instances have been resized and the responsive resize was setting align right instead of align left...
So the broken components are very likely to be caused by copy pasting them from a local component to another one!
Hope it helps, in the meantime you should say the users to avoid doing that and copy pasting from source files instead :)
-
Ro
commented
– Add this to my three previous comments –
I've tested solution C and here is what happened:
Chip button component copy/pasted from another local symbol is broken while chip button component copy pasted from the source isn't.
HOWEVER, the position compared to the local master component is wrong (see attachment).
Maybe there are 2 bugs and not one, hence the difficulty to reproduce it in first place...
-
Ro
commented
– Add this to my two previous comments –
I've added another chip button by copying it from the design system file and pasting it to the master – this new chip button isn't bugged when updating the original component!
Could it be because:
a - the prototype interactions (less likely after this latest experiment)
b- a random bug happening when saving / updating files?
c - a bug happening when copying linked components from a local component and pasting them in another local component?
d - something else... -
Ro
commented
– Add this to my previous comment –
I've attached what's happening if I update the design system file symbol (chip button). The master container component maintain the overrides while the chip buttons inside the instances of it created some time ago are reset...
-
Ro
commented
Hi there I have a little update here, in first place I assumed this was only related to old symbols but it isn't – same bug happened with components from another file inside a local component.
I managed to get you screenshots this time, here is the context:
Important, I call an instance the "children" of a master component – NOT the component version itself (from the panel).
I am working in a cloud sync file, using components from another cloud sync files (design system source file). In the project I'm working on I'm combining local components and imported components – in the example I'm using here I was working on a local container component with several buttons inside, buttons coming from the design system source file. I modified this container component some time ago and placed it wherever it had to be place, none of the buttons you will see have a prototype interaction but others inside this container do but so far they are not bugged, I just can't show too much... When I tried – today – to change the blue button in the master container component, the existing instances of the container component had their blue button text element moved to the left... I've created a new instance of the container component and applied the modifications on the master again and the bug hasn't been triggered which means that the corrupted element has to be the existing instance of the container component (see attachments).
The only difference with the existing instances and the new one that I've created by doing Ctrl+D / Cmd+D might be the solution to find the cause, so far old instances have in some of their elements (buttons) prototype interactions while the new one doesn't...
It's really painful as I have to remove the child component and recreate all the prototype interactions for all the corrupted instances...
-
Bryce Flynn
commented
This sounds somewhat similar to the bugs in components that broke multiple symbols when they auto-updated in my mocks, resulting in hours of additional labor and the pain ain't done yet. Shouldnt have to find workarounds. Until components were 100% compatible with symbols (and they are not) Adobe should have rolled them out whilst preserving symbols.
-
Ro
commented
Well... I didn't have any choice but to delete everything and do it again, I would not call it a solution :)
So I'm not blocked anymore but eventually some users will be, and it will hurt so much when they will have to replace every single element one by one...
-
Ro
commented
Hi, unfortunately I've updated all of them and I can't reproduce it anymore...
I just realised that I've made a mistake in my description – here is the update:
I will describe my experience, should be easier to explain :
I have an "old" Adobe XD file, created before the major components update – Inside I have symbols / "old" components, an header for instance.
Aside, I've created a new Adobe XD project to use as a component sheet / library. I've created new components in this file, a button for instance.
I copied the new component "button" and pasted it inside the old component "header" of the old file.
Back in the new component sheet file, I've made changes on the button and saved.
Back in the old file, I've updated the button component and it broke the position of the rectangle and text inside.
If I remove the button from the header and update, it works fine.
If I create a new header component and paste the button inside, it works fine.
If I created a new component inside the header, paste the button inside this new component and finally destroy the old header component – it's still broken...
Somehow it only happened with "old" symbols and everything that gets inside...
