Gutenberg: Handle cases where core/video block might not include a …

…`<video>`
statamic · Oct 28, 2024 · 8ef8a00 · 8ef8a00
1 parent 939b926
commit 8ef8a00
Show file tree

Hide file tree

Showing 2 changed files with 67 additions and 0 deletions.
diff --git a/src/WordPress/Gutenberg.php b/src/WordPress/Gutenberg.php
@@ -174,6 +174,31 @@ public static function toBard(array $config, Blueprint $blueprint, Field $field,
 
                     $crawler = new Crawler($block['innerHTML']);
 
+                    // When there's no <video> element, let's embed it using the HTML set.
+                    if ($crawler->filter('video')->count() === 0) {
+                        static::ensureBardSet($blueprint, $field, 'html', [
+                            'display' => __('HTML'),
+                            'icon' => 'programming-script-code-brackets',
+                            'fields' => [
+                                ['handle' => 'html', 'field' => ['type' => 'code', 'display' => __('HTML')]],
+                            ],
+                        ]);
+
+                        return [
+                            'type' => 'set',
+                            'attrs' => [
+                                'id' => Str::random(8),
+                                'values' => [
+                                    'type' => 'html',
+                                    'html' => [
+                                        'code' => $block['innerHTML'],
+                                        'mode' => 'htmlmixed',
+                                    ],
+                                ],
+                            ],
+                        ];
+                    }
+
                     return [
                         'type' => 'set',
                         'attrs' => [

diff --git a/tests/WordPress/GutenbergTest.php b/tests/WordPress/GutenbergTest.php
@@ -502,6 +502,48 @@ public function it_transforms_video_block()
         ], $output);
     }
 
+    #[Test]
+    public function it_transforms_video_block_into_html_embed_when_no_video_element_is_present()
+    {
+        Str::createRandomStringsUsing(fn () => 'fakeSetId');
+
+        $output = Gutenberg::toBard(
+            config: [],
+            blueprint: $this->blueprint,
+            field: $this->blueprint->field('content'),
+            value: <<<'HTML'
+<!-- wp:video {"guid":"9OB1qME8","id":1420,"src":"https://videos.files.wordpress.com/12345abc/2_mp4_hd.mp4","videoPressClassNames":"wp-block-embed is-type-video is-provider-videopress wp-embed-aspect-9-16 wp-has-aspect-ratio"} -->
+<figure class="wp-block-video wp-block-embed is-type-video is-provider-videopress wp-embed-aspect-9-16 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
+https://videopress.com/v/12345abc?preloadContent=metadata
+</div></figure>
+<!-- /wp:video -->
+HTML
+        );
+
+        $blueprint = Blueprint::find('collections.posts.post');
+        $this->assertSetExists('video', $blueprint->field('content'));
+
+        $this->assertEquals([
+            [
+                'type' => 'set',
+                'attrs' => [
+                    'id' => 'fakeSetId',
+                    'values' => [
+                        'type' => 'html',
+                        'html' => [
+                            'code' => '
+<figure class="wp-block-video wp-block-embed is-type-video is-provider-videopress wp-embed-aspect-9-16 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
+https://videopress.com/v/12345abc?preloadContent=metadata
+</div></figure>
+',
+                            'mode' => 'htmlmixed',
+                        ],
+                    ],
+                ],
+            ],
+        ], $output);
+    }
+
     #[Test]
     public function it_transforms_embed_block_with_video_from_youtube()
     {