diff --git a/src/routes/tutorial/[slug]/Output.svelte b/src/routes/tutorial/[slug]/Output.svelte
index f5913adab..050448961 100644
--- a/src/routes/tutorial/[slug]/Output.svelte
+++ b/src/routes/tutorial/[slug]/Output.svelte
@@ -74,6 +74,12 @@
function set_iframe_src(src) {
if (!iframe) return; // HMR
+ // To prevent iframe flickering.
+ // Set to `visible` by calling `set_iframe_visible` function
+ // from iframe on:load or setTimeout
+ iframe.style.visibility = 'hidden';
+ setTimeout(set_iframe_visible, 1000);
+
// removing the iframe from the document allows us to
// change the src without adding a history entry, which
// would make back/forward traversal very annoying
@@ -82,6 +88,12 @@
iframe.src = src;
parentNode?.appendChild(iframe);
}
+
+ function set_iframe_visible() {
+ if (iframe.style.visibility === 'hidden') {
+ iframe.style.visibility = 'visible';
+ }
+ }