Add a block fixtures framework to allow automated checking of block v…

…alidation (#18643) Co-authored-by: Glen Davies <glen.davies@a8c.com>
Automattic · Feb 17, 2021 · 1ee629e · 1ee629e
1 parent 3fa52d0
commit 1ee629e
Show file tree

Hide file tree

Showing 13 changed files with 563 additions and 0 deletions.
diff --git a/...ensions/blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.html b/...ensions/blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.html
@@ -0,0 +1,5 @@
+<!-- wp:jetpack/send-a-message -->
+<div class="wp-block-jetpack-send-a-message"><!-- wp:jetpack/whatsapp-button {"countryCode":"61CX","phoneNumber":"267 8888","firstMessage":"My Message"} -->
+	<div class="wp-block-jetpack-whatsapp-button is-color-dark"><a class="whatsapp-block__button" href="https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message" style="background-color:#25D366;color:#fff" target="_self" rel="noopener noreferrer">Chat on WhatsApp</a></div>
+	<!-- /wp:jetpack/whatsapp-button --></div>
+	<!-- /wp:jetpack/send-a-message -->
diff --git a/...ensions/blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.json b/...ensions/blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.json
@@ -0,0 +1,29 @@
+[
+    {
+        "clientId": "_clientId_0",
+        "name": "jetpack/send-a-message",
+        "isValid": true,
+        "attributes": {},
+        "innerBlocks": [
+            {
+                "clientId": "_clientId_0",
+                "name": "jetpack/whatsapp-button",
+                "isValid": true,
+                "attributes": {
+                    "countryCode": "61CX",
+                    "phoneNumber": "267 8888",
+                    "firstMessage": "My Message",
+                    "buttonText": [
+                        "Chat on WhatsApp"
+                    ],
+                    "backgroundColor": "#25D366",
+                    "colorClass": "dark",
+                    "openInNewTab": false
+                },
+                "innerBlocks": [],
+                "originalContent": "<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;color:#fff\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>"
+            }
+        ],
+        "originalContent": "<div class=\"wp-block-jetpack-send-a-message\"></div>"
+    }
+]
diff --git a/.../blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.parsed.json b/.../blocks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.parsed.json
@@ -0,0 +1,36 @@
+[
+    {
+        "blockName": "jetpack/send-a-message",
+        "attrs": {},
+        "innerBlocks": [
+            {
+                "blockName": "jetpack/whatsapp-button",
+                "attrs": {
+                    "countryCode": "61CX",
+                    "phoneNumber": "267 8888",
+                    "firstMessage": "My Message"
+                },
+                "innerBlocks": [],
+                "innerHTML": "\n\t<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;color:#fff\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>\n\t",
+                "innerContent": [
+                    "\n\t<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;color:#fff\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>\n\t"
+                ]
+            }
+        ],
+        "innerHTML": "\n<div class=\"wp-block-jetpack-send-a-message\"></div>\n\t",
+        "innerContent": [
+            "\n<div class=\"wp-block-jetpack-send-a-message\">",
+            null,
+            "</div>\n\t"
+        ]
+    },
+    {
+        "blockName": null,
+        "attrs": {},
+        "innerBlocks": [],
+        "innerHTML": "\n",
+        "innerContent": [
+            "\n"
+        ]
+    }
+]
diff --git a/...cks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.serialized.html b/...cks/send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button.serialized.html
@@ -0,0 +1,5 @@
+<!-- wp:jetpack/send-a-message -->
+<div class="wp-block-jetpack-send-a-message"><!-- wp:jetpack/whatsapp-button {"countryCode":"61CX","phoneNumber":"267 8888","firstMessage":"My Message"} -->
+<div class="wp-block-jetpack-whatsapp-button is-color-dark"><a class="whatsapp-block__button" href="https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message" style="background-color:#25D366;color:#fff" target="_self" rel="noopener noreferrer">Chat on WhatsApp</a></div>
+<!-- /wp:jetpack/whatsapp-button --></div>
+<!-- /wp:jetpack/send-a-message -->
diff --git a/.../send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.html b/.../send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.html
@@ -0,0 +1,5 @@
+<!-- wp:jetpack/send-a-message -->
+<div class="wp-block-jetpack-send-a-message"><!-- wp:jetpack/whatsapp-button {"countryCode":"61CX","phoneNumber":"267 8888","firstMessage":"My Message"} -->
+	<div class="wp-block-jetpack-whatsapp-button is-color-dark"><a class="whatsapp-block__button" href="https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message" style="background-color:#25D366;" target="_self" rel="noopener noreferrer">Chat on WhatsApp</a></div>
+	<!-- /wp:jetpack/whatsapp-button --></div>
+	<!-- /wp:jetpack/send-a-message -->
diff --git a/.../send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.json b/.../send-a-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.json
@@ -0,0 +1,29 @@
+[
+    {
+        "clientId": "_clientId_0",
+        "name": "jetpack/send-a-message",
+        "isValid": true,
+        "attributes": {},
+        "innerBlocks": [
+            {
+                "clientId": "_clientId_0",
+                "name": "jetpack/whatsapp-button",
+                "isValid": true,
+                "attributes": {
+                    "countryCode": "61CX",
+                    "phoneNumber": "267 8888",
+                    "firstMessage": "My Message",
+                    "buttonText": [
+                        "Chat on WhatsApp"
+                    ],
+                    "backgroundColor": "#25D366",
+                    "colorClass": "dark",
+                    "openInNewTab": false
+                },
+                "innerBlocks": [],
+                "originalContent": "<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>"
+            }
+        ],
+        "originalContent": "<div class=\"wp-block-jetpack-send-a-message\"></div>"
+    }
+]
diff --git a/...-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.parsed.json b/...-message/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.parsed.json
@@ -0,0 +1,36 @@
+[
+    {
+        "blockName": "jetpack/send-a-message",
+        "attrs": {},
+        "innerBlocks": [
+            {
+                "blockName": "jetpack/whatsapp-button",
+                "attrs": {
+                    "countryCode": "61CX",
+                    "phoneNumber": "267 8888",
+                    "firstMessage": "My Message"
+                },
+                "innerBlocks": [],
+                "innerHTML": "\n\t<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>\n\t",
+                "innerContent": [
+                    "\n\t<div class=\"wp-block-jetpack-whatsapp-button is-color-dark\"><a class=\"whatsapp-block__button\" href=\"https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message\" style=\"background-color:#25D366;\" target=\"_self\" rel=\"noopener noreferrer\">Chat on WhatsApp</a></div>\n\t"
+                ]
+            }
+        ],
+        "innerHTML": "\n<div class=\"wp-block-jetpack-send-a-message\"></div>\n\t",
+        "innerContent": [
+            "\n<div class=\"wp-block-jetpack-send-a-message\">",
+            null,
+            "</div>\n\t"
+        ]
+    },
+    {
+        "blockName": null,
+        "attrs": {},
+        "innerBlocks": [],
+        "innerHTML": "\n",
+        "innerContent": [
+            "\n"
+        ]
+    }
+]
diff --git a/...sage/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.serialized.html b/...sage/whatsapp-button/test/fixtures/jetpack__whatsapp-button__deprecated-1.serialized.html
@@ -0,0 +1,5 @@
+<!-- wp:jetpack/send-a-message -->
+<div class="wp-block-jetpack-send-a-message"><!-- wp:jetpack/whatsapp-button {"countryCode":"61CX","phoneNumber":"267 8888","firstMessage":"My Message"} -->
+<div class="wp-block-jetpack-whatsapp-button is-color-dark"><a class="whatsapp-block__button" href="https://api.whatsapp.com/send?phone=612678888&amp;text=My%20Message" style="background-color:#25D366;color:#fff" target="_self" rel="noopener noreferrer">Chat on WhatsApp</a></div>
+<!-- /wp:jetpack/whatsapp-button --></div>
+<!-- /wp:jetpack/send-a-message -->
diff --git a/projects/plugins/jetpack/extensions/blocks/send-a-message/whatsapp-button/test/validate.js b/projects/plugins/jetpack/extensions/blocks/send-a-message/whatsapp-button/test/validate.js
@@ -0,0 +1,15 @@
+/**
+ * Internal dependencies
+ */
+import { settings } from '../';
+import { settings as parentSettings } from '../../';
+import runBlockFixtureTests from '../../../../shared/test/block-fixtures';
+
+// Need to include all the blocks involved in rendering this block.
+// The main block should be the first in the array.
+const blocks = [
+	{ name: 'jetpack/whatsapp-button', settings },
+	{ name: 'jetpack/send-a-message', settings: parentSettings },
+];
+
+runBlockFixtureTests( 'jetpack/whatsapp-button', blocks, __dirname );