JS Dash SDK fails to get Identity in webpack production bundles

[pshenmic]

Issue

JS Dash SDK works fine in the Node.js enviornment, but when we use it in the Frontend application (React / Webpack), we receive an unexpected error when we build our application in production mode.

The application successfully builds, and the code is able to import it without any issues, but when we try to retrieve an Identity from the Platform with the method
client.platform.identities.get()
we get an error:

Error add client: Error: JS object constructor name mismatch. Expected Metadata, provided ID.
    at I8.g.wbg.__wbindgen_error_new (09700834-76f73061e1ef0914.js:31:360137)
    at wasm_dpp.wasm.wasm_dpp::utils::generic_of_js_val::h03ffdab2677d6d46 (2ecc9877-4e34-4b5a-938d-8f3f35d01955:0x2f6ca3)
    at wasm_dpp.wasm.identity_setMetadata (2ecc9877-4e34-4b5a-938d-8f3f35d01955:0x3b6c30)
    at A$.setMetadata (09700834-76f73061e1ef0914.js:31:211024)
    at A.<anonymous> (09700834-76f73061e1ef0914.js:27:1083808)
    at 09700834-76f73061e1ef0914.js:27:1083000
    at Object.next (09700834-76f73061e1ef0914.js:27:1083105)
    at E (09700834-76f73061e1ef0914.js:27:1081827)

However dev builds are all working just fine.

Possible Solution

I did a small debugging why this happens, and the problem happens in the JS Dash SDK's identities.get method. For unknown reason, the import line in the get.ts file :
import { Identifier, Metadata } from '@dashevo/wasm-dpp';

does not work correctly in the production builds, and instead of Metadata class, ID class gets imported from the @dashevo/wasm-dpp

Steps to Reproduce (for bugs)

1. Visit our sample application https://pshenmic-dev-wcx5-git-test-dash-sdk-p-fad6cf-pshenmics-projects.vercel.app/
2. Enter seed phrase frequent situate velvet inform help family salad park torch zero chapter right
3. The application syncs to the 100%, but then fails at with the error message above

Context

Your Environment

• Version used: Platform 1.7.1
• Environment name and version (e.g. Chrome 39, node.js 5.4): Next.JS 14 prod mode, MacOS, Chrome
• Operating System and version (desktop, server, or mobile): MacOS Sonoma
• Link to your project:

[pshenmic]

I did a fresh build against v1.8 and it caused the message error to slightly change, which gave me an idea what could be happening here. It looks like the Webpack minifies the final JS bundle, and it also shorten function names, which are incorrectly handled when passed to the WASM DPP:

Below error message shows that it tries to set a Cm object type (that turns from Metadata to Cm in webpack production builds) to a metadata, which is passed to the document.set_metadata WASM DPP function.

117-76eb10bd1b1cb96b.js:1 Error add client: Error: JS object constructor name mismatch. Expected Metadata, provided Cm.
    at 09700834-7209e8ed9a678716.js:31:379112
    at 12cd1b0b-591f-4b5d-9ad6-e2808fcfdba7:0x3c53cf
    at 12cd1b0b-591f-4b5d-9ad6-e2808fcfdba7:0x3ef8e7
    at 12cd1b0b-591f-4b5d-9ad6-e2808fcfdba7:0x2503ee
    at 12cd1b0b-591f-4b5d-9ad6-e2808fcfdba7:0x3b202a
    at g2.setMetadata (09700834-7209e8ed9a678716.js:31:208674)
    at A.<anonymous> (09700834-7209e8ed9a678716.js:27:1083808)
    at 09700834-7209e8ed9a678716.js:27:1083000
    at Object.next (09700834-7209e8ed9a678716.js:27:1083105)
    at E (09700834-7209e8ed9a678716.js:27:1081827)