wasm: fix qtloader.js container element regression

As of Qt 6.5 the html document should not create canvas
elements directly, but instead create div container
elements and let Qt create and manage the canvas elements.

However, qtloaders.js has not been updated to match this
and is still creating canvas elements when given div
elements.

Remove the canvas creation code and invert the primary
and fallback case: config.containerElements is now passed
to instance.qtContainerElements. config.canvasElements
is copied to config.containerElements, if set.

Change-Id: I7372db93ee4de5b23a0a5d992597a3fbd9711a33
Pick-to: 6.5 6.5.1
Reviewed-by: Mikołaj Boc <Mikolaj.Boc@qt.io>
This commit is contained in:
Morten Sørvig 2023-04-26 13:03:09 +02:00 committed by Morten Johan Sørvig
parent 305f61a807
commit 417b61b015

View File

@ -165,26 +165,8 @@ function _QtLoader(config)
while (element.firstChild) element.removeChild(element.firstChild); while (element.firstChild) element.removeChild(element.firstChild);
} }
function createCanvas() { // Set default state handler functions
var canvas = document.createElement("canvas");
canvas.className = "QtCanvas";
canvas.style.height = "100%";
canvas.style.width = "100%";
// Set contentEditable in order to enable clipboard events; hide the resulting focus frame.
canvas.contentEditable = true;
canvas.style.outline = "0px solid transparent";
canvas.style.caretColor = "transparent";
canvas.style.cursor = "default";
return canvas;
}
// Set default state handler functions and create canvases if needed
if (config.containerElements !== undefined) { if (config.containerElements !== undefined) {
config.canvasElements = config.containerElements.map(createCanvas);
config.showError = config.showError || function(errorText, container) { config.showError = config.showError || function(errorText, container) {
removeChildren(container); removeChildren(container);
var errorTextElement = document.createElement("text"); var errorTextElement = document.createElement("text");
@ -197,7 +179,7 @@ function _QtLoader(config)
removeChildren(container); removeChildren(container);
var loadingText = document.createElement("text"); var loadingText = document.createElement("text");
loadingText.className = "QtLoading" loadingText.className = "QtLoading"
loadingText.innerHTML = '<p><center> ${loadingState}...</center><p>'; loadingText.innerHTML = "<p><center>" + loadingState + "</center><p>";
return loadingText; return loadingText;
}; };
@ -220,6 +202,8 @@ function _QtLoader(config)
errorElement.innerHTML = errorHtml; errorElement.innerHTML = errorHtml;
return errorElement; return errorElement;
} }
} else {
config.containerElements = config.canvasElements
} }
config.restartMode = config.restartMode || "DoNotRestart"; config.restartMode = config.restartMode || "DoNotRestart";
@ -432,7 +416,7 @@ function _QtLoader(config)
self.moduleConfig.mainScriptUrlOrBlob = new Blob([emscriptenModuleSource], {type: 'text/javascript'}); self.moduleConfig.mainScriptUrlOrBlob = new Blob([emscriptenModuleSource], {type: 'text/javascript'});
self.qtContainerElements = config.canvasElements; self.qtContainerElements = config.containerElements;
config.restart = function() { config.restart = function() {
@ -486,7 +470,8 @@ function _QtLoader(config)
for (container of config.containerElements) { for (container of config.containerElements) {
var loaderElement = config.showLoader(self.loaderSubState, container); var loaderElement = config.showLoader(self.loaderSubState, container);
container.appendChild(loaderElement); if (loaderElement !== undefined)
container.appendChild(loaderElement);
} }
} }
@ -499,9 +484,10 @@ function _QtLoader(config)
for (var i = 0; i < config.containerElements.length; ++i) { for (var i = 0; i < config.containerElements.length; ++i) {
var container = config.containerElements[i]; var container = config.containerElements[i];
var canvas = config.canvasElements[i]; var canvas = undefined;
if (config.canvasElements !== undefined)
canvas = config.canvasElements[i];
config.showCanvas(canvas, container); config.showCanvas(canvas, container);
container.appendChild(canvas);
} }
} }