jatos.onLoad and promises

steffejr

Hello all,

It took me a very long time to identify this problem. I use JATOS and jsPsych together. In my jsPsych I am dynamically loading .js files using promises. If I use jsPsych alone (on my local machine, no JATOS) everything works fine. When I embed this into JATOS, the jatos.onLoad executes before the promises are resolved and I get an error. If I add a "Welcome to the task, press the next button to continue" into my jsPsych task, I do not get the unresolved promise error and everything is OK. I would like to NOT have this extra step and screen in my tasks though.

Thank you

kri

Hello,

this should be possible. Can you send us some code here? We don't need the whole code, it should be enough to see the part of your JS with the jatos.onLoad, the part where you load the files, and the part where your start jsPsych.

Best,

Kristian

steffejr

I just made my code public. It is pretty massive, and I would love to chat with you at some point about all the cool things I did with JATOS and jsPsych.

I am going to try and paraphrase what I have in this code (Note the branch is not main):

https://github.com/NCMlab/NCMLabOnlineTools/blob/DynamicLoad/html/JATOS/Questionnaire.html

I start an onLoad (line 89) and perform a lot of parameter loading which come from the setup script loaded in line 79. Once I figure out what the settings and spoken language to use are, I load the appropriate questionnaire on line 119. This uses a promise to load a JS file based on the parameters.

I initialize jsPsych on line 139 and use some parameters I store in JATOS.

I have another jatos.onLoad on line 175 where I call jsPsych.run(timeline)

The problem is that this jsPsych.run (line 175) executes and begins before the promise on line 119 has finished. The beginning of the jsPsych timeline is below. The error will come from the "LoadQuestionnaire" condition when the optional "Welcome" condition is "turned off." The LoadQuestionnaire condition cannot find the "parameters."

timeline.push(Welcome)

timeline.push(LoadQuestionnaire)

NOTE: line 110 hardcodes the ShowWelcome flag to true to always show the welcome screen requiring a button press. I want to not have this be a requirement.

Thank you, Jason

kri

Hi Jason,

sorry for taking so long to answer, I was busy releasing the new version of JATOS.

You have some pretty complicated code here. It took me a while to see what I think is the culprit here.

There is a lot going on in this script. Many scripts are loaded dynamically. But the good thing is, they are loaded sequential and we can rely on their execution one after another. The last loaded script is jatos.js. Afterwards we have three jatos.onLoad . Although they are called asynchronously when jatos.js is done initializing, we can at least rely on the three callbacks to be called sequentially: this means that jsPsych.run is called after promise1 = loadScript(fileName).

What I think is the problem here, is that it uses Promises to load the script and Promises are by definition asynchronous. That means the browser, after starting the loading of the script, does not wait for it to be finished, it just continues with the next lines ... and finally runs jsPsych.run.

It is in the nature of asynchronous that one can not determine the time when it will be executed, it depends on many factors, one of them is the Internet connection and how fast the script data can be loaded. So, the execution of the dynamically loaded script could be before or after the execution of jsPsych.run. The latter one is what I think causes your problem.

The solution with asking the participant to click a button is not really a solution in my view (although I'm not sure at which point in the code the button is actually displayed in the code). It just adds time that the browser can use to finish downloading the script and executing it.

An easy solution for this could be, since you already have a Promise, to put everything that comes afterwards in jatos.onLoad within the then callback. It could look similar to this:

promise1 = loadScript(fileName)
    .then( data  => {
        console.log("Script loaded successfully", data);

        //load general label names
        pseudoSwitch(LANG+'_LabelNames')
        dynamicallyLoadScript("functions/Experiments/Questionnaire_experiment.js")
        
        var setup = []
        var TrialCount = 1;
        var jsPsych = initJsPsych({
            ...
        })
        
        var JATOSID = jatos.workerId;
        console.log(jatos)
        console.log(JATOSID)

        var resultsData = {'name':'JASON'};
        jatos.addJatosIds(resultsData);
        jsPsych.run(timeline);
        
        UpdateHeader()
    })  

But I didn't test this code.

Best,

Kristian

steffejr

Hello Kristian,

Thank you for this. The handling of the promise works well. But this introduced a new problem. The jsPsych variable can no longer be accessed in the jsPsych.run(timeline).

The timeline will run but I have a step where I score the data to send to JATOS and I get errors saying that the jsPsych variable cannot be accessed.

It turns out that I now need to replace a call like:

jsPsych.data.get().filter({trial: 'Questionnaire'})

with

this.type.jsPsych.data.get().filter({trial: 'Questionnaire'})

And now it works.

Jason

kri

Nice you figured it out, Jason! Good luck with your experiment!