Merge pull request #2359 from jspsych/bug-fixes-7.1

Misc. bug fixes for 7.1

.changeset/fast-bikes-clap.md

@@ -0,0 +1,7 @@
+---
+"@jspsych/plugin-video-button-response": patch
+"@jspsych/plugin-video-keyboard-response": patch
+"@jspsych/plugin-video-slider-response": patch
+---
+
+Fixes the `response_allowed_while_playing` parameter to use the `stop` time of the video as the event that enables a response.

.changeset/mean-bees-warn.md

@@ -0,0 +1,9 @@
+---
+"@jspsych/plugin-audio-slider-response": patch
+"@jspsych/plugin-canvas-slider-response": patch
+"@jspsych/plugin-html-slider-response": patch
+"@jspsych/plugin-image-slider-response": patch
+"@jspsych/plugin-video-slider-response": patch
+---
+
+When `require_movement` is `true`, allow changes to the slider using the keyboard to enable the button (#1783).

.changeset/mighty-apricots-approve.md

@@ -0,0 +1,7 @@
+---
+"@jspsych/plugin-video-button-response": patch
+"@jspsych/plugin-video-keyboard-response": patch
+"@jspsych/plugin-video-slider-response": patch
+---
+
+Throw an error when the `stimulus` parameter is not an array, see #1537 and #1530.

packages/plugin-audio-slider-response/src/index.ts

@@ -248,6 +248,10 @@ class AudioSliderResponsePlugin implements JsPsychPlugin<Info> {
         display_element
           .querySelector("#jspsych-audio-slider-response-response")
           .addEventListener("touchstart", enable_button);
+
+        display_element
+          .querySelector("#jspsych-audio-slider-response-response")
+          .addEventListener("change", enable_button);
       }
 
       display_element

packages/plugin-canvas-slider-response/src/index.ts

@@ -206,6 +206,10 @@ class CanvasSliderResponsePlugin implements JsPsychPlugin<Info> {
       display_element
         .querySelector("#jspsych-canvas-slider-response-response")
         .addEventListener("touchstart", enable_button);
+
+      display_element
+        .querySelector("#jspsych-canvas-slider-response-response")
+        .addEventListener("change", enable_button);
     }
 
     display_element

packages/plugin-html-slider-response/src/index.ts

@@ -182,6 +182,10 @@ class HtmlSliderResponsePlugin implements JsPsychPlugin<Info> {
       display_element
         .querySelector("#jspsych-html-slider-response-response")
         .addEventListener("touchstart", enable_button);
+
+      display_element
+        .querySelector("#jspsych-html-slider-response-response")
+        .addEventListener("change", enable_button);
     }
 
     const end_trial = () => {

packages/plugin-image-slider-response/src/index.ts

@@ -365,6 +365,10 @@ class ImageSliderResponsePlugin implements JsPsychPlugin<Info> {
       display_element
         .querySelector("#jspsych-image-slider-response-response")
         .addEventListener("touchstart", enable_button);
+
+      display_element
+        .querySelector("#jspsych-image-slider-response-response")
+        .addEventListener("change", enable_button);
     }
 
     const end_trial = () => {

packages/plugin-video-button-response/src/index.spec.ts

@@ -9,6 +9,24 @@ beforeAll(() => {
   window.HTMLMediaElement.prototype.pause = () => {};
 });
 
+describe("video-button-response", () => {
+  test("throws error when stimulus is not array #1537", async () => {
+    const jsPsych = initJsPsych();
+
+    const timeline = [
+      {
+        type: videoButtonResponse,
+        stimulus: "foo.mp4",
+        choices: ["foo"],
+      },
+    ];
+
+    await expect(async () => {
+      await jsPsych.run(timeline);
+    }).rejects.toThrowError();
+  });
+});
+
 describe("video-button-response simulation", () => {
   test("data mode works", async () => {
     const timeline = [

packages/plugin-video-button-response/src/index.ts

@@ -127,6 +127,13 @@ class VideoButtonResponsePlugin implements JsPsychPlugin<Info> {
   constructor(private jsPsych: JsPsych) {}
 
   trial(display_element: HTMLElement, trial: TrialType<Info>) {
+    if (!Array.isArray(trial.stimulus)) {
+      throw new Error(`
+        The stimulus property for the video-button-response plugin must be an array
+        of files. See https://www.jspsych.org/latest/plugins/video-button-response/#parameters
+      `);
+    }
+
     // setup stimulus
     var video_html = "<div>";
     video_html += '<video id="jspsych-video-button-response-stimulus"';
@@ -261,6 +268,9 @@ class VideoButtonResponsePlugin implements JsPsychPlugin<Info> {
       video_element.addEventListener("timeupdate", (e) => {
         var currenttime = video_element.currentTime;
         if (currenttime >= trial.stop) {
+          if (!trial.response_allowed_while_playing) {
+            enable_buttons();
+          }
           video_element.pause();
           if (trial.trial_ends_after_video && !stopped) {
             // this is to prevent end_trial from being called twice, because the timeupdate event

packages/plugin-video-keyboard-response/src/index.spec.ts

@@ -9,6 +9,24 @@ beforeAll(() => {
   window.HTMLMediaElement.prototype.pause = () => {};
 });
 
+// I can't figure out how to get this tested with jest
+describe("video-keyboard-response", () => {
+  test("throws error when stimulus is not array #1537", async () => {
+    const jsPsych = initJsPsych();
+
+    const timeline = [
+      {
+        type: videoKeyboardResponse,
+        stimulus: "foo.mp4",
+      },
+    ];
+
+    await expect(async () => {
+      await jsPsych.run(timeline);
+    }).rejects.toThrowError();
+  });
+});
+
 describe("video-keyboard-response simulation", () => {
   test("data mode works", async () => {
     const timeline = [

packages/plugin-video-keyboard-response/src/index.ts

@@ -107,6 +107,14 @@ class VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {
   constructor(private jsPsych: JsPsych) {}
 
   trial(display_element: HTMLElement, trial: TrialType<Info>) {
+    // catch mistake where stimuli are not an array
+    if (!Array.isArray(trial.stimulus)) {
+      throw new Error(`
+        The stimulus property for the video-keyboard-response plugin must be an array
+        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
+      `);
+    }
+
     // setup stimulus
     var video_html = "<div>";
     video_html += '<video id="jspsych-video-keyboard-response-stimulus"';
@@ -214,6 +222,15 @@ class VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {
       video_element.addEventListener("timeupdate", (e) => {
         var currenttime = video_element.currentTime;
         if (currenttime >= trial.stop) {
+          if(!trial.response_allowed_while_playing) {
+            var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({
+              callback_function: after_response,
+              valid_responses: trial.choices,
+              rt_method: 'performance',
+              persist: false,
+              allow_held_key: false,
+            });
+          }
           video_element.pause();
           if (trial.trial_ends_after_video && !stopped) {
             // this is to prevent end_trial from being called twice, because the timeupdate event

packages/plugin-video-slider-response/src/index.spec.ts

@@ -9,6 +9,23 @@ beforeAll(() => {
   window.HTMLMediaElement.prototype.pause = () => {};
 });
 
+describe("video-slider-response", () => {
+  test("throws error when stimulus is not array #1537", async () => {
+    const jsPsych = initJsPsych();
+
+    const timeline = [
+      {
+        type: videoSliderResponse,
+        stimulus: "foo.mp4",
+      },
+    ];
+
+    await expect(async () => {
+      await jsPsych.run(timeline);
+    }).rejects.toThrowError();
+  });
+});
+
 describe("video-slider-response simulation", () => {
   test("data mode works", async () => {
     const timeline = [

packages/plugin-video-slider-response/src/index.ts

@@ -150,6 +150,13 @@ class VideoSliderResponsePlugin implements JsPsychPlugin<Info> {
   constructor(private jsPsych: JsPsych) {}
 
   trial(display_element: HTMLElement, trial: TrialType<Info>) {
+    if (!Array.isArray(trial.stimulus)) {
+      throw new Error(`
+        The stimulus property for the video-slider-response plugin must be an array
+        of files. See https://www.jspsych.org/latest/plugins/video-slider-response/#parameters
+      `);
+    }
+
     // half of the thumb width value from jspsych.css, used to adjust the label positions
     var half_thumb_width = 7.5;
 
@@ -316,6 +323,10 @@ class VideoSliderResponsePlugin implements JsPsychPlugin<Info> {
             stopped = true;
             end_trial();
           }
+
+          if (!trial.response_allowed_while_playing) {
+            enable_slider();
+          }
         }
       });
     }
@@ -334,6 +345,10 @@ class VideoSliderResponsePlugin implements JsPsychPlugin<Info> {
       display_element
         .querySelector("#jspsych-video-slider-response-response")
         .addEventListener("touchstart", enable_button);
+
+      display_element
+        .querySelector("#jspsych-video-slider-response-response")
+        .addEventListener("change", enable_button);
     }
 
     var startTime = performance.now();