Add basic markdown presenter (#32)

deathbeds · Nov 3, 2022 · b0ab1e8 · b0ab1e8
1 parent 85000f5
commit b0ab1e8
Show file tree

Hide file tree

Showing 26 changed files with 652 additions and 207 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,11 +2,13 @@
 
 ### `0.1.3` (unreleased)
 
+- [#19] adds a basic Markdown presenter, with slides delimited by `---`
 - [#22] adds a stack of previously-viewed documents when navigating between documents
 - [#27] adds a drag-and-drop _slide layout_ overlay and design tools to support
   customization
 - [#29] adds support for using `#<header>` anchors while presenting
 
+[#19]: https://github.com/deathbeds/jupyterlab-deck/issues/19
 [#22]: https://github.com/deathbeds/jupyterlab-deck/issues/22
 [#27]: https://github.com/deathbeds/jupyterlab-deck/issues/27
 [#29]: https://github.com/deathbeds/jupyterlab-deck/issues/29

diff --git a/atest/resources/Deck.resource b/atest/resources/Deck.resource
@@ -13,15 +13,38 @@ ${ZERO_PAD}     {0:03d}
 *** Keywords ***
 Start Deck With Notebook Toolbar Button
     [Documentation]    Use the notebook toolbar to start deck.
-    Wait Until Element Is Not Visible    css:${CSS_LAB_SPINNER}
+    Wait Until Element Is Not Visible    css:${CSS_LAB_SPINNER}    timeout=1s
     Click Element    css:${JLAB CSS ACTIVE DOC}
     Click Element    css:${CSS_DECK_NOTEBOOK_BUTTON}
-    Wait Until Element Is Visible    css:${CSS_DECK_PRESENTING}
-    Wait Until Element Is Visible    css:${CSS_DECK_VISIBLE}
+    Wait Until Element Is Visible    css:${CSS_DECK_PRESENTING}    timeout=1s
+    Wait Until Element Is Visible    css:${CSS_DECK_VISIBLE}    timeout=1s
 
 Really Start Deck With Notebook Toolbar Button
     [Documentation]    REALLY use the notebook toolbar to start deck.
+    Send Error Screenshots To Trash
     Wait Until Keyword Succeeds    5x    0.1s    Start Deck With Notebook Toolbar Button
+    [Teardown]    Resume Screenshots
+
+Start Markdown Deck From Editor
+    [Documentation]    Start a deck from a markdown editor with the context menu.
+    [Arguments]    ${host}
+    Select From Context Menu    ${CSS_LAB_EDITOR}    li${CSS_LAB_CMD_MARKDOWN_PREVIEW}
+    Close JupyterLab Dock Panel Tab    ${host}
+    Close JupyterLab Dock Panel Tab    Launcher
+    Click Element    css:${CSS_LAB_MARKDOWN_VIEWER}
+    Execute JupyterLab Command    Start Deck
+    Wait Until Element Is Visible    css:${CSS_DECK}
+    Click Element    css:${CSS_DECK}
+
+Select From Context Menu
+    [Documentation]    Open the context menu and click an item.
+    [Arguments]    ${host}    ${item}
+    Open Context Menu    css:${host}
+    Wait Until Element Is Visible    css:${item}
+    Mouse Over    css:${item} ${CSS_LM_MENU_ITEM_LABEL}
+    Wait Until Element Is Visible    css:${item}${CSS_LM_MOD_ACTIVE}
+    Click Element    css:${item}${CSS_LM_MOD_ACTIVE} ${CSS_LM_MENU_ITEM_LABEL}
+    Wait Until Element Is Not Visible    css:${item}
 
 Stop Deck With Remote
     [Documentation]    Use the on-screen remote to stop deck.
@@ -60,12 +83,7 @@ Advance Deck With Remote And Screenshot
 Maybe Click An Anchor And Return
     [Documentation]    If a `#` anchor exists, click it, and come back
     [Arguments]    ${host}    ${screenshot}=${EMPTY}
-    IF    ${host.__contains__(".ipynb")}
-        ${anchor_links} =    Get WebElements
-        ...    css:${JLAB CSS ACTIVE CELL}${CSS_DECK_VISIBLE} ${CSS_LAB_NOT_INTERNAL_ANCHOR}
-    ELSE
-        ${anchor_links} =    Get WebElements    css:${JLAB CSS ACTIVE DOC} ${CSS_LAB_NOT_INTERNAL_ANCHOR}
-    END
+    ${anchor_links} =    Find Cross-Document Anchor Links    ${host}
     IF    not ${anchor_links.__len__()}    RETURN
     ${href} =    Get Element Attribute    ${anchor_links[0]}    href
     IF    ${href.__contains__('''${host}''')}    RETURN
@@ -75,10 +93,41 @@ Maybe Click An Anchor And Return
     Click Element    css:${CSS_DECK_DIR_STACK} button
     Sleep    0.1s
 
-Advance Deck With Keyboard
+Find Cross-Document Anchor Links
+    [Documentation]    Find anchor links that don't reference their host.
+    [Arguments]    ${host}
+    ${anchor_links} =    Create List
+    IF    ${host.__contains__(".ipynb")}
+        ${anchor_links} =    Get WebElements
+        ...    css:${JLAB CSS ACTIVE CELL}${CSS_DECK_VISIBLE} ${CSS_LAB_NOT_INTERNAL_ANCHOR}
+    ELSE IF    ${host.__contains__(".md")}
+        ${anchor_links} =    Get WebElements
+        ...    css:${CSS_LAB_MARKDOWN_VIEWER} ${CSS_LAB_NOT_INTERNAL_ANCHOR}:not([href^\='#'])
+    END
+    ${anchor_links} =    Filter Visible Elements    ${anchor_links}
+    RETURN    ${anchor_links}
+
+Filter Visible Elements
+    [Documentation]    Filter a list down to just the visible ones.
+    [Arguments]    ${elements}
+    ${visible} =    Create List
+    Send Error Screenshots To Trash
+    FOR    ${el}    IN    @{elements}
+        TRY
+            Element Should Be Visible    ${el}
+            Append To List    ${visible}    ${el}
+        EXCEPT
+            Log    ${el} is not visible
+        END
+    END
+    RETURN    ${visible}
+    [Teardown]    Resume Screenshots
+
+Advance Notebook Deck With Keyboard
     [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
+    Send Error Screenshots To Trash
     IF    ${backup}
         Press Keys    css:body    SHIFT+SPACE
     ELSE
@@ -87,23 +136,23 @@ Advance Deck With Keyboard
     Wait Until Cell Is Not Active    ${index}    1s
     IF    ${expect.__len__()}
         Wait Until Element Contains    css:${JLAB CSS ACTIVE CELL}    ${expect}
-    ELSE
-        Sleep    0.2s
     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 Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
+    Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
 
-Really Advance Deck With Keyboard
+Really Advance Notebook Deck With Keyboard
     [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 Deck With Keyboard    ${screenshot}    ${expect}    ${backup}
+    ...    Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    ${backup}
 
 Really Back Up Deck With Keyboard
     [Documentation]    REALLY go to the up/back slide with space, wait a bit, then screenshot.
     [Arguments]    ${screenshot}=${EMPTY}    ${expect}=${EMPTY}
-    Really Advance Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
+    Really Advance Notebook Deck With Keyboard    ${screenshot}    ${expect}    backup=${TRUE}
diff --git a/atest/resources/DeckSelectors.resource b/atest/resources/DeckSelectors.resource
@@ -6,9 +6,8 @@ Documentation       Selectors defined in this repo... could be loaded from JSON?
 # body
 ${CSS_DECK_PRESENTING}              [data-jp-deck-mode="presenting"]
 
-# cells
-${CSS_DECK_VISIBLE}                 .jp-deck-mod-visible
-${CSS_DECK_ONSCREEN}                .jp-deck-mod-onscreen
+# deck
+${CSS_DECK}                         .jp-Deck
 
 # remote
 ${CSS_DECK_STOP}                    .jp-Deck-Remote .jp-deck-mod-stop
@@ -21,8 +20,11 @@ ${CSS_DECK_DIR_STACK}               .jp-Deck-Remote .jp-Deck-Remote-WidgetStack
 
 @{CSS_DECK_NEXT}                    down    forward
 @{CSS_DECK_PREV}                    up    back
+
 # notebook
 ${CSS_DECK_NOTEBOOK_BUTTON}         .jp-ToolbarButtonComponent\[data-command="deck:toggle"]
+${CSS_DECK_VISIBLE}                 .jp-deck-mod-visible
+${CSS_DECK_ONSCREEN}                .jp-deck-mod-onscreen
 
 # metadata
 ${CSS_DECK_LAYER_SELECT}            \#id-jp-decktools-select-layer

diff --git a/atest/resources/Design.resource b/atest/resources/Design.resource
@@ -62,8 +62,8 @@ Resize A Part
     IF    not ${screenshot.__len__()}    RETURN
     Capture Page Screenshot    ${screenshot}
 
-Unstyle A Part
-    [Documentation]    Use the reset button to unstyle a part.
+Unfix A Part
+    [Documentation]    Use the reset button to unfix a part.
     [Arguments]    ${index}    ${screenshot}=${EMPTY}
     ${part} =    Set Variable    ${CSS_DECK_LAYOVER_PART}:nth-child(${index})
     ${unstyle} =    Set Variable    ${part} ${CSS_DECK_LAYOVER_UNSTYLE}

diff --git a/atest/resources/Lab.resource b/atest/resources/Lab.resource
@@ -2,6 +2,7 @@
 Documentation       Keywords for working with decks.
 
 Resource            ./LabSelectors.resource
+Resource            ./Screenshots.resource
 Library             Collections
 Library             JupyterLibrary
 
@@ -26,6 +27,7 @@ Enter Command Mode
 Really Set Cell Type With Keyboard
     [Documentation]    Use the keyboard to change the cell type.
     [Arguments]    ${index}    ${type}    ${limit}=10    ${timeout}=1s
+    Send Error Screenshots To Trash
     ${ok} =    Set Variable    ${FALSE}
     WHILE    not ${ok}    limit=${limit}
         ${ok} =    Run Keyword And Return Status    Set Cell Type With Keyboard    ${index}    ${type}    ${timeout}
@@ -39,6 +41,7 @@ Really Set Cell Type With Keyboard
         END
         Sleep    0.1s
     END
+    [Teardown]    Resume Screenshots
 
 Set Cell Type With Keyboard
     [Documentation]    Use the keyboard to change the cell type.

diff --git a/atest/resources/LabSelectors.resource b/atest/resources/LabSelectors.resource
@@ -3,6 +3,12 @@ Documentation       Selectors that should maybe go upstream.
 
 
 *** Variables ***
+# lumino
+${CSS_LM_MOD_ACTIVE}                    .lm-mod-active
+${CSS_LM_MENU_ITEM_LABEL}               .lm-Menu-itemLabel
+${CSS_LM_CLOSE_ICON}                    .lm-TabBar-tabCloseIcon
+
+# lab
 ${CSS_LAB_FILES_HOME}                   .jp-BreadCrumbs-home
 ${CSS_LAB_FILES_DIR_ITEM}               .jp-DirListing-item
 ${CSS_LAB_SPINNER}                      .jp-Spinner
@@ -21,7 +27,13 @@ ${CSS_LAB_CELL_META_JSON_CM_HIDDEN}     ${CSS_LAB_MOD_HIDDEN} ${CSS_LAB_CELL_MET
 ${CSS_LAB_ADVANCED_COLLAPSE}            .jp-NotebookTools .jp-Collapse-header
 ${CSS_LAB_INTERNAL_ANCHOR}              .jp-InternalAnchorLink
 ${CSS_LAB_NOT_INTERNAL_ANCHOR}          a[href*\="#"]:not([href^="https"]):not(${CSS_LAB_INTERNAL_ANCHOR})
+${CSS_LAB_TAB_NOT_CURRENT}              .lm-DockPanel .lm-TabBar-tab:not(.jp-mod-current)
 
 # icons
 ${CSS_LAB_ICON_ELLIPSES}                [data-icon="ui-components:ellipses"]
 ${CSS_LAB_ICON_CARET_LEFT}              [data-icon="ui-components:caret-left"]
+
+# markdown
+${CSS_LAB_EDITOR}                       .jp-FileEditor
+${CSS_LAB_MARKDOWN_VIEWER}              .jp-MarkdownViewer
+${CSS_LAB_CMD_MARKDOWN_PREVIEW}         [data-command="fileeditor:markdown-preview"]
diff --git a/atest/resources/Screenshots.resource b/atest/resources/Screenshots.resource
@@ -1,12 +1,37 @@
 *** Settings ***
 Documentation       Keywords for working with screenshots
 
+Library             OperatingSystem
 Library             JupyterLibrary
 
 
+*** Variables ***
+${SCREENSHOT_TRASH}     ${OUTPUT_DIR}${/}__trash__
+${OLD_SCREENSHOTS}      ${OUTPUT_DIR}${/}screenshots
+
+
 *** Keywords ***
 Set Attempt Screenshot Directory
     [Documentation]    Set a screenshot directory that includes the attempt
     [Arguments]    ${path}
     Set Screenshot Directory
     ...    ${OUTPUT_DIR}${/}screenshots${/}${OS.lower()[:2]}_${ATTEMPT}${/}${path}
+
+Send Error Screenshots To Trash
+    [Documentation]    Throw screenshots in the trash for a while.
+    ${old_screens} =    Set Screenshot Directory    ${SCREENSHOT_TRASH}
+    Set Global Variable    ${OLD_SCREENSHOTS}    ${old_screens}
+
+Resume Screenshots
+    [Documentation]    Restore Screenshots
+    Set Screenshot Directory    ${OLD_SCREENSHOTS}
+
+Empty Screenshot Trash
+    [Documentation]    Clean out trash.
+    Run Keyword And Ignore Error
+    ...    Remove Directory    ${SCREENSHOT_TRASH}    ${TRUE}
+
+Capture Page Screenshot And Tag With Error
+    [Documentation]    Capture a screenshot if not going to the trash
+    ${path} =    Capture Page Screenshot
+    IF    "__trash__" not in "${path}"    Set Tags    screenshot:unexpected
diff --git a/atest/suites/__init__.robot b/atest/suites/__init__.robot
@@ -15,8 +15,10 @@ Force Tags          attempt:${attempt}    os:${os}    py:${py}
 Set Up Root Suite
     [Documentation]    Do global suite setup.
     Set Attempt Screenshot Directory    ${EMPTY}
+    Register Keyword To Run On Failure    Capture Page Screenshot And Tag With Error
 
 Tear Down Root Suite
     [Documentation]    Do global suite teardown.
     Close All Browsers
     Terminate All Processes
+    Empty Screenshot Trash
diff --git a/atest/suites/lab/01-examples.robot b/atest/suites/lab/01-examples.robot
@@ -14,13 +14,37 @@ Force Tags          suite:examples
 
 
 *** Test Cases ***
-The Example Can Be Navigated
+The README Markdown Can Be Navigated
     [Documentation]    All slides and fragments are reachable.
-    [Template]    Visit All Example Slides And Fragments
-    ${README_IPYNB}
-    ${README_MD}
-    ${HISTORY_IPYNB}
-    ${LAYERS_IPYNB}
+    [Tags]    activity:markdown
+    Visit All Example Slides And Fragments    ${README_MD}
+    Execute JupyterLab Command    Start Deck
+    Wait Until Element Is Visible    css:${CSS_DECK}
+    ${anchors} =    Get WebElements    css:${CSS_LAB_MARKDOWN_VIEWER} a[href\^="#"]
+    ${anchors} =    Filter Visible Elements    ${anchors}
+    Click Element    ${anchors[0]}
+    Capture Page Screenshot    readme.md-10-post-deck-anchor.png
+    Press Keys    css:body    SHIFT+SPACE
+    Capture Page Screenshot    readme.md-10-post-deck-reverse.png
+    [Teardown]    Reset Example Test
+
+The README Notebook Can Be Navigated
+    [Documentation]    All slides and fragments are reachable.
+    [Tags]    activity:notebook
+    Visit All Example Slides And Fragments    ${README_IPYNB}
+    [Teardown]    Reset Example Test
+
+The History Notebook Can Be Navigated
+    [Documentation]    All slides and fragments are reachable.
+    [Tags]    activity:notebook
+    Visit All Example Slides And Fragments    ${HISTORY_IPYNB}
+    [Teardown]    Reset Example Test
+
+The Layers Notebook Can Be Navigated
+    [Documentation]    All slides and fragments are reachable.
+    [Tags]    activity:notebook    feature:layers
+    Visit All Example Slides And Fragments    ${LAYERS_IPYNB}
+    [Teardown]    Reset Example Test
 
 
 *** Keywords ***
@@ -32,14 +56,15 @@ Visit All Example Slides And Fragments
     Capture Page Screenshot    ${stem}-00-before-deck.png
     IF    ${example.endswith('.ipynb')}
         Really Start Deck With Notebook Toolbar Button
+    ELSE IF    ${example.endswith('.md')}
+        Start Markdown Deck From Editor    ${example}
     ELSE
         Execute JupyterLab Command    Start Deck
     END
     Capture Page Screenshot    ${stem}-01-deck.png
     Visit Slides And Fragments With Remote    ${example}    ${stem}-02-walk
     Stop Deck With Remote
     Capture Page Screenshot    ${stem}-03-after-deck.png
-    [Teardown]    Reset Example Test
 
 Set Up Example Suite
     [Documentation]    Prepare for this suite.
@@ -50,4 +75,5 @@ Reset Example Test
     [Documentation]    Clean up after each test.
     Maybe Open JupyterLab Sidebar    Commands
     Execute JupyterLab Command    Stop Deck
+    Execute JupyterLab Command    Save
     Execute JupyterLab Command    Close All Tabs
diff --git a/atest/suites/lab/02-navigate.robot b/atest/suites/lab/02-navigate.robot
@@ -14,7 +14,7 @@ Suite Setup         Set Up Interactive Suite    navigate
 Suite Teardown      Tear Down Interactive Suite
 Test Teardown       Reset Interactive Test
 
-Force Tags          suite:navigate
+Force Tags          suite:navigate    activity:notebook
 
 
 *** Test Cases ***
@@ -24,8 +24,8 @@ Build and Navigate a Notebook Slide With 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 Deck With Keyboard    s0-05-advance.png    item1234
-    Really Advance Deck With Keyboard    s0-06-advance.png    item4567
+    Really Advance Notebook Deck With Keyboard    s0-05-advance.png    item1234
+    Really Advance Notebook Deck With Keyboard    s0-06-advance.png    item4567
 
 Build and Navigate a Notebook Slide With Anchors
     [Documentation]    Build and navigate a basic slide.

diff --git a/atest/suites/lab/03-layers.robot b/atest/suites/lab/03-layers.robot
@@ -14,7 +14,7 @@ Suite Setup         Set Up Interactive Suite    layers
 Suite Teardown      Tear Down Interactive Suite
 Test Teardown       Reset Interactive Test
 
-Force Tags          suite:layers
+Force Tags          suite:layers    feature:layers    activity:notebook
 
 
 *** Variables ***