Passing parameters to external-html

[madebyafox]

Hi folks!

I'm trying to retrofit an experiment I built using jsPsych v5.0.3. In this study, I used the external-html plugin to display an interactive (d3) data visualization, and the subject's interaction data (clicks, mousepaths) + explicit response were recorded.

(For example, see: [https://warm-citadel-75324.herokuapp.com/ ](session = TEST, condition = 111)

I'm now trying to build a similar study, using jsPsych 7.1 (specifically so I can leverage the web gazer plugin :) BUT I'm running into an issue, passing what I believe are global variables from the experiment.js file to the external-html.

For example, in my experiment.js file I maintain a number of global variables that define how stimuli are generated (subjectID, scenario, condition, etc). In my previous study, I used the on_start parameter to pass the current values of the variables to the external-html plugin, which then was (magically, to me :) able to reference them without any import statements etc. But in my current codebase, I'm getting errors thrown in the external-html page when the embedded javascript can't find the variables. :(

Question: Has the external-html plugin changed such that it can no longer access global vars from the main experiment.js file? If so, what would be an alternative way of passing variables that govern stimulus display to the external page?

Example:

in experiment.js

// var scenario; //is initialized at top of file

 timeline.push({
    type:ExternalHtmlPlugin,
    url: "media/misc/stimulus.html",
    execute_script:true,
    force_refresh:true,
    on_start: function(){
      scenario="A";
      console.log("in on_start: "+scenario);
    }
  });

in stimulus.html

<script >
        console.log("in stimulus.html: "+scenario);
 <script>

When this runs, I get the in_onstart: A console message, but not the in stimulus.html: A one. Instead, I get an error in the console, Uncaught ReferenceError: scenario is not defined. Related but perhaps slightly different, I can't seem to load /access d3 from the external html either.

Thanks in advance! LOVE jsPsych!

[madebyafox]

UPDATE! I suspect this may actually be an issue with my using jsPsych Builder, not jsPsych itself. I rebuilt my app without using the builder, and the variables are now scoped such that I can use them in the external pages, and I'm able to reference d3 without issue.