diff --git a/apps/extension/src/core/domains/metadata/handler.ts b/apps/extension/src/core/domains/metadata/handler.ts
index 375285b4a..7f317cc99 100644
--- a/apps/extension/src/core/domains/metadata/handler.ts
+++ b/apps/extension/src/core/domains/metadata/handler.ts
@@ -2,6 +2,7 @@ import { db } from "@core/db"
 import { RequestMetadataApprove, RequestMetadataReject } from "@core/domains/metadata/types"
 import { ExtensionHandler } from "@core/libs/Handler"
 import { requestStore } from "@core/libs/requests/store"
+import { log } from "@core/log"
 import type { MessageTypes, RequestTypes, ResponseType } from "@core/types"
 import { Port } from "@core/types/base"
 import { assert } from "@polkadot/util"
@@ -10,19 +11,22 @@ import { metadataUpdatesStore } from "./metadataUpdates"
 
 export default class MetadataHandler extends ExtensionHandler {
   private async metadataApprove({ id }: RequestMetadataApprove): Promise<boolean> {
-    const queued = requestStore.getRequest(id)
+    try {
+      const queued = requestStore.getRequest(id)
 
-    assert(queued, "Unable to find request")
+      assert(queued, "Unable to find request")
 
-    const { request, resolve } = queued
+      const { request, resolve } = queued
 
-    // NOTE: If this throws, errors are handled in the UI (we show a nice error message toast to the user)
-    // For more info check out @ui/apps/popup/pages/Metadata.tsx
-    await db.metadata.put(request)
+      await db.metadata.put(request)
 
-    resolve(true)
+      resolve(true)
 
-    return true
+      return true
+    } catch (err) {
+      log.error("Failed to update metadata", { err })
+      throw new Error("Failed to update metadata")
+    }
   }
 
   private metadataReject({ id }: RequestMetadataReject): boolean {
diff --git a/apps/playground/src/components/Substrate/NavSubstrate.tsx b/apps/playground/src/components/Substrate/NavSubstrate.tsx
index 4665c79ff..c4cf0d029 100644
--- a/apps/playground/src/components/Substrate/NavSubstrate.tsx
+++ b/apps/playground/src/components/Substrate/NavSubstrate.tsx
@@ -30,6 +30,12 @@ export const NavSubstrate = () => {
       >
         Encryption
       </Link>
+      <Link
+        to="/substrate/misc"
+        className={classNames(location.pathname === "/substrate/misc" && "text-primary-500")}
+      >
+        Misc
+      </Link>
     </div>
   )
 }
diff --git a/apps/playground/src/components/Substrate/index.tsx b/apps/playground/src/components/Substrate/index.tsx
index b7b55338d..12855e10a 100644
--- a/apps/playground/src/components/Substrate/index.tsx
+++ b/apps/playground/src/components/Substrate/index.tsx
@@ -3,6 +3,7 @@ import { Navigate, Route, Routes } from "react-router-dom"
 import { BalancesPage } from "./balances/BalancesPage"
 import { EncryptionPage } from "./encryption/EncryptionPage"
 import { IdentityPage } from "./identity/IdentityPage"
+import { MiscPage } from "./misc/MiscPage"
 import { NavSubstrate } from "./NavSubstrate"
 import { ApiProvider } from "./shared/useApi"
 import { NetworkProvider } from "./shared/useNetwork"
@@ -27,6 +28,7 @@ export const Substrate = () => {
             <Route path="identity" element={<IdentityPage />} />
             <Route path="sign" element={<SignPage />} />
             <Route path="encryption" element={<EncryptionPage />} />
+            <Route path="Misc" element={<MiscPage />} />
             <Route path="*" element={<Navigate to="identity" />} />
           </Routes>
         </WalletProvider>
diff --git a/apps/playground/src/components/Substrate/misc/InvalidMetadata.tsx b/apps/playground/src/components/Substrate/misc/InvalidMetadata.tsx
new file mode 100644
index 000000000..575d1e868
--- /dev/null
+++ b/apps/playground/src/components/Substrate/misc/InvalidMetadata.tsx
@@ -0,0 +1,21 @@
+import { Button } from "talisman-ui"
+
+import { Section } from "../../shared/Section"
+
+const handleAddInvalidMetadata = () => {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ;(window as any).postMessage({
+    id: "1657056165593.8",
+    message: "pub(metadata.provide)",
+    origin: "talisman-page",
+    request: { origin: "Talisman" },
+  })
+}
+
+export const InvalidMetadata = () => {
+  return (
+    <Section title="Metadata">
+      <Button onClick={handleAddInvalidMetadata}>Invalid Metadata</Button>
+    </Section>
+  )
+}
diff --git a/apps/playground/src/components/Substrate/misc/MiscPage.tsx b/apps/playground/src/components/Substrate/misc/MiscPage.tsx
new file mode 100644
index 000000000..70389cd22
--- /dev/null
+++ b/apps/playground/src/components/Substrate/misc/MiscPage.tsx
@@ -0,0 +1,10 @@
+import { SubstrateLayout } from "../shared/SubstrateLayout"
+import { InvalidMetadata } from "./InvalidMetadata"
+
+export const MiscPage = () => {
+  return (
+    <SubstrateLayout title="Metadata">
+      <InvalidMetadata />
+    </SubstrateLayout>
+  )
+}