Keep track of the last fragment or sub-slide displayed when moving back or forward (#11)

brichet · web-flow · commit 8605410d2d77 · 2025-01-08T15:54:27.000+01:00
* Keep current fragment or subslide in memory when moving back or forward

* add tests

* lint
diff --git a/atest/resources/Deck.resource b/atest/resources/Deck.resource
@@ -112,7 +112,7 @@ Filter Visible Elements
     RETURN    ${visible}
     [Teardown]    Resume Screenshots
 
-Advance Notebook Deck With Keyboard
+Advance Notebook Deck With Space
     [Documentation]    Go to the down/forward slide with space, wait a bit, then screenshot.
     [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}    ${backup}=${FALSE}
     ${index} =    Get Active Cell Index
@@ -130,18 +130,47 @@ Advance Notebook Deck With Keyboard
     IF    ${screenshot.__len__()}    Capture Page Screenshot    ${screenshot}
     [Teardown]    Resume Screenshots
 
+Back Or Forward Notebook Deck With Arrows
+    [Documentation]    Go to the back/forward slide with arrows, wait a bit, then screenshot.
+    [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}    ${backup}=${FALSE}
+    ${index} =    Get Active Cell Index
+    Send Error Screenshots To Trash
+    IF    ${backup}
+        Press Keys    css:body    ARROW_LEFT
+    ELSE
+        Press Keys    css:body    ARROW_RIGHT
+    END
+    Wait Until Cell Is Not Active    ${index}    1s
+    IF    ${expect.__len__()}
+        Wait Until Element Contains    css:${JLAB CSS ACTIVE CELL}    ${expect}
+    END
+    Resume Screenshots
+    IF    ${screenshot.__len__()}    Capture Page Screenshot    ${screenshot}
+    [Teardown]    Resume Screenshots
+
 Back Up Deck With Keyboard
     [Documentation]    Go to the up/back slide with space, wait a bit, then screenshot.
     [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}
-    Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
+    Advance Notebook Deck With Space    ${screenshot}    ${expect}    backup=${TRUE}
 
-Really Advance Notebook Deck With Keyboard
+Really Advance Notebook Deck With Space
     [Documentation]    REALLY go to the down/forward slide with space, wait a bit, then screenshot.
     [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}    ${backup}=${FALSE}
     Wait Until Keyword Succeeds    5x    0.5s
-    ...    Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    ${backup}
+    ...    Advance Notebook Deck With Space    ${screenshot}    ${expect}    ${backup}
 
-Really Back Up Deck With Keyboard
+Really Back Up Deck With Space
     [Documentation]    REALLY go to the up/back slide with space, wait a bit, then screenshot.
     [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}
-    Really Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
+    Really Advance Notebook Deck With Space    ${screenshot}    ${expect}    backup=${TRUE}
+
+Really Move Forward Deck With Arrow
+    [Documentation]    REALLY go to back or forward slide with arrow, wait a bit, then screenshot.
+    [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}    ${backup}=${FALSE}
+    Wait Until Keyword Succeeds    5x    0.5s
+    ...    Back Or Forward Notebook Deck With Arrows    ${screenshot}    ${expect}    ${backup}
+
+Really Move Back Deck With Arrow
+    [Documentation]    REALLY go to back slide with arrow, wait a bit, then screenshot.
+    [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}
+    Really Move Forward Deck With Arrow    ${screenshot}    ${expect}    backup=${TRUE}
diff --git a/atest/resources/Docs.resource b/atest/resources/Docs.resource
@@ -39,6 +39,16 @@ Start Notebook Deck With Subslides
     Make Markdown Cell    subslide 2    subslide 2
     Select A Slide Type    5    subslide    s2-02-new-subslide.png
 
+Start Advanced Notebook Deck
+    [Documentation]    Make a few cells with fragments and subslides
+    Execute JupyterLab Command    Close All Tabs
+    Start Empty Notebook Deck
+    Click Element    css:${JLAB CSS ACTIVE CELL}
+    Make Markdown Cell    \# Slide 1    Slide 1    new=${FALSE}    screenshot=s2-00-slide1.png
+    Make Markdown Cell    - Fragment 1.1    Fragment 1.1    screenshot=s2-01-fragment1.png
+    Make Markdown Cell    \# Slide 2    Slide 2    screenshot=s2-02-slide2.png
+    Make Markdown Cell    - Fragment 2.1    Fragment 2.1    screenshot=s2-03-fragment2.png
+
 Tear Down Interactive Suite
     [Documentation]    Clean up after this suite.
     Execute JupyterLab Command    Close All Tabs
diff --git a/atest/suites/lab/02-navigate.robot b/atest/suites/lab/02-navigate.robot
@@ -22,10 +22,10 @@ Build and Navigate a Notebook Slide With Keyboard
     [Documentation]    Build and navigate a basic slide.
     Set Attempt Screenshot Directory    lab${/}navigate${/}keyboard
     Start Basic Notebook Deck
-    Really Back Up Deck With Keyboard    s0-03-backup.png    item1234
-    Really Back Up Deck With Keyboard    s0-04-backup.png    World
-    Really Advance Notebook Deck With Keyboard    s0-05-advance.png    item1234
-    Really Advance Notebook Deck With Keyboard    s0-06-advance.png    item4567
+    Really Back Up Deck With Space    s0-03-backup.png    item1234
+    Really Back Up Deck With Space    s0-04-backup.png    World
+    Really Advance Notebook Deck With Space    s0-05-advance.png    item1234
+    Really Advance Notebook Deck With Space    s0-06-advance.png    item4567
 
 Build and Navigate a Notebook Slide With Anchors
     [Documentation]    Build and navigate a basic slide.
@@ -43,3 +43,12 @@ Build and Navigate a Notebook Slide With Subslides
     Really Back Up Deck With Keyboard    s2-04-backup.png    item4567
     Really Advance Notebook Deck With Keyboard    s2-05-advance.png    subslide 1
     Really Advance Notebook Deck With Keyboard    s2-06-advance.png    subslide 2
+
+Build and Navigate an Advanced Notebook Deck With Arrows
+    [Documentation]    Build and navigate a basic slide.
+    Set Attempt Screenshot Directory    lab${/}navigate${/}arrows
+    Start Advanced Notebook Deck
+    Really Move Back Deck With Arrow    s2-04-back.png    Slide 1
+    Really Advance Notebook Deck With Space    s2-05-advance.png    Fragment 1
+    Really Move Forward Deck With Arrow    s2-06-advance.png    Fragment 2
+    Really Move Back Deck With Arrow    s2-07-back.png    Fragment 1
diff --git a/js/jupyterlab-slideshow/src/notebook/presenter.ts b/js/jupyterlab-slideshow/src/notebook/presenter.ts
@@ -382,9 +382,17 @@ export class NotebookPresenter implements IPresenter<NotebookPanel> {
     const fromExtentAlternate = alternate && activeExtent && activeExtent[alternate];
 
     if (fromExtent != null) {
-      panel.content.activeCellIndex = fromExtent;
+      let moveTo = fromExtent;
+      if (['back', 'forward'].includes(direction)) {
+        moveTo = this._slideBackup(extents, activeCellIndex, fromExtent);
+      }
+      panel.content.activeCellIndex = moveTo;
     } else if (fromExtentAlternate != null) {
-      panel.content.activeCellIndex = fromExtentAlternate;
+      let moveTo = fromExtentAlternate;
+      if (['back', 'forward'].includes(direction)) {
+        moveTo = this._slideBackup(extents, activeCellIndex, fromExtentAlternate);
+      }
+      panel.content.activeCellIndex = moveTo;
     } else {
       console.warn(
         EMOJI,
@@ -575,6 +583,7 @@ export class NotebookPresenter implements IPresenter<NotebookPanel> {
       back: null,
       up: null,
       down: null,
+      redirect: null,
       ...extent,
       index,
       slideType,
@@ -903,6 +912,48 @@ export class NotebookPresenter implements IPresenter<NotebookPanel> {
 
     return extents;
   }
+
+  /**
+   * This function must be called only when moving back or forward.
+   * It will backup the current fragment or subslide in the parent slide extent,
+   * to go back to it on a future use of back or forward move.
+   *
+   * @param extents - the extents for the current NotebookModel.
+   * @param current - the index of the current active cell.
+   * @param target - the index of the targeted cell (should be a slide).
+   * @returns - the index of the next active cell to move to if there was a redirection
+   * set up.
+   */
+  protected _slideBackup(
+    extents: NotebookPresenter.TExtentMap,
+    current: number,
+    target: number,
+  ) {
+    // Set parent slide redirection
+    let parentSlide = extents.get(current);
+    while (parentSlide && parentSlide?.slideType !== 'slide') {
+      if (parentSlide.up !== null) {
+        parentSlide = extents.get(parentSlide.up);
+      } else {
+        break;
+      }
+    }
+    // Do not set redirection on parent slide if the target is the parent slide,
+    // or if the current is a slide.
+    if (parentSlide?.index === current || parentSlide?.index === target) {
+      parentSlide.redirect = null;
+    } else if (parentSlide?.slideType === 'slide') {
+      parentSlide.redirect = current;
+    }
+
+    // Return target redirection (if exist)
+    const targetExtent = extents.get(target);
+    if (targetExtent?.redirect) {
+      return targetExtent.redirect;
+    } else {
+      return target;
+    }
+  }
 }
 
 export namespace NotebookPresenter {
@@ -923,6 +974,7 @@ export namespace NotebookPresenter {
     onScreen: number[];
     visible: number[];
     notes: number[];
+    redirect: number | null;
   }
   export type TExtentMap = Map<number, IExtent>;
   /** a map of active slide to active layers */
