- Issue created by @jessebaker
- Merge request !1208#3533614 Added work around for Safari issue where iframe content !== srcdoc attribute value → (Open) created by jessebaker
Some kind of race condition that seems to specifically effect Safari/webkit means that despite the srcdoc being set of the preview canvas iframe, the actual content of the iframe doesn't load in resulting in the following seemingly impossible situation in the DOM
<iframe class="_preview_i3030_1" data-test-xb-content-initialized="true" data-xb-iframe="B" data-xb-preview="true"
data-xb-swap-active="true"
scrolling="no" srcdoc="<!DOCTYPE html>
<html dir="ltr" lang="en" style="--color--primary-hue:202;--color--primary-saturation:79%;--color--primary-lightness:50">
<head>
[...trimmed]
</head>
<body class="toolbar-loading user-logged-in path-xb">
<a class="visually-hidden focusable skip-link" href="#main-content">Skip to main content</a>
<div class="dialog-off-canvas-main-canvas" data-off-canvas-main-canvas>
<div class="page-wrapper" id="page-wrapper">
<div id="page">
<header class="site-header" data-drupal-selector="site-header" id="header" role="banner">
[...trimmed]
</header>
<div class="layout-main-wrapper layout-container" id="main-wrapper">
[... trimmed]
</div>
<footer class="site-footer">
[...trimmed]
</footer>
<div class="overlay" data-drupal-selector="overlay"></div>
</div>
</div>
</div>
[...trimmed]
</body>
</html>" style="display: block;" tabindex="-1" title="Preview">
<html style="overflow: hidden; min-height: 768px;">
<head></head>
<body style="min-height: 768px;"></body>
</html>
</iframe>
Note that the srcdoc has a full HTML document but the iframe's content is just an empty head and body tag.
See screen recording for what this looks like in practice.
Perhaps detect the failed iframe initialisation and re-try it.
Active
0.0
Page builder