fix: fixed #2184

arnog · Nov 25, 2023 · 4717afb · 4717afb
1 parent 87125f5
commit 4717afb
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 24 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -16,6 +16,7 @@
 
 - If there were multiple mathfield elements on the page, only
   the last one would display tooltips.
+- **#2184** Pressing the <kbd>TAB</kbd> key when in a prompt (fill-in-the-blank) would not move to the next prompt
 
 ## 0.97.2 (2023-11-21)
 

diff --git a/src/core/parser.ts b/src/core/parser.ts
@@ -1499,17 +1499,10 @@ export class Parser {
       else body = defaultAtoms;
       if (id) {
         return [
-          new PromptAtom(
-            id,
-            correctness,
-            // locked,
-            locked,
-            body ?? defaultAtoms,
-            {
-              mode: this.parseMode,
-              style: this.style,
-            }
-          ),
+          new PromptAtom(id, correctness, locked, body ?? defaultAtoms, {
+            mode: this.parseMode,
+            style: this.style,
+          }),
         ];
       }
       return [new PlaceholderAtom({ mode: this.parseMode, style: this.style })];

diff --git a/src/editor-model/commands-move.ts b/src/editor-model/commands-move.ts
@@ -553,7 +553,14 @@ register(
       // 3/ Find a placeholder, a prompt or empty group.
       // They have priority over other options below
       //
-      const target = leapTarget(model, model.position + 1, 'forward');
+
+      // If we're in a prompt, start looking after the prompt
+      const parentPrompt = model.at(model.anchor).parentPrompt;
+      const origin = parentPrompt
+        ? model.offsetOf(parentPrompt) + 1
+        : Math.max(model.position + 1, 0);
+
+      const target = leapTarget(model, origin, 'forward');
       if (target) return leapTo(model, target);
 
       //
@@ -644,7 +651,13 @@ register(
       //
       // 3/ Find a placeholder, a prompt or empty group.
       //
-      const target = leapTarget(model, model.position - 1, 'backward');
+      // If we're in a prompt, start looking before the prompt
+      const parentPrompt = model.at(model.anchor).parentPrompt;
+      const origin = parentPrompt
+        ? model.offsetOf(parentPrompt.leftSibling)
+        : Math.max(model.position - 1, 0);
+
+      const target = leapTarget(model, origin, 'backward');
       if (target) return leapTo(model, target);
 
       //

diff --git a/test/prompts/index.html b/test/prompts/index.html
@@ -16,7 +16,7 @@
         margin-bottom: 1em;
       }
       math-field::part(prompt) {
-        background: palegreen;
+        background: palegoldenrod;
       }
       math-field {
         --prompt-min-width: 50px;
@@ -61,21 +61,21 @@ <h1>Prompts Test</h1>
     </main>
 
     <script type="module">
-      import { MathfieldElement } from '/dist/mathlive.mjs';
+      import { MathfieldElement } from "/dist/mathlive.mjs";
 
-      const prompt = document.getElementById('mf-prompt');
-      prompt.addEventListener('placeholder-change', (ev) => {
-        console.log('placeholder-change', ev.detail);
+      const prompt = document.getElementById("mf-prompt");
+      prompt.addEventListener("placeholder-change", (ev) => {
+        console.log("placeholder-change", ev.detail);
       });
       // mf.registers = {
       //   ...mf.registers,
       //   ...{ fboxsep: { dimension: 10, unit: 'pt' } },
       // };
-      prompt.addEventListener('input', (evt) => {
+      prompt.addEventListener("input", (evt) => {
         const prompts = prompt.getPrompts();
         console.log(prompts);
         prompts.forEach((x) =>
-          console.log('Prompt', x, prompt.getPromptValue(x))
+          console.log("Prompt", x, prompt.getPromptValue(x))
         );
       });
 
@@ -97,14 +97,14 @@ <h1>Prompts Test</h1>
 
       function logEvent(evt) {
         const stackTraceFrames = String(new Error().stack)
-          .replace(/^Error.*\n/, '')
-          .split('\n')
-          .map((x) => x.replace(/\(.*\)/, ''));
+          .replace(/^Error.*\n/, "")
+          .split("\n")
+          .map((x) => x.replace(/\(.*\)/, ""));
         stackTraceFrames.shift();
 
         console.log(evt.type, (evt.target?.id || evt.target?.tagName) ?? evt);
         if (stackTraceFrames.length > 0)
-          console.log(stackTraceFrames.join('\n'));
+          console.log(stackTraceFrames.join("\n"));
         // console.log(evt);
         updateButtons();
       }