Skip to main content
Kombai browser lets you preview your app’s local deployment in the browser (optimized for Google Chrome and Chromium based browsers), with built-in listeners so you can iterate fast by sending elements and errors back to Kombai as context. To open the preview, click the Start Preview button below the Kombai input box. Kombai will start the dev server. Once the server is runnning, click the Kombai Browser button to open the browser preview. Alternatively, press the Kombai Browser button that appears after the code generation process is completed.

​
Send elements & errors to Kombai

When you send a DOM element or console error to Kombai, it is attached to your current active chat in Kombai.

​
Send DOM elements

  1. Click the
    icon in the browser chat window. Alternatively, press ⌘ + ⌥ + . keyboard shortcut on macOS.
  2. Click the DOM element that you want to send to Kombai. When you click the DOM element, Kombai captures the screenshot of the DOM element and the entire page.
  3. Add additional instructions that you want to send to Kombai (if any).
  4. Click the Send to chat button.
  5. Then, come back to the Kombai and click the
    icon.

​
Send console errors

  1. Click the Console errors button in the browser chat window.
  2. Then, come back to the Kombai and click the
    icon.

​
Connection status

The connection status is shown in the browser input.
  • If the connection is successful, you will see the Connected status.
  • If the connection is lost, you will see the Disconnected status. Click Reconnect app to connect again. If the problem persists, try the troubleshooting steps mentioned here.
  • If the connection is failed, you will see the Failed to load status. Click Retry to connect.

​
Preview multiple screens

You can use multiple browser tabs to preview multiple screens of your app. This enables you to select elements from other screens that you want to refer in your current browser tab. For example, if you have the Homepage open in the browser and want to add a avatar from the Accounts page to Home, open the Accounts page in a new tab. Then, select the avatar and return to the previous tab (Home). You’ll see the avatar’s DOM element highlighted in yellow. You can then ask Kombai to add the avatar to Home.

​
Preview multiple apps

If you have multiple apps in your repo, click the Start Preview button to open the previews of all the apps in the repo. To switch between multiple previews:
  1. Click Open Preview button. You will see all previews that are running on the Kombai browser, along with the port number.
  2. Select one of the previews to open it in Kombai browser.

​
How to expand the browser chat

  1. Click the
    icon to expand the chat window.
  2. Click the
    icon to collapse the chat window.

​
How to move browser chat position on the screen

  1. Click the
    and
    icons to move the chat window to the left and right of the screen, respectively.
  2. Click the
    and
    icons to move the chat window to the top and bottom of the screen, respectively.