From 7d19525db91452c65ce3a8b40be35fca2e99346e Mon Sep 17 00:00:00 2001
From: jade <101148768+jadeddelta@users.noreply.github.com>
Date: Sun, 1 Dec 2024 23:55:50 -0500
Subject: [PATCH] parameterize autofocus, fix last test

---
 .changeset/spotty-mails-cheat.md        |  2 +-
 docs/plugins/cloze.md                   |  1 +
 packages/plugin-cloze/src/index.spec.ts |  9 +++------
 packages/plugin-cloze/src/index.ts      | 11 ++++++++++-
 4 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/.changeset/spotty-mails-cheat.md b/.changeset/spotty-mails-cheat.md
index 3bf24ee0..399ac45b 100644
--- a/.changeset/spotty-mails-cheat.md
+++ b/.changeset/spotty-mails-cheat.md
@@ -2,4 +2,4 @@
 "@jspsych/plugin-cloze": minor
 ---
 
-adds support for multiple correct answers and case sensitivity
+adds support for multiple correct answers, case sensitivity, and autofocus.
diff --git a/docs/plugins/cloze.md b/docs/plugins/cloze.md
index f7b869f4..4830e181 100644
--- a/docs/plugins/cloze.md
+++ b/docs/plugins/cloze.md
@@ -16,6 +16,7 @@ In addition to the [parameters available in all plugins](../overview/plugins.md#
 | allow_blanks  | boolean  | true               | Boolean value indicating if the answers given by participants should be checked for completion after the button was clicked. If ```true```, answers are not checked for completion and blank answers are allowed. The trial will then automatically finish upon the clicking the button. If ```false```, answers are checked for completion, and in case there are some fields with missing answers, the ```mistake_fn``` is called. In this case, the trial does not automatically finish. |
 | case_sensitivity | boolean  | true            | Boolean value indicating if the answers given by participants should also be checked to have the right case along with correctness. If set to ```false```, case is disregarded and participants may type in whatever case they please. | 
 | mistake_fn    | function | ```function(){}``` | Function called if ```check_answers``` is set to ```true``` and there is a difference between the participant's answers and the correct solution provided in the text, or if ```allow_blanks``` is set to ```false``` and there is at least one field with a blank answer. |
+| autofocus     | boolean  | true               | Boolean value indicating if the first input field should be focused when the trial starts. Enabled by default, but may be disabled especially if participants are using screen readers. |
 
 ## Data Generated
 
diff --git a/packages/plugin-cloze/src/index.spec.ts b/packages/plugin-cloze/src/index.spec.ts
index ec92cdb4..045373af 100644
--- a/packages/plugin-cloze/src/index.spec.ts
+++ b/packages/plugin-cloze/src/index.spec.ts
@@ -8,11 +8,6 @@ const getInputElementById = (id: string) => document.getElementById(id) as HTMLI
 
 const clickFinishButton = () => clickTarget(document.querySelector("#finish_cloze_button"));
 
-// reset DOM
-beforeEach(() => {
-  document.body.innerHTML = "";
-});
-
 describe("cloze", () => {
   test("displays cloze", async () => {
     const { getHTML, expectFinished } = await startTimeline([
@@ -205,7 +200,7 @@ describe("cloze", () => {
     await expectFinished();
   });
 
-  test.skip("calls mistake function on button click when answers are checked and do not belong to a multiple answer blank", async () => {
+  test("calls mistake function on button click when answers are checked and do not belong to a multiple answer blank", async () => {
     const mistakeFn = jest.fn();
 
     const { expectFinished } = await startTimeline([
@@ -221,6 +216,8 @@ describe("cloze", () => {
     await clickFinishButton();
     expect(mistakeFn).toHaveBeenCalled();
 
+    getInputElementById("input0").value = "cloze";
+    await clickFinishButton();
     await expectFinished();
   });
 
diff --git a/packages/plugin-cloze/src/index.ts b/packages/plugin-cloze/src/index.ts
index 9c4aa073..85de2d24 100644
--- a/packages/plugin-cloze/src/index.ts
+++ b/packages/plugin-cloze/src/index.ts
@@ -59,6 +59,14 @@ const info = <const>{
       type: ParameterType.FUNCTION,
       default: () => {},
     },
+    /**
+     * Boolean value indicating if the first input field should be focused when the trial starts.
+     * Enabled by default, but may be disabled especially if participants are using screen readers.
+     */
+    autofocus: {
+      type: ParameterType.BOOL,
+      default: true,
+    }
   },
   data: {
     /** Answers the participant gave. */
@@ -145,7 +153,8 @@ class ClozePlugin implements JsPsychPlugin<Info> {
       "</button>";
     display_element.querySelector("#finish_cloze_button").addEventListener("click", check);
 
-    (display_element.querySelector("#input0") as HTMLElement).focus();
+    if (trial.autofocus)
+      (display_element.querySelector("#input0") as HTMLElement).focus();
   }
 
   private getSolutions(text: string, case_sensitive: boolean): string[][] {