fix(html-embed): correct stale iframe height and damp the resize loop
Address the non-test code-review findings on the htmlEmbed sandbox change (test-coverage gaps are tracked in issue #99): - html-embed-view: track the iframe's reported content height even while a fixed height is set, so clearing the height (fixed -> auto) without editing the source no longer leaves the frame pinned to the stale value. Derive the fixed-height predicate once; seed autoHeight to the default. - html-embed-view: drop width/border from the iframe inline style (the .htmlEmbedFrame CSS class already provides them). - html-embed-sandbox: coalesce height reports via requestAnimationFrame and skip <=1px deltas to damp the self-measure feedback loop; fix the misleading bootstrap comment. - tracker-settings: add an aria-label to the snippet Textarea (a11y). - CHANGELOG: note the removal of server-side role-based HTML-embed stripping.
This commit is contained in:
@@ -22,20 +22,42 @@ export function buildSandboxSrcdoc(source: string): string {
|
||||
const bootstrap = `
|
||||
<script>
|
||||
(function () {
|
||||
function reportHeight() {
|
||||
var lastSent = -1;
|
||||
var scheduled = false;
|
||||
function measure() {
|
||||
var doc = document.documentElement;
|
||||
var body = document.body;
|
||||
var height = Math.max(
|
||||
return Math.max(
|
||||
doc ? doc.scrollHeight : 0,
|
||||
body ? body.scrollHeight : 0
|
||||
);
|
||||
}
|
||||
function flush() {
|
||||
scheduled = false;
|
||||
var height = measure();
|
||||
// Only report when the height actually changed by more than 1px. This
|
||||
// damps the iframe self-measure feedback loop: content sized to the iframe
|
||||
// viewport would otherwise oscillate as the parent resizes the frame in
|
||||
// response to each report.
|
||||
if (Math.abs(height - lastSent) <= 1) return;
|
||||
lastSent = height;
|
||||
parent.postMessage(
|
||||
{ type: ${JSON.stringify(HTML_EMBED_HEIGHT_MESSAGE)}, height: height },
|
||||
"*"
|
||||
);
|
||||
}
|
||||
function reportHeight() {
|
||||
if (scheduled) return;
|
||||
scheduled = true;
|
||||
if (typeof requestAnimationFrame === "function") {
|
||||
requestAnimationFrame(flush);
|
||||
} else {
|
||||
flush();
|
||||
}
|
||||
}
|
||||
window.addEventListener("load", reportHeight);
|
||||
// Report immediately too, in case load already fired.
|
||||
// Report an initial height now (runs during parse, before load/images
|
||||
// settle); the load handler and ResizeObserver refine it as content changes.
|
||||
reportHeight();
|
||||
if (typeof ResizeObserver !== "undefined") {
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user