Examples do not seem to be working because of a websocket error

[Dev380]

Describe the bug Clicking "reconnect" does not seem to work in showing the diagram after npx roger. The console gives this error:

[Error] socket error
Event

bubbles: false

cancelBubble: false

cancelable: false

composed: false

currentTarget: null

defaultPrevented: false

eventPhase: 0

isTrusted: true

returnValue: true

srcElement: WebSocket {listeners: Object, URL: "ws://localhost:9160/", url: "ws://localhost:9160/", readyState: 3, bufferedAmount: 0, …}

target: WebSocket {listeners: Object, URL: "ws://localhost:9160/", url: "ws://localhost:9160/", readyState: 3, bufferedAmount: 0, …}

timeStamp: 10628

type: "error"

Event Prototype
	(anonymous function) (app.js:145209)

While npx roger seems to work fine:

❯ npx roger watch nested.sub venn.sty setTheory.dsl                                           11:59:55
npx: installed 11 in 2.139s

To Reproduce This repository, I git cloned it today. Steps to reproduce the behavior:

1. Run yarn on npm 16, and yarn start on npm 13 (because of compatibility issues with Linux)
2. See the following output

yarn run v1.22.17
$ lerna run watch --stream --parallel --scope=@penrose/core --scope=@penrose/browser-ui
lerna notice cli v3.22.1
lerna notice filter including ["@penrose/core","@penrose/browser-ui"]
lerna info filter [ '@penrose/core', '@penrose/browser-ui' ]
lerna info Executing command in 2 packages: "yarn run watch"
@penrose/core: $ yarn build:parsers
@penrose/browser-ui: $ node build.js -w
@penrose/browser-ui: serving ./public at http://localhost:3000/ (livereload on :13000)
@penrose/core: $ nearleyc src/parser/Domain.ne > src/parser/DomainParser.ts && nearleyc src/parser/Substance.ne > src/parser/SubstanceParser.ts && nearleyc src/parser/Style.ne > src/parser/StyleParser.ts
@penrose/core: $ yarn watch:esbuild
@penrose/core: $ node estrella.js -watch
@penrose/browser-ui: Wrote public/app.js (13.1MB, 675.49ms)
@penrose/browser-ui: Watching files for changes...
@penrose/core: Wrote ./build/dist/index.esm.js (6.3MB, 287.70ms)
@penrose/core: Watching files for changes...
@penrose/core: Running yarn run build-decls [2783798]
@penrose/core: Wrote ./build/dist/index.js (4.6MB, 310.74ms)
@penrose/browser-ui: 1 file changed: ../core/build/dist/index.esm.js
@penrose/core: $ tsc --emitDeclarationOnly --outDir build/dist
@penrose/browser-ui: Wrote public/app.js (13.1MB, 301.30ms)
@penrose/browser-ui: ———————————————————————————————————————————————————————————
@penrose/browser-ui: TS: OK
@penrose/browser-ui: ———————————————————————————————————————————————————————————
@penrose/core: ———————————————————————————————————————————————————————————
@penrose/core: TS: OK
@penrose/core: ———————————————————————————————————————————————————————————
@penrose/core: yarn run build-decls exited (0)
@penrose/browser-ui: ———————————————————————————————————————————————————————————
@penrose/browser-ui: TS: OK
@penrose/browser-ui: ———————————————————————————————————————————————————————————

4. Go to localhost:3000 on any web browser, and go into inspect element and the console.
5. See the error where it cannot connect to localhost:9160 with a websocket.

Expected behavior npx roger and clicking the reconnect button should show the diagram.

Desktop (please complete the following information if applicable):

• OS: Debian 11
• Browser: GNOME Epiphany & Librewolf (fork of Firefox) & Firefox ESR

[samestep]

Weird, when I run npx roger watch nested.sub venn.sty setTheory.dsl from packages/examples/src/set-theory-domain/ I get this error:

💂 starting on port 9160...
❌ Could not open nested.sub: Error: ENOENT: no such file or directory, open 'nested.sub'

[samestep]

OK I tried again after git clean and now I'm just getting the same "npx: installed 11 in ..." message you showed above. To clarify: that is actually not the right behavior, it should instead just look like this (in blue text):

💂 starting on port 9160...

So, something is going wrong with either npx or roger or both.

[samestep]

I think the "npx: installed 11 in ..." thing is a Node version issue: it only occurs in Node 14 and not in Node 16. The "Could not open ..." thing seems like a Penrose bug though, investigating.

[samestep]

OK... this is very strange. I inserted this line into packages/roger/src/commands/watch.ts:

console.log(process.cwd());

On macOS it always prints the directory from which I ran the npx roger watch command. On Linux it gives the following behavior (paths relative to the repo root):

terminal	roger
/	/
packages/	packages/
packages/examples/	packages/examples/
packages/examples/src/	packages/examples/
packages/examples/src/set-theory-domain/	packages/examples/
packages/core/src/	packages/core/

Seems like maybe npx is doing something weird like knowing the root of the package it's in, but only for things underneath packages/? Unclear... @wodeni any ideas?

[upsj]

In case somebody still needs to run the examples, using absolute paths seems to work:

npx roger watch `pwd`/independent.sub `pwd`/linear-algebra-paper-simple.sty `pwd`/linear-algebra.dsl

[keenancrane]

I'm also having trouble with roger (even with the new IDE). For instance, running roger watch from an example subdirectory (such as walk-on-spheres) loads up empty .sub/.sty/.dsl files in the IDE. But running it from the examples/ subdirectory correctly loads the files. Seems there's maybe something hard-coded in roger about the examples directory?

[wodeni]

This should be resolved after https://github.com/penrose/penrose/pull/1434. Closing for now