Javascript target support

[snailcreature]

Hello again,

What would the challenges be if you/we were to implement support for the Javascript target for chrobot? I can see some use cases (outside of my own) where it would be useful, namely if you were writing a lustre webapp targetting js and want to test the front end automatically.

Your last update helped me massively, and I got it installed successfully, however I forgot about the whole 'one target at a time' nature of gleam, and sadly my project has to target js 😅

Thanks!

[JonasGruenwald]

By targeting JS you mean a runtime like node/bun/deno? Tbh if you are running on a JS runtime like that, I would just recommend using Playwright or Puppeteer. These libraries are much more mature and have a lot of engineering resources maintaining them.

My goal with this library was basically building something like Puppeteer that doesn't require a JS runtime.

The core stuff uses Gleam Actors and an Erlang port to interact with the Browser, you can take a look at this module to get an idea:

https://github.com/JonasGruenwald/chrobot/blob/main/src/chrome.gleam

Of course it would theoretically be possible to rewrite these parts in JavaScript, but since there are such great, well-maintained browser automation libraries for JS already I feel like it would be a bit of a waste of time?

I'm open to anything though :) Why does your project have to target js? Are you running on something like Cloudflare Workers?

[snailcreature]

As a project to learn Gleam, I'm writing some bindings for WebGL with the end goal being the creation of a simple game development framework similar to pygame or MonoGame. Sadly, WebGL is a front-end feature, so I have to focus on the JS runtimes.

Also, because this is my attempt to learn Gleam, I'm trying to do as much of it in Gleam as possible. I have pnpm set up on the project, but that's currently only for linting the mjs files the project will have. I really want to stick to the gleam test setup, because I love how testing is baked into the language. If I have to figure out integrating Playwright or Puppeteer, it wouldn't be the end of the world, but the idea of being able to spin up a server with gleam_http and test pages with chrobot for each test is really cool to me.

From some quick searching, I believe ports are currently experimental in JS, so I understand if you don't want to go that route, and I also get your point about Playwright and Puppeteer being more mature projects.

All this to say, I just think it'd be neat to be able to build, test, and deploy a website/app without leaving the Gleam ecosystem, but I understand why it isn't feasible.

[JonasGruenwald]

Oh! Well you won't be able to run Chrobot or any other browser automation library in the browser itself along with your code targeting WebGL, so why not just run Chrobot on Erlang for your tests?

I think that's very feasible, could be that you will have to do a monorepo with two Gleam projects for it, I'm not sure, but that's also a pretty common approach for Gleam client/server apps from what I understand.

[snailcreature]

The way I was planning on setting it up was to use gleam_http to serve a test site, then use chrobot to access that website and act as the browser and user. I could then use birdie to capture the output of chrobot's actions at the end. All of this could be done per function in testing, i.e.: create page for test x -> serve on server -> test with chrobot and birdie -> shutdown server -> repeat with test y, etc.

[JonasGruenwald]

Sure thing, sounds like a good plan! So as I said, I would just run your integration tests on the Erlang target. It seems like you have to do that anyways with your current plan, since you want to use gleam_http, and from what I can tell all the servers that support gleam_http (except the cgi one) also only run on Erlang (https://github.com/gleam-lang/http?tab=readme-ov-file#server-adapters).

Is there any specific problem with this setup? Might also be something to ask about in the Gleam Discord if you are stuck with this, I think it's not really a chrobot-specific issue, a lot of common packages like Mist / Wisp are Erlang-only and folks may want to use them in tests for projects targeting the browser.

[snailcreature]

I think I understand what you're saying. This might just be growing pains, and maybe a little ambitious for a first project 😅 I'll ask in the Gleam discord like you suggest. Thanks!

[JonasGruenwald]

For sure, good luck with you project!