Best workflow to debug code using ProseMirror

I’d appreciate any suggestions for the best workflow for debug code using ProseMirror. I’m trying to build a web-based literate programming editor. I’m pretty new to the world of coding - testing suites, npm builds, babel and all that.

I have quite a few bugs in my code. I’ve dipped my toes in the testing packages (I tried out using Jest), but mostly I find myself in the Chrome development tools, using the debugger, and stepping through the code laboriously. I don’t think I’m being very productive. I’ve found it psychologically difficult to “drag” myself away from the console (where you can quiz the code in a “question and answer” way) and instead write a systematic suite of tests. I’d appreciate any advice.

I think I’ve figured it out. I must simply test more. The problem is that the browser understands “import” but not “require”, while Node (where the test tools like Jest live) understands “require” but not “import”. As I understand it, you can’t get the two to speak to each other without having a build system, which I want to avoid.

(The latest version of Node does understand “import” via adding “type”: “module” to all the package.json files. This works for small things, but I couldn’t get this to work at the level of the entire ProseMirror library)

So my solution is to abandon testing packages like Jest and simply hardcode tests myself, and let the browser output their outcomes to the console. At least this way I can run a buildless testing environment.

1 Like