Capability API theme.apply causing incorrect websocket url

[VaMusaka]

When using the Qlik Cloud Capability API in a locally hosted mashup, calling `qlik.theme.apply()` may trigger a malformed `engineData` WebSocket URL.

The initial app WebSocket connects correctly:

wss://<tenant>.qlikcloud.com:443/app/<app-id>?qlik-web-integration-id=...

After `qlik.theme.apply()` is called, a second WebSocket may be created incorrectly against the local application host:

wss://localhost:8080/<tenant>.qlikcloud.com/app/engineData?...

The failed socket closes with code `1006`.

Resolution

Ensure the Qlik Cloud Capability API configuration follows the documented Cloud mashup format.

RequireJS configuration:

require.config({
baseUrl: "https://<tenant>.qlikcloud.com/resources",
webIntegrationId: "<web-integration-id>"
});

`openApp` configuration:

{
    host: "<tenant>.qlikcloud.com",
    prefix: "/",
    port: 443,
    isSecure: true,
    webIntegrationId: "<web-integration-id>"
}

As a temporary workaround, rewrite only malformed Qlik Cloud WebSocket URLs before the browser creates the socket:

const NativeWebSocket = window.WebSocket;

window.WebSocket = function (url, protocols) {
    const parsed = new URL(String(url));
    const [, tenantHost, ...rest] = parsed.pathname.split("/");

    if (parsed.host === window.location.host && tenantHost?.endsWith(".qlikcloud.com") && rest[0] === "app"
    ) {
    url = `wss://${tenantHost}:443/${rest.join("/")}${parsed.search}`;
    }

    return protocols
        ? new NativeWebSocket(url, protocols)
        : new NativeWebSocket(url);
};

window.WebSocket.prototype = NativeWebSocket.prototype;

This workaround is intentionally narrow and temporary. It only rewrites URLs shaped like:

wss://localhost:8080/<tenant>.qlikcloud.com/app/...

Cause

The issue appears to occur only after `qlik.theme.apply()` is called. The theme application path appears to create an additional `engineData` WebSocket where the Qlik Cloud tenant is resolved as a path under the local mashup host instead of as the WebSocket host.

Related Content 

Qlik Cloud Capability API documentation:
Capability API documentation 

Qlik Cloud mashup authentication documentation:
Capability API Auth 

Environment

- Qlik Cloud
- Qlik Capability API
- `qlik.theme.apply()`
- Localhost-hosted mashup
- RequireJS
- Browser WebSocket API