cypress-cli-select 1.0.0

package/src/sortable-list.js

@@ -0,0 +1,82 @@
+const {
+  createPrompt,
+  useState,
+  useKeypress,
+  usePrefix,
+  usePagination,
+  makeTheme,
+  isUpKey,
+  isDownKey,
+  isEnterKey,
+} = require("@inquirer/core");
+const pc = require("picocolors");
+
+export const sortingList = createPrompt((config, done) => {
+  const { message, choices, pageSize = 10 } = config;
+  const theme = makeTheme({
+    icon: { cursor: pc.cyan(">") },
+    style: { highlight: pc.cyan },
+  });
+
+  const prefix = usePrefix({ theme });
+  const [status, setStatus] = useState("idle");
+
+  const [items, setItems] = useState(choices);
+  const [active, setActive] = useState(0);
+
+  if (items.length === 0) {
+    return `${prefix.idle} ${message}\n(No items to display)`;
+  }
+
+  useKeypress((key) => {
+    if (isEnterKey(key)) {
+      setStatus("done");
+      done(items);
+    } else if (isUpKey(key) || isDownKey(key)) {
+      const offset = isUpKey(key) ? -1 : 1;
+
+      if (key.shift) {
+        // Reorder the items with Shift + Arrow
+        const newIndex = active + offset;
+        if (newIndex >= 0 && newIndex < items.length) {
+          const newItems = [...items];
+          [newItems[active], newItems[newIndex]] = [
+            newItems[newIndex],
+            newItems[active],
+          ];
+          setItems(newItems);
+          setActive(newIndex); // Update active position
+        }
+      } else {
+        // Navigate the list
+        const newActive = active + offset;
+        if (newActive >= 0 && newActive < items.length) {
+          setActive(newActive);
+        }
+      }
+    }
+  });
+
+  const page = usePagination({
+    items,
+    active,
+    renderItem({ item, isActive }) {
+      const cursor = isActive ? theme.icon.cursor : " ";
+      const color = isActive ? theme.style.highlight : (text) => text;
+
+      return color(`${cursor} ${pc.bold(item)}`);
+    },
+    pageSize,
+    loop: false, // Disable loop
+  });
+
+  if (status === "done") {
+    return `${theme.prefix.idle} ${pc.bold(message)} ${pc.cyan(items).toString()}`;
+  }
+  const helpermessage = `(use arrow keys to navigate, shift+up/down to reorder, enter to confirm)`;
+  return `${theme.prefix.idle} ${pc.bold(message)}\n${page}\n${pc.dim(
+    helpermessage,
+  )}`;
+});
+
+module.exports = { sortingList };

package/tapes/run-help.tape

