Load assets inside preview <iframe> when components are added

Clarifying issue title.

Unassigning Ben because #3462441-6: Contextual form values need to be integrated with Redux → is more important.

The MR I pushed has this working - maybe there's a slicker way but this is what I figured out. It will need tests either way but I'm needed elsewhere for a bit so leaving this unassigned in case someone wants to add those.

@jessebaker, didn't you intentionally use inline styles for the my-hero and my-section components in 📌 Add some basic example SDCs Fixed ? Objections to changing that?

I only used inline styles specifically because it wasn't yet possible to load in assets (JS/CSS) when adding a new component but I still wanted them to look nice. This work adds the ability to load in CSS so, yes, get rid of those in-line styles!

YAY! 😄 I'd swear I read something you wrote along the lines of "component with inline styles to verify that works correctly, too" — but my memory must be fooling me then!

@bnjmnm Is this ready to be converted into an MR?

Yay, MR exists! 😄

Looks like this

It does look slightly different because the hero component intentionally had vh styling to confirm a specific fix for vh-in-iframe worked.

But! That fix only works on inline styles, which are no longer being used. An issue has been opened for that 🐛 VH units fix only works for inline styles Active
and in the meantime I prefer the less huge hero elements - easier to manually test things.

....

Also added an assertion in xb-general that confirms the SDC css loads in the iframe.

Looks great, just one question about what these "non-components" are 😅

Also: END-TO-END CYPRESS TEST!!!!!!! 🥳

@bnjmnm clarified: "non-components" is currently only root (the client equivalent of \Drupal\experience_builder\Plugin\DataType\ComponentTreeStructure::ROOT_UUID on the server), but it may be non-SDC components once 🌱 [META] Support component types other than SDC Needs work lands. 👍

oh d.o 🤪

Automatically closed - issue fixed for 2 weeks with no activity.