devtools: Support sending js objects to firefox devtools from console.log

[simonwuelker]

This allows us to console.log objects from JS and have a preview of them appear in the console.
Interacting with said preview doesn't work yet, because the devtools object actor is a stub.

Testing: This change adds a test

[atbrakhi]

@simonwuelker are you facing any issues running the Devtools test? For me doing ./mach test-devtools works. it would be nice to have new tests, but it's also important that we run it locally to make sure we are not breaking the existing tests.

We are figuring out how to put Devtools tests on CI without breaking things, until then please :)

btw added the running Devtools tests details in servo/book#202

[eerii]

Other than that it looks great, thanks! :)

Regarding the object actor, you are right, at the moment we aren't reusing them or keeping track of them. We are doing some work on the debugger and we are touching on that, so in the future it might be better. But that's something for later

As a heads up, @atbrakhi and I are working on the same files changing how we evaluate JavaScript, but we think it is not conflicting. We have a draft PR at #42306

[simonwuelker]

@simonwuelker are you facing any issues running the Devtools test?

Running them works fine, but I'm facing some issues with testing the relevant API (:

This is my attempt at writing test case that loads a page and waits for a console.log call. It currently times out because the callback is never invoked, and I'm unsure why that is the case.

def test_console_log_arguments(self):
        self.run_servoshell(url=f"{self.base_urls[0]}/console/log.html")
        with Devtools.connect() as devtools:
            devtools.watcher.watch_resources([Resources.CONSOLE_MESSAGE])

            console = WebConsoleActor(devtools.client, devtools.targets[0]["consoleActor"])
            console_result = Future()

            async def on_console_api_call(data: dict):
                console_result.set_result(data)

            # not sure which event type is correct, so use both for now...
            devtools.client.add_event_listener(
                console.actor_id, Events.WebConsole.CONSOLE_API_CALL, on_console_api_call
            )

            devtools.client.add_event_listener(
                console.actor_id, Events.WebConsole.LOG_MESSAGE, on_console_api_call
            )

            result = console_result.result(1)
            # do something useful with the data here

(console/log.html is a test file that contains nothing but a <script> with a console.log call)

[simonwuelker]

Update: I've added a working test and it has already caught a couple bugs. I was initially scared off by the need to setup different actors for the test, but it was pretty manageable in the end!

[simonwuelker]

Its likely possible to write this as a reusable assert-method for other tests but lets keep it simple for now. This is the first test for console.log.

[eerii]

The DevTools part looks good to me :)

I'm less familiar with the console_object_from_handle_value code so I can't comment much on that.

[atbrakhi]

Thank you for adding tests. Looks great <3

[atbrakhi]

would you mind filling a bug for this?

[simonwuelker]

I filed #42503 and marked it as a good first issue since the fix is pretty simple ^^

[simonwuelker]

Interesting, I'll look into these failures later today.
I think logging an array fails now, because arrays are objects with integer keys.