Search code examples
javascriptnode.jsadobe-bracketsbrackets-shell

Changing Brackets Shell Name results in WebSocket connection Error


I am trying to build an app using the Brackets shell. More specifically I am trying to build a custom code editor for a project so instead of starting from scratch I am modifying Brackets.

So far I have been able to work through all issues until I got to the Brackets Shell. I want to be able to install my app beside brackets, so it has to have a different name and separate preferences. I followed this guide on how to rename a Brackets Shell app. Here are the files I changed:

Gruntfile.js – change the build name enter image description here

appshell/config.h – Change the app-name for windows and osx enter image description here

appshell_config.gypi – Change the app-name as well enter image description here

After running grunt setup and grunt build-mac my app launches and seems to work fine. I can change preferences in my app without affecting the original Brackets app (because they have different Application Support directories). I did not notice any issues until I opened the console where I saw the following error:

WebSocket connection to 'ws://localhost:50642/' failed: HTTP Authentication failed;
no valid credentials available NodeConnection.js:84

So I tried changing my apps name back to Brackets in all three files, and the issue goes away. My guess is somewhere in the code the app it is still trying to connect to the original app named Brackets. I'm guessing there is a 4th config file I need to change, but I am not familiar enough with Brackets to be able to locate that file. Without the connection Live Preview and eslint don't work.

I have tried inserting console.trace to try and reverse engineer how the Node Connection works between the Brackets Shell and the Brackets source code itself, but that didn't help much. Does anyone know how to change the name of Brackets Sheel without breaking NodeConnection at runtime?

I also tried searching for processes on port 50642 and the server is running. enter image description here


Solution

  • You need to modify Node Core

    Brackets Shell is hardwired to reject any call that is not from apps named Brackets. Open file brackets/appshell/node-core/Server.js. As of answering this question, you need to change line 205. Just in case that is different in the future you can find the commit I'm looking at here.

    Here is what is causing the issue:

    wsServer = new WebSocket.Server({
        server: httpServer,
        verifyClient : function (info, callback) {
            // Accept connections originated from local system only
            // Also do a loose check on user-agent to accept connection only from Brackets CEF shell
            if (info.origin === "file://" && info.req.headers["user-agent"].indexOf(" Brackets") !== -1) {
                callback(true);
            } else {
                // Reject the connection
                callback(false);
            }
        }
    });
    

    The problem is info.req.headers["user-agent"].indexOf(" Brackets"). As you can see it rejects any connections that are not from Brackets. Rename brackets to whatever your app is called.

    Make sure you format the name correctly

    If your app has a space it in (eg. New Brackets), then you would remove the space when checking the user-agent. In this example you would check that the user-agent like so: info.req.headers["user-agent"].indexOf(" NewBrackets").

    Congrats! You have built New Brackets.

    enter image description here