Unable to load saved program: Cannot read properties of undefined (reading 'getTopBlocks')

[imran khan]

Hi There,

I'm facing issue with workspace with react state updates, when ever i try to update state, workspace gets cleared.
Hence to solve this, I'm saving serialized state of workspace and trying to load state when workspace empty.

below is serialized workspace state

code:

const json = Blockly.serialization.workspaces.save(primaryWorkspace.current); const keys = Object.keys(json); console.log('keys', keys); if(keys.length) { console.log('save workspace', json); setValue('workspace', json) }

state:

{ "blocks": { "languageVersion": 0, "blocks": [ { "type": "variables_set_dynamic", "id": "}Lwn,{ohw[NiQRcw#(_Z", "x": 157, "y": 140, "fields": { "VAR": { "id": "]pL_iWiW_:C+XvNa)Akh" } }, "inputs": { "VALUE": { "block": { "type": "math_number", "id": "+?USD(D_F`QT^xc1J_Zl", "fields": { "NUM": 123 } } } } } ] }, "variables": [ { "name": "A", "id": "]pL_iWiW_:C+XvNa)Akh", "type": "Number" } ] }

code to load json state:

const workspace = getValues('workspace') if(workspace) { console.log('workspace', primaryWorkspace.current); console.log('load', workspace); Blockly.serialization.workspaces.load(workspace); }

Getting error while loading json into workspace

Uncaught TypeError: Cannot read properties of undefined (reading 'getTopBlocks') at module$contents$Blockly$serialization$blocks_BlockSerializer.clear (blocks.js:699:1) at Object.load (workspaces.js:80:1) at BlockyProgram.js:178:1 at invokePassiveEffectCreate (react-dom.development.js:23487:1) at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1) at invokeGuardedCallback (react-dom.development.js:4056:1) at flushPassiveEffectsImpl (react-dom.development.js:23574:1) at unstable_runWithPriority (scheduler.development.js:468:1) at runWithPriority$1 (react-dom.development.js:11276:1) module$contents$Blockly$serialization$blocks_BlockSerializer.clear @ blocks.js:699 load @ workspaces.js:80 (anonymous) @ BlockyProgram.js:178 invokePassiveEffectCreate @ react-dom.development.js:23487 callCallback @ react-dom.development.js:3945 invokeGuardedCallbackDev @ react-dom.development.js:3994 invokeGuardedCallback @ react-dom.development.js:4056 flushPassiveEffectsImpl @ react-dom.development.js:23574 unstable_runWithPriority @ scheduler.development.js:468 runWithPriority$1 @ react-dom.development.js:11276 flushPassiveEffects @ react-dom.development.js:23447 performSyncWorkOnRoot @ react-dom.development.js:22269 (anonymous) @ react-dom.development.js:11327 unstable_runWithPriority @ scheduler.development.js:468 runWithPriority$1 @ react-dom.development.js:11276 flushSyncCallbackQueueImpl @ react-dom.development.js:11322 flushSyncCallbackQueue @ react-dom.development.js:11309 discreteUpdates$1 @ react-dom.development.js:22420 discreteUpdates @ react-dom.development.js:3756 dispatchDiscreteEvent @ react-dom.development.js:5889 react-dom.development.js:20085 The above error occurred in the <BlocklyComponent> component: at BlocklyComponent (http://localhost:3000/static/js/bundle.js:11501:53) at BlocklyWorkspaces

Please help on this.