Clear and concise description of the problem

Currently there is a nice feature to lazily launch a command like so:

ctx.docks.register({
  id: 'launcher',
  type: 'launcher',
  icon: 'ph:rocket-launch-duotone',
  title: 'Launcher',
  launcher: {
    title: 'Launcher My Cool App',
    onLaunch: async () => {
      await new Promise(resolve => setTimeout(resolve, 1000))

      ctx.docks.update({
        id: 'launcher',
        icon: 'ph:rocket-launch-fill',
        type: 'iframe',
        title: 'My Cool App is Ready',
        url: 'https://antfu.me',
      })
    },
  },
})

But you can imagine that as a user I'd like to execute a bash command e.g. pnpm run storybook --port 6006 and then wait for it to be ready before updating the dock. Additionally, I might want to either show or suppress the stdout from that command. Currently, I'd have to implement all of that logic myself but I can see others benefiting from a built-in mechanism for this.

Suggested solution

Perhaps something akin to Playwright's Dev server config options, which could look like this:

ctx.docks.register({
  id: 'launcher',
  type: 'launcher',
  icon: 'ph:rocket-launch-duotone',
  title: 'Launcher',
  launcher: {
    title: 'Launcher My Cool App',
    webServer: {
      command: 'npm run start',
      url: 'http://localhost:3000',
      reuseExistingServer: !process.env.CI,
      stdout: 'ignore',
      stderr: 'pipe',
    },
    onLaunch: async () => {
      // this is only going to execute when the server is truly ready
      ctx.docks.update({
        id: 'launcher',
        icon: 'ph:rocket-launch-fill',
        type: 'iframe',
        title: 'My Cool App is Ready',
        url: 'https://antfu.me',
      })
    },
  },
})

Alternative

The alternative would be to create custom logic for:

• running a particular command
• but before that, checking whether the server is already available
• if not, waiting for the server to be available
• dealing with command execution and its output
• only then proceeding with onLaunch

But like I mentioned I think many would benefit from a built-in feature in the devtools API.

Additional context

This is how Playwright does it

Validations

• Follow our Code of Conduct
• Read the Contributing Guide.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.