@@ -0,0 +1,94 @@
+
+# VHS documentation
+#
+# Output:
+#   Output <path>.gif               Create a GIF output at the given <path>
+#   Output <path>.mp4               Create an MP4 output at the given <path>
+#   Output <path>.webm              Create a WebM output at the given <path>
+#
+# Require:
+#   Require <string>                Ensure a program is on the $PATH to proceed
+#
+# Settings:
+#   Set FontSize <number>           Set the font size of the terminal
+#   Set FontFamily <string>         Set the font family of the terminal
+#   Set Height <number>             Set the height of the terminal
+#   Set Width <number>              Set the width of the terminal
+#   Set LetterSpacing <float>       Set the font letter spacing (tracking)
+#   Set LineHeight <float>          Set the font line height
+#   Set LoopOffset <float>%         Set the starting frame offset for the GIF loop
+#   Set Theme <json|string>         Set the theme of the terminal
+#   Set Padding <number>            Set the padding of the terminal
+#   Set Framerate <number>          Set the framerate of the recording
+#   Set PlaybackSpeed <float>       Set the playback speed of the recording
+#   Set MarginFill <file|#000000>   Set the file or color the margin will be filled with.
+#   Set Margin <number>             Set the size of the margin. Has no effect if MarginFill isn't set.
+#   Set BorderRadius <number>       Set terminal border radius, in pixels.
+#   Set WindowBar <string>          Set window bar type. (one of: Rings, RingsRight, Colorful, ColorfulRight)
+#   Set WindowBarSize <number>      Set window bar size, in pixels. Default is 40.
+#   Set TypingSpeed <time>          Set the typing speed of the terminal. Default is 50ms.
+#
+# Sleep:
+#   Sleep <time>                    Sleep for a set amount of <time> in seconds
+#
+# Type:
+#   Type[@<time>] "<characters>"    Type <characters> into the terminal with a
+#                                   <time> delay between each character
+#
+# Keys:
+#   Escape[@<time>] [number]        Press the Escape key
+#   Backspace[@<time>] [number]     Press the Backspace key
+#   Delete[@<time>] [number]        Press the Delete key
+#   Insert[@<time>] [number]        Press the Insert key
+#   Down[@<time>] [number]          Press the Down key
+#   Enter[@<time>] [number]         Press the Enter key
+#   Space[@<time>] [number]         Press the Space key
+#   Tab[@<time>] [number]           Press the Tab key
+#   Left[@<time>] [number]          Press the Left Arrow key
+#   Right[@<time>] [number]         Press the Right Arrow key
+#   Up[@<time>] [number]            Press the Up Arrow key
+#   Down[@<time>] [number]          Press the Down Arrow key
+#   PageUp[@<time>] [number]        Press the Page Up key
+#   PageDown[@<time>] [number]      Press the Page Down key
+#   Ctrl+<key>                      Press the Control key + <key> (e.g. Ctrl+C)
+#
+# Display:
+#   Hide                            Hide the subsequent commands from the output
+#   Show                            Show the subsequent commands in the output
+
+# Where should we write the GIF?
+Output assets/run-help.gif
+
+# Set fontsize and width/height
+Set FontSize 20
+Set Width 1600
+Set Height 1000
+
+# Set margin + color
+Set Margin 50
+Set MarginFill "#5f76d9"
+Set BorderRadius 10
+
+# Set window bar 
+Set WindowBar Colorful
+Set WindowBarSize 60
+
+# Set theme 
+Set Theme "nord"
+
+# Type a command in the terminal.
+Type@100ms "npx cypress-cli-select run --help"
+
+# Hide the npx loader
+Hide
+
+# Run the command
+Enter
+
+# Await the help menu 
+Wait+Screen /Interactive cli prompts to select Cypress/
+
+# Now restart recording
+Show
+Sleep 8s
+

package/tapes/run-spec-tag.tape

