Kha

Kha copied to clipboard

Describe the bug kha.window.notifyOnResize provides incorrect width and height values when using Debug HTML5 / Electron

To Reproduce Steps to reproduce the behavior:

1. Add a simple callback to kha.window.notifyOnResize that prints both width and height values.
2. Run project using native and make note of the reported values.
3. Run project using debug HTML5 and make note of the reported values.
4. The two values do not match.

Expected behavior The output of Debug HTML5 should match that of the native application.

Screenshots

Execution Environment:

• Host system (where you compile your code): Arch Linux x86_64 5.12.14-arch1-1
• Target system (where you run your code): Same as the host system
• IDE used (if any): VSCodium (fork of Visual Studio Code)
• Kha revision: a906804e
• Kha build output (Using Kha...):

Creating Kha project.
Compiling shader 1 of 8 (painter-colored.frag.glsl).
Compiling shader 2 of 8 (painter-colored.vert.glsl).
Compiling shader 3 of 8 (painter-image.frag.glsl).
Compiling shader 4 of 8 (painter-image.vert.glsl).
Compiling shader 5 of 8 (painter-text.frag.glsl).
Compiling shader 6 of 8 (painter-text.vert.glsl).
Compiling shader 7 of 8 (painter-video.frag.glsl).
Compiling shader 8 of 8 (painter-video.vert.glsl).
Using Kinc (c36a3e67) from /home/doczid/Projects/Programming/kha/Kha/Kinc
kincfile found.
Creating Linux project files.
Compiling...
make: 'New-Project' is up to date.
Build time: 0m 0s
Starting Kinc
Starting application

• Application output (if it runs): For Debug HTML5:

ScaleManager.hx:8: New window: 926 x 1280

For native:

ScaleManager.hx:8: New window: 766 x 1059

Additional context Maybe it's a Linux specific issue?

I managed to narrow down the issue to DPI scaling.

On my setup, I change the Xft.dpi parameter for the X11 Server from the default 96 to a non-standard 80. Temporarily resetting it to 96 makes Electron display the correct window size and Kha reports it correctly, too.

I am 99% sure this is an Electron issue, however, if it can be universally fixed by e.g.: including the screen module and checking the scale factor in electron.js, I think it would benefit Kha / Khamake.

Kha should always report the size in pixels, independent of dpi-settings. We're probably still missing something to make that work properly in html5, will have a look.

The plot thickens...

When launching from the terminal, the resolution is reported correctly. However, when launching from the VSCode build task, the resolution is incorrect! I have checked if it's related to VSCode zoom settings, and it is not. I will try to check what enviromental variables VSCode passes, maybe the issue lies there.

I think this issue is safe to close now as it probably has no relation to Kha, only to Electron/Linux/VSCode.

Still want to have a look :) And GitHub should really add support for issue-priorities.

I found out that the issue only occurs when the debugger type is pwa-chrome. Using node, chrome or even pwa-node resolves the issue. However, debugging is made more difficult due to having to set the output capture source to standard output, which also captures Chromium logs.

I can confirm that the issue lied with Electron's automatic HiDPI scaling. Adding the command line flag --force-device-scale-factor=1 makes kha.System.windowWidth() / kha.System.windowHeight() behave normally, and it does not change the appearance of the display at all.

Relevant question: I want to add this command line switch permanently via electron.js. Is there a way to override electron.js like with index.html via the Assets directory or do I need to mess with khamake?

If it's the latter, I will probably create a PR that allows setting it to 1 via a khafile.js parameter like project.targetOptions.html5.electronDisableScaling.

Currently "--force-device-scale-factor=1" makes electron window blurry on any device with dpi > 1. If you try to remove that flag from launch.json, kha window resize logic stops working. Idk why resizing actually works in electron currently, there is no code like canvas.width = window.width * devicePixelRatio