Consolidating all dependencies into a single package.json

[rileydanejohnston]

Hello,
I'm in the process of integrating my graphical editor with another project and I wanted to see if it's possible to consolidate all the different package.jsons for the workflow/node-json-vscode example into one main package.json. Are there any resources/packages that need to be a specific version? Also, is there any reason why we can't use npm instead of yarn?

We've created this main package.json file and placed it in the graphical-editor directory. This is what the dependencies look like currently (this package.json lives in the graphical-editor directory). It seems like the server starts just fine but the client doesn't send the requestModel action:

"dependencies": {
    "@types/mocha": "^9.1.1",
    "@eclipse-glsp-examples/workflow-glsp": "0.9.0",
    "@eclipse-glsp/vscode-integration-webview": "next",
    "@vscode/codicons": "^0.0.32",
    "balloon-css": "^0.5.0",
    "@eclipse-glsp/layout-elk": "1.0.0",
    "@eclipse-glsp/server-node": "1.0.0"
  },
  "devDependencies": {
    "prettier-plugin-multiline-arrays": "^1.1.1",
    "@vscode/codicons": "^0.0.32",
    "circular-dependency-plugin": "^5.2.2",
    "css-loader": "^6.7.3",
    "ignore-loader": "^0.1.2",
    "reflect-metadata": "^0.1.13",
    "rimraf": "latest",
    "source-map-loader": "^1.1.3",
    "style-loader": "^2.0.0",
    "ts-loader": "^8.1.0",
    "typescript": "^4.9.4",
    "webpack": "^5.0.0",
    "webpack-cli": "^4.9.1",
    "yargs": "^12.0.5",
    "@eclipse-glsp/vscode-integration": "next",
    "@types/vscode": "^1.54.0",
    "path": "^0.12.7",
    "ts-node": "^10.9.1",
    "@types/node": "18.11.18",
    "@eclipse-glsp/config": "next",
    "net": "^1.0.2",
    "crypto-browserify": "^3.12.0",
    "os-browserify": "^0.3.0",
    "stream-browserify": "^3.0.0",
    "@types/react": "^18.0.27",
    "@types/react-dom": "^18.0.10"
  },
  "overrides": {
    "sprotty": "0.12.0-next.00a6590.0",
    "@eclipse-glsp/client": "0.10.0-next.c94277c.176",
    "@eclipse-glsp/protocol": "0.10.0-next.c94277c.176"
  },

[tortmayr]

Hi @rileydanejohnston ,

At first glance your dependency declaration looks fine.
The only thing that seems a little odd to me is the 0.9.0 version used for @eclipse-glsp-examples/workflow-glsp. IMO this should be aligned with the client/protocol version. So you should probably use 0.10.0-next.c94277c.176 here as well.

Side note: I would recommend to migrate to the 1.0.0 release instead of using 0.10.0 nightlies.

It seems like the server starts just fine but the client doesn't send the requestModel action:

If everything up to the RequestModelAction works as expected this is typically an indicator for an error that occurs when you open your webview/diagram. I would recommend to use the Toggle Developer Tools functionality (Ctrl +Shift +I) and check whether there are any errors in the console log.

[rileydanejohnston]

Hi @tortmayr, thank you for the advice. The main error I'm concerned with is the ReferenceError related to vscode-ws-jsonrpc saying that "Buffer is not defined". I'm not sure how to approach this problem and I wanted to see if you've encountered issues like it before.

[rileydanejohnston]

Hi @tortmayr, we made some progress around the Buffer error but now we are have a No matching bindings found for serviceIdentifier: Symbol(IActionDispatcher) error. I tried binding the IActionDispatcher to the ActionDispatcher in the graphical-editor/glsp-client-vscode/workflow-vscode/webview/src/app.ts file. Is this the correct way to bind the IActionDispatcher? My app file looks like this:

class TaskListStarter extends GLSPStarter {
    protected override addVscodeBindings(container: Container, diagramIdentifier: GLSPDiagramIdentifier): void {
        super.addVscodeBindings(container, diagramIdentifier);
        container.rebind(GLSPVscodeDiagramWidget).to(MyGlspDiagramWidget).inSingletonScope();
        container.bind<ActionDispatcher>(TYPES.IActionDispatcher).toService(ActionDispatcher);
    }

    createContainer(diagramIdentifier: SprottyDiagramIdentifier): Container {
        return createWorkflowDiagramContainer(diagramIdentifier.clientId);
    }
}