@@ -0,0 +1,163 @@
+# VHS documentation
+#
+# Output:
+#   Output <path>.gif               Create a GIF output at the given <path>
+#   Output <path>.mp4               Create an MP4 output at the given <path>
+#   Output <path>.webm              Create a WebM output at the given <path>
+#
+# Require:
+#   Require <string>                Ensure a program is on the $PATH to proceed
+#
+# Settings:
+#   Set FontSize <number>           Set the font size of the terminal
+#   Set FontFamily <string>         Set the font family of the terminal
+#   Set Height <number>             Set the height of the terminal
+#   Set Width <number>              Set the width of the terminal
+#   Set LetterSpacing <float>       Set the font letter spacing (tracking)
+#   Set LineHeight <float>          Set the font line height
+#   Set LoopOffset <float>%         Set the starting frame offset for the GIF loop
+#   Set Theme <json|string>         Set the theme of the terminal
+#   Set Padding <number>            Set the padding of the terminal
+#   Set Framerate <number>          Set the framerate of the recording
+#   Set PlaybackSpeed <float>       Set the playback speed of the recording
+#   Set MarginFill <file|#000000>   Set the file or color the margin will be filled with.
+#   Set Margin <number>             Set the size of the margin. Has no effect if MarginFill isn't set.
+#   Set BorderRadius <number>       Set terminal border radius, in pixels.
+#   Set WindowBar <string>          Set window bar type. (one of: Rings, RingsRight, Colorful, ColorfulRight)
+#   Set WindowBarSize <number>      Set window bar size, in pixels. Default is 40.
+#   Set TypingSpeed <time>          Set the typing speed of the terminal. Default is 50ms.
+#
+# Sleep:
+#   Sleep <time>                    Sleep for a set amount of <time> in seconds
+#
+# Type:
+#   Type[@<time>] "<characters>"    Type <characters> into the terminal with a
+#                                   <time> delay between each character
+#
+# Keys:
+#   Escape[@<time>] [number]        Press the Escape key
+#   Backspace[@<time>] [number]     Press the Backspace key
+#   Delete[@<time>] [number]        Press the Delete key
+#   Insert[@<time>] [number]        Press the Insert key
+#   Down[@<time>] [number]          Press the Down key
+#   Enter[@<time>] [number]         Press the Enter key
+#   Space[@<time>] [number]         Press the Space key
+#   Tab[@<time>] [number]           Press the Tab key
+#   Left[@<time>] [number]          Press the Left Arrow key
+#   Right[@<time>] [number]         Press the Right Arrow key
+#   Up[@<time>] [number]            Press the Up Arrow key
+#   Down[@<time>] [number]          Press the Down Arrow key
+#   PageUp[@<time>] [number]        Press the Page Up key
+#   PageDown[@<time>] [number]      Press the Page Down key
+#   Ctrl+<key>                      Press the Control key + <key> (e.g. Ctrl+C)
+#
+# Display:
+#   Hide                            Hide the subsequent commands from the output
+#   Show                            Show the subsequent commands in the output
+
+# Where should we write the GIF?
+Output assets/run-spec-tag.gif
+
+# Set fontsize and width/height
+Set FontSize 20
+Set Width 1600
+Set Height 1000
+
+# Set margin + color
+Set Margin 50
+Set MarginFill "#5f76d9"
+Set BorderRadius 10
+
+# Set window bar 
+Set WindowBar Colorful
+Set WindowBarSize 60
+
+# Set theme 
+Set Theme "nord"
+
+Hide
+# Type a command in the terminal.
+Type@100ms "npx cypress-cli-select run"
+
+# Run the command
+Enter
+
+# Await the cli title and first prompt
+Wait+Screen /Cypress-cli-select/
+Wait+Screen /Choose to filter by specs, specific test titles or tags/
+
+# Now restart recording
+Sleep 1s
+
+# Ensure the first prompt choices are visible on screen
+Wait+Screen /Specs/
+Wait+Screen /Test titles or tags \(requires cy-grep\)/
+
+# Select all options
+Down
+Sleep 1s
+Tab
+
+Sleep 1s
+
+# Confirm 
+Enter
+
+# Await the second prompt for titles or tags
+Wait+Screen /Choose to filter by specific test titles or tags/
+Wait+Screen /Test titles \(requires cy-grep\)/
+Wait+Screen /Test tags \(requires cy-grep\)/
+
+Show
+Sleep 1s
+Down
+Sleep 1s
+
+# Submit tags
+Enter
+
+# Await tag list
+Wait+Screen /Select tags to run/
+Wait+Screen /@smoke/
+Wait+Screen /@p2/
+Wait+Screen /@nightly/
+Wait+Screen /@p3/
+Wait+Screen /@sanity/
+Wait+Screen /@p1/
+
+Sleep 2s
+
+# Type a search in the prompt 
+Type@200ms "sanity"
+
+# Await the test list to show search result
+Wait+Screen /@sanity/
+Sleep 2s
+
+# Select tag 
+Tab 
+
+Sleep 2s
+
+# Remove selected tag
+Backspace
+
+Sleep 1s
+
+# Type a new search in the prompt
+Type@200ms "nightly"
+
+# Await the tag list to show search result
+Wait+Screen /@nightly/
+
+# Select new tag
+Tab
+
+Sleep 2s
+
+Hide
+# Confirm 
+Enter
+
+# Await the cypress run title to show
+Wait+Screen /Running Cypress/

package/tapes/run-spec-title.tape

