Windows and Messaging · Learn Oro Runtime

Oro Runtime windows are native host windows that load bundled web paths. Use numeric window indexes to find, focus, and message the windows your app owns.

Bundle a detail page

A window path has to resolve inside the application bundle.

copy-map.toml

"./src/index.html" = "index.html"
"./src/main.js" = "main.js"
"./src/detail.html" = "detail.html"
"./src/detail.js" = "detail.js"

src/detail.html

<!doctype html>
<html lang="en">
  <meta charset="utf-8" />
  <title>Field note detail</title>
  <main>
    <h1>Detail window</h1>
    <pre id="payload">Waiting for a message...</pre>
  </main>
  <script type="module" src="./detail.js"></script>
</html>

Create or focus the window

Look for the window first. Create it only when it is not already open.

src/main.js

import application from 'oro:application'

async function openDetailWindow(note) {
  let detailWindow = await application.getWindow(1)

  if (!detailWindow) {
    detailWindow = await application.createWindow({
      index: 1,
      path: 'detail.html',
      title: 'Field note detail',
      width: 520,
      height: 420,
    })
  }

  await detailWindow.focus()
  await detailWindow.postMessage({ type: 'note:selected', note })
}

Receive the message

Each window can listen for messages from other windows.

src/detail.js

const payload = document.getElementById('payload')

globalThis.addEventListener('message', (event) => {
  const message = event.detail ?? event.data
  payload.textContent = JSON.stringify(message, null, 2)
})

Window messaging keeps the capability boundary visible: the main window opens and addresses the detail window, while each page remains regular browser JavaScript.

What changed

The detail page was added to the bundle manifest.
application.getWindow(1) avoided duplicate windows.
createWindow opened a native host window.
postMessage moved structured data between pages.

Chapter complete

Next, add user-visible desktop capabilities: notifications, clipboard, and menus.

Continue to desktop integrations