Qt for WebAssembly

@lorn-potter I have installed emsdk using ./emsdk install sdk-fastcomp-1.38.27-64bit ./emsdk activate sdk-fastcomp-1.38.27-64bit bcz installation fails(Error : No such tool/sdk) with ./emsdk install sdk-1.38.16-64bit and using online installer as well as offline static build am getting same error for simple Qt Application build error log kmb@ubuntu:~/Work/FEB2020/TestApp/build$ /home/kmb/Qt/5.14.0/wasm_32/bin/qmake .. Info: creating stash file /home/kmb/Work/FEB2020/TestApp/build/.qmake.stash kmb@ubuntu:~/Work/FEB2020/TestApp/build$ make em++ -c -pipe -O3 -std=gnu++11 -s ALLOW_MEMORY_GROWTH=1 -Wall -Wextra -DQT_DEPRECATED_WARNINGS -DQT_NO_DEBUG -DQT_QUICK_LIB -DQT_GUI_LIB -DQT_QMLMODELS_LIB -DQT_QML_LIB -DQT_NETWORK_LIB -DQT_CORE_LIB -I../../TestApp -I. -I../../../../Qt/5.14.0/wasm_32/include -I../../../../Qt/5.14.0/wasm_32/include/QtQuick -I../../../../Qt/5.14.0/wasm_32/include/QtGui -I../../../../Qt/5.14.0/wasm_32/include/QtQmlModels -I../../../../Qt/5.14.0/wasm_32/include/QtQml -I../../../../Qt/5.14.0/wasm_32/include/QtNetwork -I../../../../Qt/5.14.0/wasm_32/include/QtCore -I. -I/home/kmb/.emscripten_ports/openssl/include -I../../../../Qt/5.14.0/wasm_32/mkspecs/wasm-emscripten -o main.o ../main.cpp em++ -c -pipe -O3 -std=gnu++11 -s ALLOW_MEMORY_GROWTH=1 -Wall -Wextra -DQT_DEPRECATED_WARNINGS -DQT_NO_DEBUG -DQT_QUICK_LIB -DQT_GUI_LIB -DQT_QMLMODELS_LIB -DQT_QML_LIB -DQT_NETWORK_LIB -DQT_CORE_LIB -I../../TestApp -I. -I../../../../Qt/5.14.0/wasm_32/include -I../../../../Qt/5.14.0/wasm_32/include/QtQuick -I../../../../Qt/5.14.0/wasm_32/include/QtGui -I../../../../Qt/5.14.0/wasm_32/include/QtQmlModels -I../../../../Qt/5.14.0/wasm_32/include/QtQml -I../../../../Qt/5.14.0/wasm_32/include/QtNetwork -I../../../../Qt/5.14.0/wasm_32/include/QtCore -I. -I/home/kmb/.emscripten_ports/openssl/include -I../../../../Qt/5.14.0/wasm_32/mkspecs/wasm-emscripten -o testapp.js_plugin_import.o /home/kmb/Work/FEB2020/TestApp/build/testapp.js_plugin_import.cpp em++ -c -pipe -O3 -std=gnu++11 -s ALLOW_MEMORY_GROWTH=1 -Wall -Wextra -DQT_DEPRECATED_WARNINGS -DQT_NO_DEBUG -DQT_QUICK_LIB -DQT_GUI_LIB -DQT_QMLMODELS_LIB -DQT_QML_LIB -DQT_NETWORK_LIB -DQT_CORE_LIB -I../../TestApp -I. -I../../../../Qt/5.14.0/wasm_32/include -I../../../../Qt/5.14.0/wasm_32/include/QtQuick -I../../../../Qt/5.14.0/wasm_32/include/QtGui -I../../../../Qt/5.14.0/wasm_32/include/QtQmlModels -I../../../../Qt/5.14.0/wasm_32/include/QtQml -I../../../../Qt/5.14.0/wasm_32/include/QtNetwork -I../../../../Qt/5.14.0/wasm_32/include/QtCore -I. -I/home/kmb/.emscripten_ports/openssl/include -I../../../../Qt/5.14.0/wasm_32/mkspecs/wasm-emscripten -o testapp.js_qml_plugin_import.o /home/kmb/Work/FEB2020/TestApp/build/testapp.js_qml_plugin_import.cpp /home/kmb/Qt/5.14.0/wasm_32/bin/rcc -name qml ../qml.qrc -o qrc_qml.cpp em++ -c -pipe -O3 -std=gnu++11 -s ALLOW_MEMORY_GROWTH=1 -Wall -Wextra -DQT_DEPRECATED_WARNINGS -DQT_NO_DEBUG -DQT_QUICK_LIB -DQT_GUI_LIB -DQT_QMLMODELS_LIB -DQT_QML_LIB -DQT_NETWORK_LIB -DQT_CORE_LIB -I../../TestApp -I. -I../../../../Qt/5.14.0/wasm_32/include -I../../../../Qt/5.14.0/wasm_32/include/QtQuick -I../../../../Qt/5.14.0/wasm_32/include/QtGui -I../../../../Qt/5.14.0/wasm_32/include/QtQmlModels -I../../../../Qt/5.14.0/wasm_32/include/QtQml -I../../../../Qt/5.14.0/wasm_32/include/QtNetwork -I../../../../Qt/5.14.0/wasm_32/include/QtCore -I. -I/home/kmb/.emscripten_ports/openssl/include -I../../../../Qt/5.14.0/wasm_32/mkspecs/wasm-emscripten -o qrc_qml.o qrc_qml.cpp sed -e s/@APPNAME@/TestApp/g /home/kmb/Qt/5.14.0/wasm_32/plugins/platforms/wasm_shell.html > /home/kmb/Work/FEB2020/TestApp/build/TestApp.html cp -f /home/kmb/Qt/5.14.0/wasm_32/plugins/platforms/qtloader.js /home/kmb/Work/FEB2020/TestApp/build cp -f /home/kmb/Qt/5.14.0/wasm_32/plugins/platforms/qtlogo.svg /home/kmb/Work/FEB2020/TestApp/build em++ -s WASM=1 -s FULL_ES2=1 -s USE_WEBGL2=1 -s NO_EXIT_RUNTIME=0 -s ERROR_ON_UNDEFINED_SYMBOLS=1 --bind -O3 -s ALLOW_MEMORY_GROWTH=1 -o ./TestApp.js main.o testapp.js_plugin_import.o testapp.js_qml_plugin_import.o qrc_qml.o /home/kmb/Qt/5.14.0/wasm_32/plugins/platforms/libqwasm.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5EventDispatcherSupport.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5FontDatabaseSupport.a /home/kmb/Qt/5.14.0/wasm_32/lib/libqtfreetype.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5EglSupport.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqgif.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqicns.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqico.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqjpeg.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqtga.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqtiff.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqwbmp.a /home/kmb/Qt/5.14.0/wasm_32/plugins/imageformats/libqwebp.a /home/kmb/Qt/5.14.0/wasm_32/qml/QtQuick.2/libqtquick2plugin.a /home/kmb/Qt/5.14.0/wasm_32/qml/QtQuick/Window.2/libwindowplugin.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5Quick.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5QmlModels.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5Qml.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5Gui.a /home/kmb/Qt/5.14.0/wasm_32/lib/libqtlibpng.a /home/kmb/Qt/5.14.0/wasm_32/lib/libqtharfbuzz.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5Network.a /home/kmb/Qt/5.14.0/wasm_32/lib/libQt5Core.a /home/kmb/Qt/5.14.0/wasm_32/lib/libqtpcre2.a shared:ERROR: '/home/kmb/Qtwasm/emsdk/fastcomp-clang/e1.38.27_64bit/binaryen/bin/asm2wasm ./TestApp.temp.asm.js --total-memory=16777216 --trap-mode=allow -O3 --mem-init=./TestApp.js.mem --mem-base=1024 --wasm-only -o ./TestApp.wasm --mvp-features' failed (-9) Makefile:215: recipe for target 'TestApp.js' failed make: *** [TestApp.js] Error 1 so what is cuase here and i am using Ubuntu 18.04 VM kindly let me root cause

