From 95ca4ec581edccf9775a0922451cafc069b90281 Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Thu, 20 Oct 2022 16:13:10 +0100
Subject: [PATCH 1/2] Embed: Add deprecation for the caption element

---
 .../block-library/src/embed/deprecated.js     | 77 ++++++++++++-------
 1 file changed, 51 insertions(+), 26 deletions(-)

diff --git a/packages/block-library/src/embed/deprecated.js b/packages/block-library/src/embed/deprecated.js
index 7673943c70e6a1..90e72eb7b65a93 100644
--- a/packages/block-library/src/embed/deprecated.js
+++ b/packages/block-library/src/embed/deprecated.js
@@ -11,36 +11,61 @@ import metadata from './block.json';
 /**
  * WordPress dependencies
  */
-import { RichText } from '@wordpress/block-editor';
+import { RichText, useBlockProps } from '@wordpress/block-editor';
 
 const { attributes: blockAttributes } = metadata;
 
-const deprecated = [
-	{
-		attributes: blockAttributes,
-		save( { attributes: { url, caption, type, providerNameSlug } } ) {
-			if ( ! url ) {
-				return null;
-			}
-
-			const embedClassName = classnames( 'wp-block-embed', {
-				[ `is-type-${ type }` ]: type,
-				[ `is-provider-${ providerNameSlug }` ]: providerNameSlug,
-			} );
-
-			return (
-				<figure className={ embedClassName }>
+const v2 = {
+	attributes: blockAttributes,
+	save( { attributes } ) {
+		const { url, caption, type, providerNameSlug } = attributes;
+
+		if ( ! url ) {
+			return null;
+		}
+
+		const className = classnames( 'wp-block-embed', {
+			[ `is-type-${ type }` ]: type,
+			[ `is-provider-${ providerNameSlug }` ]: providerNameSlug,
+			[ `wp-block-embed-${ providerNameSlug }` ]: providerNameSlug,
+		} );
+
+		return (
+			<figure { ...useBlockProps.save( { className } ) }>
+				<div className="wp-block-embed__wrapper">
 					{ `\n${ url }\n` /* URL needs to be on its own line. */ }
-					{ ! RichText.isEmpty( caption ) && (
-						<RichText.Content
-							tagName="figcaption"
-							value={ caption }
-						/>
-					) }
-				</figure>
-			);
-		},
+				</div>
+				{ ! RichText.isEmpty( caption ) && (
+					<RichText.Content tagName="figcaption" value={ caption } />
+				) }
+			</figure>
+		);
+	},
+};
+
+const v1 = {
+	attributes: blockAttributes,
+	save( { attributes: { url, caption, type, providerNameSlug } } ) {
+		if ( ! url ) {
+			return null;
+		}
+
+		const embedClassName = classnames( 'wp-block-embed', {
+			[ `is-type-${ type }` ]: type,
+			[ `is-provider-${ providerNameSlug }` ]: providerNameSlug,
+		} );
+
+		return (
+			<figure className={ embedClassName }>
+				{ `\n${ url }\n` /* URL needs to be on its own line. */ }
+				{ ! RichText.isEmpty( caption ) && (
+					<RichText.Content tagName="figcaption" value={ caption } />
+				) }
+			</figure>
+		);
 	},
-];
+};
+
+const deprecated = [ v2, v1 ];
 
 export default deprecated;

From bcb54c1e43b8ddced8902482a0efdc1ed9de0782 Mon Sep 17 00:00:00 2001
From: Glen Davies <glen.davies@automattic.com>
Date: Fri, 21 Oct 2022 12:17:52 +1300
Subject: [PATCH 2/2] Add fixtures for new deprecation, as well as for the
 original deprecation

---
 packages/block-library/src/embed/deprecated.js     |  2 ++
 .../fixtures/blocks/core__embed__deprecated-1.html |  6 ++++++
 .../fixtures/blocks/core__embed__deprecated-1.json | 14 ++++++++++++++
 .../blocks/core__embed__deprecated-1.parsed.json   | 13 +++++++++++++
 .../core__embed__deprecated-1.serialized.html      |  5 +++++
 .../fixtures/blocks/core__embed__deprecated-2.html |  8 ++++++++
 .../fixtures/blocks/core__embed__deprecated-2.json | 14 ++++++++++++++
 .../blocks/core__embed__deprecated-2.parsed.json   | 13 +++++++++++++
 .../core__embed__deprecated-2.serialized.html      |  5 +++++
 9 files changed, 80 insertions(+)
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-1.html
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-1.json
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-1.parsed.json
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-1.serialized.html
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-2.html
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-2.json
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-2.parsed.json
 create mode 100644 test/integration/fixtures/blocks/core__embed__deprecated-2.serialized.html

diff --git a/packages/block-library/src/embed/deprecated.js b/packages/block-library/src/embed/deprecated.js
index 90e72eb7b65a93..afa691ecb64e2c 100644
--- a/packages/block-library/src/embed/deprecated.js
+++ b/packages/block-library/src/embed/deprecated.js
@@ -15,6 +15,8 @@ import { RichText, useBlockProps } from '@wordpress/block-editor';
 
 const { attributes: blockAttributes } = metadata;
 
+// In #41140 support was added to global styles for caption elements which added a `wp-element-caption` classname
+// to the embed figcaption element.
 const v2 = {
 	attributes: blockAttributes,
 	save( { attributes } ) {
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-1.html b/test/integration/fixtures/blocks/core__embed__deprecated-1.html
new file mode 100644
index 00000000000000..3996ecd6425b11
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-1.html
@@ -0,0 +1,6 @@
+<!-- wp:embed {"url":"https://example.com/"} -->
+<figure class="wp-block-embed">
+    https://example.com/
+    <figcaption>Embedded content from an example URL</figcaption>
+</figure>
+<!-- /wp:embed -->
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-1.json b/test/integration/fixtures/blocks/core__embed__deprecated-1.json
new file mode 100644
index 00000000000000..dfc2b215684c26
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-1.json
@@ -0,0 +1,14 @@
+[
+	{
+		"name": "core/embed",
+		"isValid": true,
+		"attributes": {
+			"url": "https://example.com/",
+			"caption": "Embedded content from an example URL",
+			"allowResponsive": true,
+			"responsive": false,
+			"previewable": true
+		},
+		"innerBlocks": []
+	}
+]
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-1.parsed.json b/test/integration/fixtures/blocks/core__embed__deprecated-1.parsed.json
new file mode 100644
index 00000000000000..3149ce776fc777
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-1.parsed.json
@@ -0,0 +1,13 @@
+[
+	{
+		"blockName": "core/embed",
+		"attrs": {
+			"url": "https://example.com/"
+		},
+		"innerBlocks": [],
+		"innerHTML": "\n<figure class=\"wp-block-embed\">\n    https://example.com/\n    <figcaption>Embedded content from an example URL</figcaption>\n</figure>\n",
+		"innerContent": [
+			"\n<figure class=\"wp-block-embed\">\n    https://example.com/\n    <figcaption>Embedded content from an example URL</figcaption>\n</figure>\n"
+		]
+	}
+]
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-1.serialized.html b/test/integration/fixtures/blocks/core__embed__deprecated-1.serialized.html
new file mode 100644
index 00000000000000..af25e3c4acb671
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-1.serialized.html
@@ -0,0 +1,5 @@
+<!-- wp:embed {"url":"https://example.com/"} -->
+<figure class="wp-block-embed"><div class="wp-block-embed__wrapper">
+https://example.com/
+</div><figcaption class="wp-element-caption">Embedded content from an example URL</figcaption></figure>
+<!-- /wp:embed -->
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-2.html b/test/integration/fixtures/blocks/core__embed__deprecated-2.html
new file mode 100644
index 00000000000000..f9a539f22a0c95
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-2.html
@@ -0,0 +1,8 @@
+<!-- wp:embed {"url":"https://example.com/"} -->
+<figure class="wp-block-embed">
+    <div class="wp-block-embed__wrapper">
+        https://example.com/
+    </div>
+    <figcaption>Embedded content from an example URL</figcaption>
+</figure>
+<!-- /wp:embed -->
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-2.json b/test/integration/fixtures/blocks/core__embed__deprecated-2.json
new file mode 100644
index 00000000000000..dfc2b215684c26
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-2.json
@@ -0,0 +1,14 @@
+[
+	{
+		"name": "core/embed",
+		"isValid": true,
+		"attributes": {
+			"url": "https://example.com/",
+			"caption": "Embedded content from an example URL",
+			"allowResponsive": true,
+			"responsive": false,
+			"previewable": true
+		},
+		"innerBlocks": []
+	}
+]
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-2.parsed.json b/test/integration/fixtures/blocks/core__embed__deprecated-2.parsed.json
new file mode 100644
index 00000000000000..e5eb6716d2e732
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-2.parsed.json
@@ -0,0 +1,13 @@
+[
+	{
+		"blockName": "core/embed",
+		"attrs": {
+			"url": "https://example.com/"
+		},
+		"innerBlocks": [],
+		"innerHTML": "\n<figure class=\"wp-block-embed\">\n    <div class=\"wp-block-embed__wrapper\">\n        https://example.com/\n    </div>\n    <figcaption>Embedded content from an example URL</figcaption>\n</figure>\n",
+		"innerContent": [
+			"\n<figure class=\"wp-block-embed\">\n    <div class=\"wp-block-embed__wrapper\">\n        https://example.com/\n    </div>\n    <figcaption>Embedded content from an example URL</figcaption>\n</figure>\n"
+		]
+	}
+]
diff --git a/test/integration/fixtures/blocks/core__embed__deprecated-2.serialized.html b/test/integration/fixtures/blocks/core__embed__deprecated-2.serialized.html
new file mode 100644
index 00000000000000..af25e3c4acb671
--- /dev/null
+++ b/test/integration/fixtures/blocks/core__embed__deprecated-2.serialized.html
@@ -0,0 +1,5 @@
+<!-- wp:embed {"url":"https://example.com/"} -->
+<figure class="wp-block-embed"><div class="wp-block-embed__wrapper">
+https://example.com/
+</div><figcaption class="wp-element-caption">Embedded content from an example URL</figcaption></figure>
+<!-- /wp:embed -->