@@ -0,0 +1,191 @@
+# VHS documentation
+#
+# Output:
+#   Output <path>.gif               Create a GIF output at the given <path>
+#   Output <path>.mp4               Create an MP4 output at the given <path>
+#   Output <path>.webm              Create a WebM output at the given <path>
+#
+# Require:
+#   Require <string>                Ensure a program is on the $PATH to proceed
+#
+# Settings:
+#   Set FontSize <number>           Set the font size of the terminal
+#   Set FontFamily <string>         Set the font family of the terminal
+#   Set Height <number>             Set the height of the terminal
+#   Set Width <number>              Set the width of the terminal
+#   Set LetterSpacing <float>       Set the font letter spacing (tracking)
+#   Set LineHeight <float>          Set the font line height
+#   Set LoopOffset <float>%         Set the starting frame offset for the GIF loop
+#   Set Theme <json|string>         Set the theme of the terminal
+#   Set Padding <number>            Set the padding of the terminal
+#   Set Framerate <number>          Set the framerate of the recording
+#   Set PlaybackSpeed <float>       Set the playback speed of the recording
+#   Set MarginFill <file|#000000>   Set the file or color the margin will be filled with.
+#   Set Margin <number>             Set the size of the margin. Has no effect if MarginFill isn't set.
+#   Set BorderRadius <number>       Set terminal border radius, in pixels.
+#   Set WindowBar <string>          Set window bar type. (one of: Rings, RingsRight, Colorful, ColorfulRight)
+#   Set WindowBarSize <number>      Set window bar size, in pixels. Default is 40.
+#   Set TypingSpeed <time>          Set the typing speed of the terminal. Default is 50ms.
+#
+# Sleep:
+#   Sleep <time>                    Sleep for a set amount of <time> in seconds
+#
+# Type:
+#   Type[@<time>] "<characters>"    Type <characters> into the terminal with a
+#                                   <time> delay between each character
+#
+# Keys:
+#   Escape[@<time>] [number]        Press the Escape key
+#   Backspace[@<time>] [number]     Press the Backspace key
+#   Delete[@<time>] [number]        Press the Delete key
+#   Insert[@<time>] [number]        Press the Insert key
+#   Down[@<time>] [number]          Press the Down key
+#   Enter[@<time>] [number]         Press the Enter key
+#   Space[@<time>] [number]         Press the Space key
+#   Tab[@<time>] [number]           Press the Tab key
+#   Left[@<time>] [number]          Press the Left Arrow key
+#   Right[@<time>] [number]         Press the Right Arrow key
+#   Up[@<time>] [number]            Press the Up Arrow key
+#   Down[@<time>] [number]          Press the Down Arrow key
+#   PageUp[@<time>] [number]        Press the Page Up key
+#   PageDown[@<time>] [number]      Press the Page Down key
+#   Ctrl+<key>                      Press the Control key + <key> (e.g. Ctrl+C)
+#
+# Display:
+#   Hide                            Hide the subsequent commands from the output
+#   Show                            Show the subsequent commands in the output
+
+# Where should we write the GIF?
+Output assets/run-spec-title.gif
+
+# Set fontsize and width/height
+Set FontSize 20
+Set Width 1600
+Set Height 1000
+
+# Set margin + color
+Set Margin 50
+Set MarginFill "#5f76d9"
+Set BorderRadius 10
+
+# Set window bar 
+Set WindowBar Colorful
+Set WindowBarSize 60
+
+# Set theme 
+Set Theme "nord"
+
+# Type a command in the terminal.
+Type@150ms "npx cypress-cli-select run"
+
+# Hide the npx loader
+Hide
+
+# Run the command
+Enter
+
+# Await the cli title and first prompt
+Wait+Screen /Cypress-cli-select/
+Wait+Screen /Choose to filter by specs, specific test titles or tags/
+
+# Now restart recording
+Show
+Sleep 1s
+
+# Ensure the first prompt choices are visible on screen
+Wait+Screen /Specs/
+Wait+Screen /Test titles or tags \(requires cy-grep\)/
+
+# Select all options
+Ctrl+a
+
+Sleep 2s
+
+# Confirm 
+Enter
+
+# Await the second prompt for titles or tags
+Wait+Screen /Choose to filter by specific test titles or tags/
+Wait+Screen /Test titles \(requires cy-grep\)/
+Wait+Screen /Test tags \(requires cy-grep\)/
+
+Sleep 2s
+
+# Submit titles
+Enter
+
+# Await the spec list
+Wait+Screen /Select specs to run/
+Wait+Screen /todo\.cy\.js/
+Wait+Screen /actions\.cy\.js/
+
+Sleep 2s
+
+# Type a search in the prompt
+Type@100ms "misc"
+# Await the spec list to show search result
+Wait+Screen /misc\.cy\.js/
+
+Sleep 2s
+
+# Select spec by pressing tab 
+Tab 
+
+Sleep 2s
+
+# Confirm spec
+Enter
+
+# Await test list
+Wait+Screen /Select tests to run/
+Wait+Screen /todo\.cy\.js > example to-do app > displays two todo items by default/
+Wait+Screen /actions\.cy\.js > Actions > \.type\(\) - type into a DOM element/
+
+Sleep 2s
+
+# Type a search in the prompt 
+Type@200ms "navigation"
+
+# Await the test list to show search result
+Wait+Screen /navigation\.cy\.js > Navigation > cy\.reload\(\) - reload the page/
+Sleep 2s
+
+# Move down two
+Down 
+Sleep 1s
+Down 
+Sleep 1s
+
+# Select title 
+Tab 
+
+Sleep 2s
+
+# Remove selected title
+Backspace
+
+Sleep 1s
+
+# Type a new search in the prompt
+Type@200ms "window"
+
+# Await the test list to show search result
+Wait+Screen /window\.cy\.js > Window > cy\.title\(\) - get the title/
+
+# Move down two
+Down 
+Sleep 1s
+Down 
+Sleep 1s
+
+# Select new title
+Tab
+
+Sleep 2s
+
+# Confirm 
+Enter
+
+# Await the cypress run title to show
+Wait+Screen /Running Cypress/
+