And one more problem is if one of the other basic Qt App gets compiled and build successfully and when i run it using *"emrun .html" using console i am getting application exit error as shown in image [image: eb5f2ad1-d299-4b44-bfdb-68ff30e122ca.png] So what is the reason for getting this.(I am using Firefox browser).

@lorn-potter I have checked it in qt 5.15 with em 1.39.16. but still I have same problem.

Thanks Jon, hope he sees it.

Thanks! The following code, using QFile and a top level path, did indeed work: QFile file(":/dark.qss"); file.open(QFile::ReadOnly); QTextStream stream(&file); pApp->setStyleSheet(stream.readAll());

using the latest emscripten version 1.39.11 seems to work as expected

@lorn-potter ah good to know, thanks for the information :D

Hey @lorn-potter and thanks for your reply and the provided information!

@lorn-potter you mean if I update part of my application I should download all application in my browser?

@guerinoni Thank you for sharing.

Any HTTP/HTTPS server will do. AWS, Apache, nginx, cutelyst, even simple Python/ Qt servers.

its work, thank you.

It is. Thanks.

Hi, I'm having what looks like your same issue: Widgets are not being repainted until I move the mouse. It is working well in Desktop just as in your case. Note this is not a QChart or the like, it its just a few QWidgets. Ive got a small QT WebAssembly application. (Qt 5.14.2 WebAssembly and emscripten 1.38.27-64bit). If any other one is seeing the issue and/or found out what to do about it please enlighten us :). Perhaps there is some js instruction to force the repainting or something like that. I am using a QStackedWidget; I suspect this might be an issue with this specific widget.

Well WebAssembly is pretty strict, if you want to make https requests you need to use a proxy/bridge program that translates from websockets to http, it's installed on a PC on the same LAN as the WebAssembly PC (or on the same PC). For example you could use this one: https://github.com/novnc/websockify

I found a solution for this problem. The import in the QML file has to look like: import QtQuick 2.0 import QtQuick.Controls 1.4 import QtQuick.Controls.Styles 1.4 My mistake was to import the QtQuick.Controls 2.x I also had to delete the build folder and build it from scratch.