@gtkx/testing 0.10.4 → 0.11.0

package/README.md

@@ -0,0 +1,103 @@
+<p align="center">
+  <img src="https://raw.githubusercontent.com/eugeniodepalo/gtkx/main/logo.svg" alt="GTKX" width="60" height="60">
+</p>
+
+<h1 align="center">GTKX</h1>
+
+<p align="center">
+  <strong>Build native GTK4 desktop applications with React and TypeScript.</strong>
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@gtkx/react"><img src="https://img.shields.io/npm/v/@gtkx/react.svg" alt="npm version"></a>
+  <a href="https://github.com/eugeniodepalo/gtkx/actions"><img src="https://img.shields.io/github/actions/workflow/status/eugeniodepalo/gtkx/ci.yml" alt="CI"></a>
+  <a href="https://github.com/eugeniodepalo/gtkx/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MPL--2.0-blue.svg" alt="License"></a>
+  <a href="https://github.com/eugeniodepalo/gtkx/discussions"><img src="https://img.shields.io/badge/discussions-GitHub-blue" alt="GitHub Discussions"></a>
+</p>
+
+---
+
+GTKX lets you write Linux desktop applications using React. Your components render as native GTK4 widgets through a Rust FFI bridge—no webviews, no Electron, just native performance with the developer experience you already know.
+
+## Quick Start
+
+```bash
+npx @gtkx/cli create my-app
+cd my-app
+npm run dev
+```
+
+## Example
+
+```tsx
+import {
+  GtkApplicationWindow,
+  GtkBox,
+  GtkButton,
+  GtkLabel,
+  quit,
+  render,
+} from "@gtkx/react";
+import * as Gtk from "@gtkx/ffi/gtk";
+import { useState } from "react";
+
+const App = () => {
+  const [count, setCount] = useState(0);
+
+  return (
+    <GtkApplicationWindow
+      title="Counter"
+      defaultWidth={300}
+      defaultHeight={200}
+      onCloseRequest={quit}
+    >
+      <GtkBox
+        orientation={Gtk.Orientation.VERTICAL}
+        spacing={20}
+        valign={Gtk.Align.CENTER}
+      >
+        <GtkLabel label={`Count: ${count}`} cssClasses={["title-1"]} />
+        <GtkButton label="Increment" onClicked={() => setCount((c) => c + 1)} />
+      </GtkBox>
+    </GtkApplicationWindow>
+  );
+};
+
+render(<App />, "com.example.counter");
+```
+
+## Features
+
+- **React 19** — Hooks, concurrent features, and the component model you know
+- **Native GTK4 widgets** — Real native controls, not web components in a webview
+- **Adwaita support** — Modern GNOME styling with Libadwaita components
+- **Hot Module Replacement** — Fast refresh during development
+- **TypeScript first** — Full type safety with auto-generated bindings
+- **CSS-in-JS styling** — Familiar styling patterns adapted for GTK
+- **Testing utilities** — Component testing similar to Testing Library
+
+## Examples
+
+Explore complete applications in the [`examples/`](./examples) directory:
+
+- **[gtk-demo](./examples/gtk-demo)** — Full replica of the official GTK demo app
+- **[hello-world](./examples/hello-world)** — Minimal application showing a counter
+- **[todo](./examples/todo)** — Full-featured todo application with Adwaita styling and testing
+- **[deploying](./examples/deploying)** — Example of packaging and distributing a GTKX app
+
+## Documentation
+
+Visit [https://eugeniodepalo.github.io/gtkx](https://eugeniodepalo.github.io/gtkx/) for the full documentation.
+
+## Contributing
+
+Contributions are welcome! Please see the [contributing guidelines](./CONTRIBUTING.md) and check out the [good first issues](https://github.com/eugeniodepalo/gtkx/labels/good%20first%20issue).
+
+## Community
+
+- [GitHub Discussions](https://github.com/eugeniodepalo/gtkx/discussions) — Questions, ideas, and general discussion
+- [Issue Tracker](https://github.com/eugeniodepalo/gtkx/issues) — Bug reports and feature requests
+
+## License
+
+[MPL-2.0](./LICENSE)

package/dist/fire-event.js

@@ -21,6 +21,10 @@ import { tick } from "./timing.js";
  * @see {@link userEvent} for high-level user interactions
  */
 export const fireEvent = async (element, signalName, ...args) => {
-    call("libgobject-2.0.so.0", "g_signal_emit_by_name", [{ type: { type: "gobject" }, value: element.id }, { type: { type: "string" }, value: signalName }, ...args], { type: "undefined" });
+    call("libgobject-2.0.so.0", "g_signal_emit_by_name", [
+        { type: { type: "gobject", ownership: "none" }, value: element.id },
+        { type: { type: "string", ownership: "none" }, value: signalName },
+        ...args,
+    ], { type: "undefined" });
     await tick();
 };

package/dist/queries.js

@@ -50,16 +50,17 @@ const ROLES_WITH_INTERNAL_LABELS = new Set([
     Gtk.AccessibleRole.LINK,
 ]);
 const isInternalLabel = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible || accessible.getAccessibleRole() !== Gtk.AccessibleRole.LABEL)
+    if (widget.getAccessibleRole() !== Gtk.AccessibleRole.LABEL)
         return false;
     const parent = widget.getParent();
     if (!parent)
         return false;
-    const parentAccessible = getNativeObject(parent.id, Gtk.Accessible);
-    if (!parentAccessible)
+    if (parent.getAccessibleRole === undefined)
         return false;
-    return ROLES_WITH_INTERNAL_LABELS.has(parentAccessible.getAccessibleRole());
+    const parentRole = parent.getAccessibleRole();
+    if (!parentRole)
+        return false;
+    return ROLES_WITH_INTERNAL_LABELS.has(parentRole);
 };
 const getLabelText = (widget) => {
     const asLabel = widget;
@@ -70,8 +71,7 @@ const collectChildLabels = (widget) => {
     const labels = [];
     let child = widget.getFirstChild();
     while (child) {
-        const childAccessible = getNativeObject(child.id, Gtk.Accessible);
-        if (childAccessible?.getAccessibleRole() === Gtk.AccessibleRole.LABEL) {
+        if (child.getAccessibleRole() === Gtk.AccessibleRole.LABEL) {
             const labelText = getLabelText(child);
             if (labelText)
                 labels.push(labelText);
@@ -84,7 +84,7 @@ const collectChildLabels = (widget) => {
 const getWidgetText = (widget) => {
     if (isInternalLabel(widget))
         return null;
-    const role = getNativeObject(widget.id, Gtk.Accessible)?.getAccessibleRole();
+    const role = widget.getAccessibleRole();
     if (role === undefined)
         return null;
     switch (role) {
@@ -109,7 +109,7 @@ const getWidgetText = (widget) => {
         case Gtk.AccessibleRole.TEXT_BOX:
         case Gtk.AccessibleRole.SEARCH_BOX:
         case Gtk.AccessibleRole.SPIN_BUTTON:
-            return getNativeObject(widget.id, Gtk.Editable)?.getText() ?? null;
+            return getNativeObject(widget.id, Gtk.Editable).getText() ?? null;
         case Gtk.AccessibleRole.GROUP:
             return widget.getLabel?.() ?? null;
         case Gtk.AccessibleRole.WINDOW:
@@ -135,10 +135,7 @@ const getWidgetTestId = (widget) => {
     return widget.getName();
 };
 const getWidgetCheckedState = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return undefined;
-    const role = accessible.getAccessibleRole();
+    const role = widget.getAccessibleRole();
     switch (role) {
         case Gtk.AccessibleRole.CHECKBOX:
         case Gtk.AccessibleRole.RADIO:
@@ -148,19 +145,18 @@ const getWidgetCheckedState = (widget) => {
         case Gtk.AccessibleRole.SWITCH:
             return widget.getActive();
         default:
+            return null;
     }
 };
 const getWidgetExpandedState = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return undefined;
-    const role = accessible.getAccessibleRole();
+    const role = widget.getAccessibleRole();
     if (role === Gtk.AccessibleRole.BUTTON) {
         const parent = widget.getParent();
         if (!parent)
-            return undefined;
-        return parent.getExpanded?.();
+            return null;
+        return parent.getExpanded?.() ?? null;
     }
+    return null;
 };
 const matchByRoleOptions = (widget, options) => {
     if (!options)
@@ -201,8 +197,7 @@ const formatByRoleError = (role, options) => {
 };
 const getAllByRole = (container, role, options) => {
     const matches = findAll(container, (node) => {
-        const accessible = getNativeObject(node.id, Gtk.Accessible);
-        if (!accessible || accessible.getAccessibleRole() !== role)
+        if (node.getAccessibleRole() !== role)
             return false;
         return matchByRoleOptions(node, options);
     });

package/dist/render.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { discardAllBatches, getNativeObject, start } from "@gtkx/ffi";
+import { discardAllBatches, start } from "@gtkx/ffi";
+import * as Gio from "@gtkx/ffi/gio";
 import * as Gtk from "@gtkx/ffi/gtk";
 import { ApplicationContext, GtkApplicationWindow, reconciler } from "@gtkx/react";
 import * as queries from "./queries.js";
@@ -9,14 +10,10 @@ import { hasLabel } from "./widget.js";
 let application = null;
 let container = null;
 let lastRenderError = null;
-const APP_ID = `com.gtkx.test${process.pid}`;
 const getWidgetLabel = (widget) => {
     if (!hasLabel(widget))
         return null;
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return null;
-    const role = accessible.getAccessibleRole();
+    const role = widget.getAccessibleRole();
     if (role === Gtk.AccessibleRole.LABEL) {
         return widget.getLabel?.() ?? null;
     }
@@ -24,11 +21,11 @@ const getWidgetLabel = (widget) => {
 };
 const printWidgetTree = (root, indent = 0) => {
     const prefix = "  ".repeat(indent);
-    const accessibleRole = getNativeObject(root.id, Gtk.Accessible)?.getAccessibleRole();
-    const role = accessibleRole !== undefined ? (Gtk.AccessibleRole[accessibleRole] ?? "UNKNOWN") : "UNKNOWN";
+    const role = root.getAccessibleRole();
+    const roleName = role !== undefined ? (Gtk.AccessibleRole[role] ?? "UNKNOWN") : "UNKNOWN";
     const labelText = getWidgetLabel(root);
     const label = labelText ? ` label="${labelText}"` : "";
-    let result = `${prefix}<${root.constructor.name} role=${role}${label}>\n`;
+    let result = `${prefix}<${root.constructor.name} role=${roleName}${label}>\n`;
     let child = root.getFirstChild();
     while (child) {
         result += printWidgetTree(child, indent + 1);
@@ -51,10 +48,10 @@ const handleError = (error) => {
     lastRenderError = error;
 };
 const ensureInitialized = () => {
-    application = start(APP_ID);
+    application = start("org.gtkx.testing", Gio.ApplicationFlags.NON_UNIQUE);
     if (!container) {
         const instance = reconciler.getInstance();
-        container = instance.createContainer(application, 0, null, false, null, "", handleError, handleError, () => { }, () => { }, null);
+        container = instance.createContainer(application, 1, null, false, null, "", handleError, handleError, () => { }, () => { }, null);
     }
     return { app: application, container };
 };

package/dist/user-event.js

@@ -10,14 +10,11 @@ const TOGGLEABLE_ROLES = new Set([
     Gtk.AccessibleRole.SWITCH,
 ]);
 const isToggleable = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return false;
-    return TOGGLEABLE_ROLES.has(accessible.getAccessibleRole());
+    return TOGGLEABLE_ROLES.has(widget.getAccessibleRole());
 };
 const click = async (element) => {
     if (isToggleable(element)) {
-        const role = getNativeObject(element.id, Gtk.Accessible)?.getAccessibleRole();
+        const role = element.getAccessibleRole();
         if (role === Gtk.AccessibleRole.CHECKBOX || role === Gtk.AccessibleRole.RADIO) {
             const checkButton = element;
             checkButton.setActive(!checkButton.getActive());
@@ -62,8 +59,6 @@ const type = async (element, text) => {
         throw new Error("Cannot type into element: expected editable widget (TEXT_BOX, SEARCH_BOX, or SPIN_BUTTON)");
     }
     const editable = getNativeObject(element.id, Gtk.Editable);
-    if (!editable)
-        return;
     const currentText = editable.getText();
     editable.setText(currentText + text);
     await tick();
@@ -77,10 +72,9 @@ const clear = async (element) => {
 };
 const SELECTABLE_ROLES = new Set([Gtk.AccessibleRole.COMBO_BOX, Gtk.AccessibleRole.LIST]);
 const isSelectable = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
+    if (!widget)
         return false;
-    return SELECTABLE_ROLES.has(accessible.getAccessibleRole());
+    return SELECTABLE_ROLES.has(widget.getAccessibleRole());
 };
 const selectListViewItems = (selectionModel, positions, exclusive) => {
     if (positions.length === 0) {
@@ -114,7 +108,7 @@ const selectOptions = async (element, values) => {
     if (!isSelectable(element)) {
         throw new Error("Cannot select options: expected selectable widget (COMBO_BOX or LIST)");
     }
-    const role = getNativeObject(element.id, Gtk.Accessible)?.getAccessibleRole();
+    const role = element.getAccessibleRole();
     if (role === Gtk.AccessibleRole.COMBO_BOX) {
         if (Array.isArray(values) && values.length > 1) {
             throw new Error("Cannot select multiple options: ComboBox only supports single selection");
@@ -148,7 +142,7 @@ const deselectOptions = async (element, values) => {
         await tick();
         return;
     }
-    const role = getNativeObject(element.id, Gtk.Accessible)?.getAccessibleRole();
+    const role = element.getAccessibleRole();
     if (role !== Gtk.AccessibleRole.LIST) {
         throw new Error("Cannot deselect options: only ListBox supports deselection");
     }

package/dist/wait-for.d.ts

@@ -19,7 +19,7 @@ import type { WaitForOptions } from "./types.js";
  * }, { timeout: 2000 });
  * ```
  */
-export declare const waitFor: <T>(callback: () => T, options?: WaitForOptions) => Promise<T>;
+export declare const waitFor: <T>(callback: () => T | Promise<T>, options?: WaitForOptions) => Promise<T>;
 type ElementOrCallback = Gtk.Widget | (() => Gtk.Widget | null);
 /**
  * Waits for an element to be removed from the widget tree.

package/dist/wait-for.js

@@ -25,7 +25,7 @@ export const waitFor = async (callback, options) => {
     let lastError = null;
     while (Date.now() - startTime < timeout) {
         try {
-            return callback();
+            return await callback();
         }
         catch (error) {
             lastError = error;
@@ -75,7 +75,7 @@ const isElementRemoved = (element) => {
 export const waitForElementToBeRemoved = async (elementOrCallback, options) => {
     const { timeout = DEFAULT_TIMEOUT, interval = DEFAULT_INTERVAL, onTimeout } = options ?? {};
     const initialElement = getElement(elementOrCallback);
-    if (initialElement === null) {
+    if (initialElement === null || isElementRemoved(initialElement)) {
         throw new Error("Elements already removed: waitForElementToBeRemoved requires elements to be present initially");
     }
     const startTime = Date.now();

package/dist/widget.js

@@ -1,4 +1,3 @@
-import { getNativeObject } from "@gtkx/ffi";
 import * as Gtk from "@gtkx/ffi/gtk";
 const EDITABLE_ROLES = new Set([
     Gtk.AccessibleRole.TEXT_BOX,
@@ -6,10 +5,7 @@ const EDITABLE_ROLES = new Set([
     Gtk.AccessibleRole.SPIN_BUTTON,
 ]);
 export const isEditable = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return false;
-    return EDITABLE_ROLES.has(accessible.getAccessibleRole());
+    return EDITABLE_ROLES.has(widget.getAccessibleRole());
 };
 const LABEL_ROLES = new Set([
     Gtk.AccessibleRole.BUTTON,
@@ -22,8 +18,5 @@ const LABEL_ROLES = new Set([
     Gtk.AccessibleRole.MENU_ITEM_RADIO,
 ]);
 export const hasLabel = (widget) => {
-    const accessible = getNativeObject(widget.id, Gtk.Accessible);
-    if (!accessible)
-        return false;
-    return LABEL_ROLES.has(accessible.getAccessibleRole());
+    return LABEL_ROLES.has(widget.getAccessibleRole());
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gtkx/testing",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "description": "Testing utilities for GTKX applications",
   "keywords": [
     "gtk",
@@ -32,16 +32,17 @@
     "dist"
   ],
   "dependencies": {
-    "@gtkx/ffi": "0.10.4",
-    "@gtkx/react": "0.10.4",
-    "@gtkx/native": "0.10.4"
+    "@gtkx/ffi": "0.11.0",
+    "@gtkx/native": "0.11.0",
+    "@gtkx/react": "0.11.0"
   },
   "devDependencies": {
     "@types/react-reconciler": "^0.32.3",
-    "react-reconciler": "^0.33.0"
+    "react-reconciler": "^0.33.0",
+    "@gtkx/vitest": "0.11.0"
   },
   "scripts": {
     "build": "tsc -b && cp ../../README.md .",
-    "test": "../../scripts/run-tests.sh"
+    "test": "vitest run"
   }
 }