Use iframes to render preview snapshots #1023
Merged
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.
Proposed changes
At the moment, in the previews step, we do the following to generate the snapshots:
The reason we're doing the above rather than just rendering the iframes to begin with... we had very problematic patterns that used
dvhvalues to set the height of certain elements, in the iframe, these elements were huge no matter what we did to scale down the design, because their height was being set according the window screen size rather than the iframe container.With the migration to sitekits, i've reviewed all of our sitekits and none of them seem to be using patterns that use this kind of styling. So it's safe to say now we can just use iframes immediately to render the preview snapshots.
Additionally, we need set some sort of a standard or requirement to never do this when designing patters for the AI service. I'll defer to @zlateska for that.
This PR does 2 things:
Another side benefit of doing this is the generation times will go down 4s-8s which the avg time it takes to crawl and take screenshots of the generated sites.
Also fixing this bug: https://newfold.atlassian.net/browse/PRESS0-3811
Type of Change
Production
Development
Visual
Checklist
Further comments