Dynamic Parameters: Dynamic trial types?

[audrey-hemp]

Hi all! I am converting an existing jsPsych web experiment (with JATOS) into a desktop application with Electron. I want users to be able to select their response type at the top of the experiment (keyboard or buttons) and I am having trouble implementing this.

Currently I have select_resp_type as a surveyMultiChoice trial and I know dynamic parameters would allow me to manipulate the prompts and choices of the following trials based on the user input but it won't allow me to change the type of the subsequent trials (jsPsychHtmlButtonResponse or jsPsychHtmlKeyBoardResponse for instance).

In the web version, JATOS response selection allowed me to execute this with the following code as an example trial:

var intro = {
    type: (resp_mode == 'button' ? jsPsychHtmlButtonResponse : jsPsychHtmlKeyboardResponse),
    choices: (resp_mode == 'button' ? [lang.instructions.button.instr_choice] : [lang.instructions.key.instr_choice]),
    prompt: (resp_mode == 'button' ? [lang.instructions.button.prompt0] : [lang.instructions.key.prompt0]),
    stimulus: [lang.instructions.text0],
  }

This was my attempt to convert to dynamic parameters:

var intro = {
    type: function() {
      if (resp_mode == 'button') {
        return jsPsychHtmlButtonResponse;
      }
      else if (resp_mode == 'keyboard') {
        return jsPsychHtmlKeyboardResponse;
      }
    },
    choices: function() {
      if (resp_mode == 'button') {
        return [lang.instructions.button.instr_choice];
      }
      else if (resp_mode == 'keyboard') {
        return [lang.instructions.key.instr_choice];
      }
    },
    prompt: function() {
      if (resp_mode == 'button') {
        return [lang.instructions.button.prompt0];
      }
      else if (resp_mode == 'keyboard') {
        return [lang.instructions.key.prompt0];
      }
    },
    stimulus: [lang.instructions.text0],
  }

It works if I do not try to change the 'type' to a function. If I do, it throws the error:

Uncaught TypeError: Cannot assign to read only property 'Symbol(Symbol.hasInstance)' of function 'class HtmlKeyboardResponsePlugin {
constructor(jsPsych) {
this.jsPsych = jsPsych;
}
trial(display_ele......
}'
at autoBind (index.js:38:1)
at JsPsych.doTrial (JsPsych.ts:568:1)
at JsPsych.nextTrial (JsPsych.ts:551:1)

Please let me know if you have solution for allowing this. Thank you!

[ChristopheBossens]

I think the type parameter is assumed to be one of the jsPsych plugin types. Looking at the jsPsych source code, I found that dynamic parameters are only evaluated after the trial type has been assigned. Using jsPsych 7.3, you can make the type parameter dynamic by including the following code in the jsPsych.js source code at line 2974 (after it checks for a migration error):

if(trial.type.info === undefined){
    trial.type = this.replaceFunctionsWithValues(trial.type, null);
}

@jodeleeuw Would it be an option to make the type parameter dynamic as well?

[audrey-hemp]

Thank you @ChristopheBossens for your reply! Is this something that I can do within jsPsych code in my node-modules (since I'm working with an electron-based app) or is it dependent on a developer change in the source code?

[ChristopheBossens]

I don't have experience with electron-based apps, but if your node-modules contains the file jspsych.js somewhere that's the one you should edit. Not sure if the line numbers will match, but the change I proposed is in the doTrial(trial) function after it checks if the trial.type is a string.

[audrey-hemp]

Got it. I gave it a shot with that change in the source code. Unfortunately it didn't work.

This was the error:

Uncaught TypeError: Cannot assign to read only property 'Symbol(Symbol.hasInstance)' of function 'class HtmlButtonResponsePlugin { constructor(jsPsych) { this.jsPsych = jsPsych; } trial(display_eleme...<omitted>... }'

[ChristopheBossens]

Seems to be the same error as the one in your first post :). Can you check it is not using a cached version? In a web browser I would add a console.log() statement just to check if it is actually doing something with the code, but not sure if you can do the same for an Electron app

[audrey-hemp]

Hi @ChristopheBossens , sorry for the delayed response and thank you for your help. I've tried playing around with using console.log() but I don't think it does the same when in an Electron app. I think that it might be the case that I am not supposed to edit any of the files in node-modules/ that are written from the dependencies in my package.json file on npm install. In that case, I think I may need to wait for a change in the jsPsych source code? @jodeleeuw Is there a workable way around this for me?