What causes "Duplicated property name ${globalName} (In JS: ${jsName})" in slint-ui/slint?

Rename one of the colliding globals so the camelCase forms differ.

Duplicated property name ${globalName} (In JS: ${jsName})

Error message

Duplicated property name ${globalName} (In JS: ${jsName})

What it means

The Node bindings expose every exported .slint global as a property on the component handle, using the camelCase translation of its name. Before defining it they check componentHandle[jsName]; if the translated name is already taken (by another global with the other spelling, or by a built-in handle member), they warn 'Duplicated property name <global> (In JS: <jsName>)' and skip the definition - the shadowed global becomes unreachable from JS.

Source

Thrown at api/node/typescript/index.ts:504

                                get() {
                                    return function () {
                                        return instance!.invoke(
                                            cb,
                                            Array.from(arguments),
                                        );
                                    };
                                },
                                enumerable: true,
                            },
                        );
                    }
                });

                // globals
                instance!.definition().globals.forEach((globalName) => {
                    const jsName = translateName(globalName);
                    if (componentHandle[jsName] !== undefined) {
                        console.warn(
                            "Duplicated property name " +
                                globalName +
                                " (In JS: " +
                                jsName +
                                ")",
                        );
                    } else {
                        const globalObject = Object.create({});

                        instance!
                            .definition()
                            .globalProperties(globalName)
                            ?.forEach((prop) => {
                                const propName = translateName(prop.name);

                                if (globalObject[propName] !== undefined) {
                                    console.warn(
                                        "Duplicated property name " +

View on GitHub (pinned to 3fd8f2ec03)

Solutions

Rename one of the colliding globals so the camelCase forms differ.
Run the app once after adding/renaming globals and check the console for 'Duplicated property name'.
Adopt one naming convention (Slint style: kebab-case) across the project so translations cannot clash.
Verify against the generated .d.ts - a shadowed global is missing from it.

Example fix

// before (.slint): both translate to `settingsPanel` on the handle
export global settings-panel { out property <int> count; }
export global settingsPanel { out property <int> total; }

// after: distinct camelCase keys after translation
export global settings-panel { out property <int> count; }
export global panel-settings { out property <int> total; }

Defensive patterns

Strategy: validation

Validate before calling

// After instantiating, verify every global is reachable under its camelCase name:
const instance = new Main();
for (const globalName of instance.definition().globals) {
    const jsName = globalName.replace(/-(\w)/g, (_, c: string) => c.toUpperCase());
    if ((instance as any)[jsName] === undefined) {
        throw new Error(`global "${globalName}" shadowed on the handle as "${jsName}"`);
    }
}

Prevention

Use one spelling style for globals project-wide (Slint convention: kebab-case)
After adding or renaming globals, run once and check the console for 'Duplicated property name'
Avoid global names translating to handle built-ins such as show, hide, run, window
Diff the generated .d.ts - a shadowed global is missing from it

When it happens

Trigger: Declaring export global settings-panel and export global settingsPanel (both translate to settingsPanel) in one program; a global whose camelCase name equals an existing handle built-in (e.g. show, hide, run, window); globals from different imported files colliding after translation.

Common situations: Mid-project renames from kebab-case to camelCase leaving both spellings alive; merging .slint files that use different naming styles; copy-pasting a global next to its renamed twin.

Related errors

AI-assisted analysis of slint-ui/slint@3fd8f2ec03 (2026-08-19). Data as JSON: /api/errors/405b8c72e3dd1ba1. Report an issue: GitHub.