diff --git a/bindings/wasm/docs/api-reference.md b/bindings/wasm/docs/api-reference.md
index 84ebb8eb0c..94ce0f3385 100644
--- a/bindings/wasm/docs/api-reference.md
+++ b/bindings/wasm/docs/api-reference.md
@@ -1414,7 +1414,7 @@ E.g. https://explorer.iota.org/mainnet/identity-resolver/{did}
 
 | Param | Type |
 | --- | --- |
-| did | <code>string</code> | 
+| did | [<code>DID</code>](#DID) \| <code>string</code> | 
 
 <a name="ExplorerUrl+toString"></a>
 
diff --git a/bindings/wasm/examples/src/create_did.js b/bindings/wasm/examples/src/create_did.js
index c127d2e05a..ad71b2f2bf 100644
--- a/bindings/wasm/examples/src/create_did.js
+++ b/bindings/wasm/examples/src/create_did.js
@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import {Client, Config, Document, KeyPair, KeyType} from '@iota/identity-wasm';
-import {logExplorerUrl, logResolverUrl} from './utils';
 
 /**
  This example shows a basic introduction on how to create a basic DID Document and upload it to the Tangle.
@@ -32,8 +31,8 @@ async function createIdentity(clientConfig) {
     const receipt = await client.publishDocument(doc);
 
     // Log the results.
-    logExplorerUrl("DID Document Transaction:", clientConfig.explorer, receipt.messageId);
-    logResolverUrl("Explore the DID Document:", clientConfig.explorer, doc.id.toString());
+    console.log(`DID Document Transaction: ${clientConfig.explorer.messageUrl(receipt.messageId)}`);
+    console.log(`Explore the DID Document: ${clientConfig.explorer.resolverUrl(doc.id)}`);
 
     // Return the results.
     return {key, doc, receipt};
diff --git a/bindings/wasm/examples/src/diff_chain.js b/bindings/wasm/examples/src/diff_chain.js
index e25973b224..954d80748d 100644
--- a/bindings/wasm/examples/src/diff_chain.js
+++ b/bindings/wasm/examples/src/diff_chain.js
@@ -3,7 +3,6 @@
 
 import {Client, Config, Document, Service, Timestamp} from '@iota/identity-wasm';
 import {createIdentity} from "./create_did";
-import {logExplorerUrl, logResolverUrl} from "./utils";
 
 /**
  This example is a basic introduction to creating a diff message and publishing it to the tangle.
@@ -44,8 +43,8 @@ async function createDiff(clientConfig) {
     // Publish diff to the Tangle
     const diffReceipt = await client.publishDiff(receipt.messageId, diff);
     console.log(diffReceipt);
-    logExplorerUrl("Diff Chain Transaction:", clientConfig.explorer, diffReceipt.messageId);
-    logResolverUrl("Explore the DID Document:", clientConfig.explorer, doc.id.toString());
+    console.log(`Diff Chain Transaction: ${clientConfig.explorer.messageUrl(diffReceipt.messageId)}`);
+    console.log(`Explore the DID Document: ${clientConfig.explorer.resolverUrl(doc.id)}`);
 
     return {updatedDoc, key, diffMessageId: diffReceipt.messageId};
 }
diff --git a/bindings/wasm/examples/src/index.html b/bindings/wasm/examples/src/index.html
index d63620ad1b..b379ad2f52 100644
--- a/bindings/wasm/examples/src/index.html
+++ b/bindings/wasm/examples/src/index.html
@@ -71,6 +71,6 @@
         </button>
 
         <h4 class="ma-md">Output:</h4>
-        <div id="content" class="content"></div>
+        <pre id="content" class="content"></pre>
     </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/bindings/wasm/examples/src/manipulate_did.js b/bindings/wasm/examples/src/manipulate_did.js
index e215ee87f2..39c71bc46a 100644
--- a/bindings/wasm/examples/src/manipulate_did.js
+++ b/bindings/wasm/examples/src/manipulate_did.js
@@ -12,7 +12,6 @@ import {
     VerificationMethod
 } from '@iota/identity-wasm';
 import {createIdentity} from "./create_did";
-import {logExplorerUrl, logResolverUrl} from "./utils";
 
 /**
  This example shows how to add more to an existing DID Document.
@@ -63,8 +62,9 @@ async function manipulateIdentity(clientConfig) {
     const updateReceipt = await client.publishDocument(doc);
 
     // Log the results.
-    logExplorerUrl("DID Document Update Transaction:", clientConfig.explorer, updateReceipt.messageId);
-    logResolverUrl("Explore the DID Document:", clientConfig.explorer, doc.id.toString());
+    console.log(`DID Document Update Transaction: ${clientConfig.explorer.messageUrl(updateReceipt.messageId)}`);
+    console.log(`Explore the DID Document: ${clientConfig.explorer.resolverUrl(doc.id)}`);
+
     return {
         key,
         newKey,
diff --git a/bindings/wasm/examples/src/merkle_key.js b/bindings/wasm/examples/src/merkle_key.js
index d82ca01d3b..048dac522e 100644
--- a/bindings/wasm/examples/src/merkle_key.js
+++ b/bindings/wasm/examples/src/merkle_key.js
@@ -15,7 +15,6 @@ import {
     VerifierOptions
 } from '@iota/identity-wasm';
 import {createIdentity} from './create_did';
-import {logExplorerUrl} from './utils';
 
 /**
  This example shows how to sign/revoke verifiable credentials on scale.
@@ -50,7 +49,7 @@ async function merkleKey(clientConfig) {
     // Publish the Identity to the IOTA Network and log the results.
     // This may take a few seconds to complete proof-of-work.
     const receipt = await client.publishDocument(issuer.doc);
-    logExplorerUrl("Identity Update:", clientConfig.explorer, receipt.messageId);
+    console.log(`Identity Update: ${clientConfig.explorer.messageUrl(receipt.messageId)}`);
 
     // Prepare a credential subject indicating the degree earned by Alice
     let credentialSubject = {
@@ -88,7 +87,7 @@ async function merkleKey(clientConfig) {
     issuer.doc.metadataUpdated = Timestamp.nowUTC();
     issuer.doc.signSelf(issuer.key, issuer.doc.defaultSigningMethod().id);
     const nextReceipt = await client.publishDocument(issuer.doc);
-    logExplorerUrl("Identity Update:", clientConfig.explorer, nextReceipt.messageId);
+    console.log(`Identity Update: ${clientConfig.explorer.messageUrl(nextReceipt.messageId)}`);
 
     // Check the verifiable credential is revoked
     const newResult = await client.checkCredential(signedVc.toString(), VerifierOptions.default());
diff --git a/bindings/wasm/examples/src/private_tangle.js b/bindings/wasm/examples/src/private_tangle.js
index 43e0792ba6..259b388f89 100644
--- a/bindings/wasm/examples/src/private_tangle.js
+++ b/bindings/wasm/examples/src/private_tangle.js
@@ -11,7 +11,6 @@ import {
     KeyType,
     Network
 } from '@iota/identity-wasm';
-import {logResolverUrl} from "./utils";
 
 /**
  This example shows how a DID document can be created on a private tangle.
@@ -59,7 +58,7 @@ async function privateTangle(restURL, networkName) {
 
     console.log(`Published the DID document to the private tangle:`);
     console.log(resolved);
-    logResolverUrl("Explore the DID Document:", explorer, doc.id.toString());
+    console.log(`Explore the DID Document: ${explorer.resolverUrl(doc.id)}`);
 
     // Return the results.
     return {key, resolved, receipt};
diff --git a/bindings/wasm/examples/src/resolve_history.js b/bindings/wasm/examples/src/resolve_history.js
index fd4dc5c891..f7d8fa373d 100644
--- a/bindings/wasm/examples/src/resolve_history.js
+++ b/bindings/wasm/examples/src/resolve_history.js
@@ -12,7 +12,6 @@ import {
     Timestamp,
     VerificationMethod
 } from '@iota/identity-wasm';
-import {logExplorerUrl, prettyPrintJSON} from "./utils";
 import {createIdentity} from "./create_did";
 
 /**
@@ -75,7 +74,7 @@ async function resolveHistory(clientConfig) {
     const intReceipt1 = await client.publishDocument(intDoc1);
 
     // Log the results.
-    logExplorerUrl("Int. Chain Update (1):", clientConfig.explorer, intReceipt1.messageId);
+    console.log(`Int. Chain Update (1): ${clientConfig.explorer.messageUrl(intReceipt1.messageId)}`);
 
     // ===========================================================================
     // Diff Chain Update 1
@@ -101,7 +100,7 @@ async function resolveHistory(clientConfig) {
 
     // Publish the diff to the Tangle, starting a diff chain.
     const diffReceipt1 = await client.publishDiff(intReceipt1.messageId, diff1);
-    logExplorerUrl("Diff Chain Transaction (1):", clientConfig.explorer, diffReceipt1.messageId);
+    console.log(`Diff Chain Transaction (1): ${clientConfig.explorer.messageUrl(diffReceipt1.messageId)}`);
 
     // ===========================================================================
     // Diff Chain Update 2
@@ -129,7 +128,7 @@ async function resolveHistory(clientConfig) {
     // Note that we still use the `messageId` from the last integration chain message here to link
     // the current diff chain to that point on the integration chain.
     const diffReceipt2 = await client.publishDiff(intReceipt1.messageId, diff2);
-    logExplorerUrl("Diff Chain Transaction (2):", clientConfig.explorer, diffReceipt2.messageId);
+    console.log(`Diff Chain Transaction (2): ${clientConfig.explorer.messageUrl(diffReceipt2.messageId)}`);
 
     // ===========================================================================
     // Diff Chain Spam
@@ -151,7 +150,7 @@ async function resolveHistory(clientConfig) {
     const history1 = await client.resolveHistory(doc.id);
 
     // The history shows two documents in the integration chain, and two diffs in the diff chain.
-    prettyPrintJSON(history1, "History (1):");
+    console.log(`History (1): ${JSON.stringify(history1, null, 2)}`);
 
     // ===========================================================================
     // Integration Chain Update 2
@@ -179,7 +178,7 @@ async function resolveHistory(clientConfig) {
     const intReceipt2 = await client.publishDocument(intDoc2);
 
     // Log the results.
-    logExplorerUrl("Int. Chain Update (2):", clientConfig.explorer, intReceipt2.messageId);
+    console.log(`Int. Chain Update (2): ${clientConfig.explorer.messageUrl(intReceipt2.messageId)}`);
 
     // ===========================================================================
     // DID History 2
@@ -191,7 +190,7 @@ async function resolveHistory(clientConfig) {
     // The history now shows three documents in the integration chain, and no diffs in the diff chain.
     // This is because each integration chain document has its own diff chain but only the last one
     // is used during resolution.
-    prettyPrintJSON(history2, "History (2):");
+    console.log(`History (2): ${JSON.stringify(history2, null, 2)}`);
 
     // ===========================================================================
     // Diff Chain History
@@ -201,7 +200,7 @@ async function resolveHistory(clientConfig) {
     // Old diff chains can be retrieved but they no longer affect DID resolution.
     let previousIntegrationDocument = history2.integrationChainData()[1];
     let previousDiffHistory = await client.resolveDiffHistory(previousIntegrationDocument);
-    prettyPrintJSON(previousDiffHistory, "Previous Diff History:");
+    console.log(`Previous Diff History: ${JSON.stringify(previousDiffHistory, null, 2)}`);
 }
 
 export {resolveHistory};
diff --git a/bindings/wasm/examples/src/revoke_vc.js b/bindings/wasm/examples/src/revoke_vc.js
index 4527e235a7..6cd41ce36a 100644
--- a/bindings/wasm/examples/src/revoke_vc.js
+++ b/bindings/wasm/examples/src/revoke_vc.js
@@ -3,7 +3,6 @@
 
 import {Client, Config, Timestamp, VerifierOptions} from '@iota/identity-wasm';
 import {createVC} from './create_vc';
-import {logExplorerUrl, logResolverUrl} from './utils';
 
 /**
  This example shows how to revoke a verifiable credential.
@@ -40,8 +39,8 @@ async function revokeVC(clientConfig) {
     const {messageId} = await client.publishDocument(issuer.doc);
 
     // Log the resulting Identity update
-    logExplorerUrl("Issuer Update Transaction:", clientConfig.explorer, messageId);
-    logResolverUrl("Explore the Issuer DID Document:", clientConfig.explorer, issuer.doc.id.toString());
+    console.log(`Issuer Update Transaction: ${clientConfig.explorer.messageUrl(messageId)}`);
+    console.log(`Explore the Issuer DID Document: ${clientConfig.explorer.resolverUrl(issuer.doc.id)}`);
 
     // Check the verifiable credential
     const result = await client.checkCredential(signedVc.toString(), VerifierOptions.default());
diff --git a/bindings/wasm/examples/src/utils.js b/bindings/wasm/examples/src/utils.js
deleted file mode 100644
index 8b13294c05..0000000000
--- a/bindings/wasm/examples/src/utils.js
+++ /dev/null
@@ -1,40 +0,0 @@
-// Copyright 2020-2021 IOTA Stiftung
-// SPDX-License-Identifier: Apache-2.0
-
-/**
- Write out the Tangle Explorer URL given the network and message ID, with the given preamble.
-
- @param {!string} preamble
- @param {ExplorerUrl} explorer
- @param {!string} messageId
- **/
-function logExplorerUrl(preamble, explorer, messageId) {
-    console.log(`${preamble} ${explorer.messageUrl(messageId)}`);
-}
-
-/**
- Write out the Tangle Identity Resolver URL given the network and DID, with the given preamble.
-
- @param {!string} preamble
- @param {ExplorerUrl} explorer
- @param {!string} did
- **/
-function logResolverUrl(preamble, explorer, did) {
-    console.log(`${preamble} ${explorer.resolverUrl(did)}`);
-}
-
-/**
- Pretty-prints data to the console as a JSON string. This avoids nested fields being printed
- as [Object], [Array] by converting it to a full JSON string first.
-
- @param {!Object} data
- @param {!string | null} title
- **/
-function prettyPrintJSON(data, title = null) {
-    if (title != null) {
-        console.log(title);
-    }
-    console.log(JSON.stringify(JSON.parse(data.toString()), null, 2));
-}
-
-export {logExplorerUrl, logResolverUrl, prettyPrintJSON}
\ No newline at end of file
diff --git a/bindings/wasm/src/did/wasm_did.rs b/bindings/wasm/src/did/wasm_did.rs
index ac7291dbea..c1ae351c54 100644
--- a/bindings/wasm/src/did/wasm_did.rs
+++ b/bindings/wasm/src/did/wasm_did.rs
@@ -112,3 +112,13 @@ extern "C" {
   #[wasm_bindgen(typescript_type = "DID | string")]
   pub type UWasmDID;
 }
+
+impl TryFrom<UWasmDID> for IotaDID {
+  type Error = JsValue;
+
+  fn try_from(did: UWasmDID) -> std::result::Result<Self, Self::Error> {
+    // Parse rather than going through serde directly to return proper error types.
+    let json: String = did.into_serde().wasm_result()?;
+    IotaDID::parse(&json).wasm_result()
+  }
+}
diff --git a/bindings/wasm/src/tangle/client.rs b/bindings/wasm/src/tangle/client.rs
index 5feac9605d..9d8d5911f7 100644
--- a/bindings/wasm/src/tangle/client.rs
+++ b/bindings/wasm/src/tangle/client.rs
@@ -173,10 +173,10 @@ impl Client {
 
   /// Fetch the DID document specified by the given `DID`.
   #[wasm_bindgen]
-  pub fn resolve(&self, did: &UWasmDID) -> Result<PromiseResolvedDocument> {
-    let client: Rc<IotaClient> = self.client.clone();
-    let did: IotaDID = did.into_serde().wasm_result()?;
+  pub fn resolve(&self, did: UWasmDID) -> Result<PromiseResolvedDocument> {
+    let did: IotaDID = IotaDID::try_from(did)?;
 
+    let client: Rc<IotaClient> = self.client.clone();
     let promise: Promise = future_to_promise(async move {
       client
         .resolve(&did)
@@ -192,10 +192,10 @@ impl Client {
 
   /// Returns the message history of the given DID.
   #[wasm_bindgen(js_name = resolveHistory)]
-  pub fn resolve_history(&self, did: &UWasmDID) -> Result<PromiseDocumentHistory> {
-    let did: IotaDID = did.into_serde().wasm_result()?;
-    let client: Rc<IotaClient> = self.client.clone();
+  pub fn resolve_history(&self, did: UWasmDID) -> Result<PromiseDocumentHistory> {
+    let did: IotaDID = IotaDID::try_from(did)?;
 
+    let client: Rc<IotaClient> = self.client.clone();
     let promise: Promise = future_to_promise(async move {
       client
         .resolve_history(&did)
diff --git a/bindings/wasm/src/tangle/explorer.rs b/bindings/wasm/src/tangle/explorer.rs
index ce6459f198..aaf58578e3 100644
--- a/bindings/wasm/src/tangle/explorer.rs
+++ b/bindings/wasm/src/tangle/explorer.rs
@@ -8,6 +8,7 @@ use identity::iota::IotaDID;
 use identity::iota::MessageId;
 use wasm_bindgen::prelude::*;
 
+use crate::did::UWasmDID;
 use crate::error::Result;
 use crate::error::WasmResult;
 
@@ -51,8 +52,8 @@ impl WasmExplorerUrl {
   ///
   /// E.g. https://explorer.iota.org/mainnet/identity-resolver/{did}
   #[wasm_bindgen(js_name = resolverUrl)]
-  pub fn resolver_url(&self, did: &str) -> Result<String> {
-    let did: IotaDID = IotaDID::parse(did).wasm_result()?;
+  pub fn resolver_url(&self, did: UWasmDID) -> Result<String> {
+    let did: IotaDID = IotaDID::try_from(did)?;
     self.0.resolver_url(&did).map(|url| url.to_string()).wasm_result()
   }