fix: Boolean/number props not getting parsed correctly

packages/core/src/extensions/Blocks/api/block.ts

@@ -38,7 +38,39 @@ export function propsToAttributes<
       // Props are displayed in kebab-case as HTML attributes. If a prop's
       // value is the same as its default, we don't display an HTML
       // attribute for it.
-      parseHTML: (element) => element.getAttribute(camelToDataKebab(name)),
+      parseHTML: (element) => {
+        const value = element.getAttribute(camelToDataKebab(name));
+
+        if (value === null) {
+          return null;
+        }
+
+        if (typeof spec.default === "boolean") {
+          if (value === "true") {
+            return true;
+          }
+
+          if (value === "false") {
+            return false;
+          }
+
+          return null;
+        }
+
+        if (typeof spec.default === "number") {
+          const asNumber = parseFloat(value);
+          const isNumeric =
+            !Number.isNaN(asNumber) && Number.isFinite(asNumber);
+
+          if (isNumeric) {
+            return asNumber;
+          }
+
+          return null;
+        }
+
+        return value;
+      },
       renderHTML: (attributes) =>
         attributes[name] !== spec.default
           ? {

tests/end-to-end/copypaste/copypaste.test.ts

@@ -9,6 +9,7 @@ import {
   insertNestedListItems,
   insertParagraph,
 } from "../../utils/copypaste";
+import { executeSlashCommand } from "../../utils/slashmenu";
 
 test.describe.configure({ mode: "serial" });
 
@@ -135,4 +136,59 @@ test.describe("Check Copy/Paste Functionality", () => {
 
     await compareDocToSnapshot(page, "nestedOrderedLists.json");
   });
+
+  test("Images should keep props", async ({ page, browserName }) => {
+    test.skip(
+      browserName === "firefox" || browserName === "webkit",
+      "Firefox doesn't yet support the async clipboard API. Webkit copy/paste stopped working after updating to Playwright 1.33."
+    );
+
+    await focusOnEditor(page);
+    await page.keyboard.type("paragraph");
+
+    const IMAGE_EMBED_URL =
+      "https://www.pulsecarshalton.co.uk/wp-content/uploads/2016/08/jk-placeholder-image.jpg";
+    await executeSlashCommand(page, "image");
+
+    await page.click(`[data-test="embed-tab"]`);
+    await page.click(`[data-test="embed-input"]`);
+    await page.keyboard.type(IMAGE_EMBED_URL);
+    await page.click(`[data-test="embed-input-button"]`);
+    await page.waitForSelector(`img[src="${IMAGE_EMBED_URL}"]`);
+
+    await page.click(`img`);
+
+    await page.waitForSelector(`[class*="resizeHandle"][style*="right"]`);
+    const resizeHandle = page.locator(
+      `[class*="resizeHandle"][style*="right"]`
+    );
+    const resizeHandleBoundingBox = await resizeHandle.boundingBox();
+    await page.mouse.move(
+      resizeHandleBoundingBox.x + resizeHandleBoundingBox.width / 2,
+      resizeHandleBoundingBox.y + resizeHandleBoundingBox.height / 2,
+      {
+        steps: 5,
+      }
+    );
+    await page.mouse.down();
+
+    await page.mouse.move(
+      resizeHandleBoundingBox.x + resizeHandleBoundingBox.width / 2 - 50,
+      resizeHandleBoundingBox.y + resizeHandleBoundingBox.height / 2,
+      {
+        steps: 5,
+      }
+    );
+
+    await page.mouse.up();
+
+    await page.click(`img`);
+    await page.keyboard.press("ArrowDown");
+    await page.pause();
+
+    await copyPasteAll(page);
+    await page.pause();
+
+    await compareDocToSnapshot(page, "images.json");
+  });
 });

tests/end-to-end/copypaste/copypaste.test.ts-snapshots/images-json-chromium-linux.json

@@ -0,0 +1,126 @@
+{
+  "type": "doc",
+  "content": [
+    {
+      "type": "blockGroup",
+      "content": [
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "0",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "paragraph",
+              "attrs": {
+                "textAlignment": "left"
+              },
+              "content": [
+                {
+                  "type": "text",
+                  "text": "paragraph"
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "2",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "image",
+              "attrs": {
+                "textAlignment": "left",
+                "backgroundColor": "default",
+                "url": "https://www.pulsecarshalton.co.uk/wp-content/uploads/2016/08/jk-placeholder-image.jpg",
+                "caption": "",
+                "width": 462
+              }
+            }
+          ]
+        },
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "1",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "paragraph",
+              "attrs": {
+                "textAlignment": "left"
+              }
+            }
+          ]
+        },
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "4",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "paragraph",
+              "attrs": {
+                "textAlignment": "left"
+              },
+              "content": [
+                {
+                  "type": "text",
+                  "text": "paragraph"
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "5",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "image",
+              "attrs": {
+                "textAlignment": "left",
+                "backgroundColor": "default",
+                "url": "https://www.pulsecarshalton.co.uk/wp-content/uploads/2016/08/jk-placeholder-image.jpg",
+                "caption": "",
+                "width": 462
+              }
+            }
+          ]
+        },
+        {
+          "type": "blockContainer",
+          "attrs": {
+            "id": "6",
+            "textColor": "default",
+            "backgroundColor": "default"
+          },
+          "content": [
+            {
+              "type": "paragraph",
+              "attrs": {
+                "textAlignment": "left"
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}