Stop iframe from killing Vue in Safari (#3978)

statamic · Jul 19, 2021 · b52e338 · b52e338
1 parent 88e1939
commit b52e338
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/resources/js/components/fieldtypes/VideoFieldtype.vue b/resources/js/components/fieldtypes/VideoFieldtype.vue
@@ -17,7 +17,7 @@
 
         <div class="video-preview-wrapper" v-if="isEmbeddable || isVideo">
             <div class="video-preview">
-                <iframe v-if="isEmbeddable" width="560" height="315" :src="embed" frameborder="0"></iframe>
+                <iframe v-if="isEmbeddable && canShowIframe" width="560" height="315" :src="embed" frameborder="0" allow="fullscreen"></iframe>
                 <video controls v-if="isVideo" :src="embed" width="560" height="315"></video>
             </div>
         </div>
@@ -31,7 +31,8 @@ export default {
 
     data() {
         return {
-            data: this.value || ''
+            data: this.value || '',
+            canShowIframe: false,
         }
     },
 
@@ -47,6 +48,11 @@ export default {
 
     },
 
+    mounted() {
+        // Showing the iframe right away causes Vue to stop in Safari.
+        this.canShowIframe = true;
+    },
+
     computed: {
         embed() {
             if (this.data.includes('youtube')) {